Mixin in CSS

Today I Learned 날짜 2024년 1월 7일 화요일 내용 믹스인 CSS에서도 공통된 스타일을 적용할 수 있고, 함수처럼 변수를 넣어 특정 스타일을 가변으로 둘 수도 있다고 한다. 믹스인이라는 건데… 1 2 3 4 5 6 7 // 정의 .flex-row (@justify: center, @gap: 0) { display: flex; align-items: center; justify-content: @justify; gap: @gap; } 이런식으로 정의하고 ...

2025년 1월 7일 · 1 분 · 배준수

페이스북 로그인 구현하기

Today I Learned 날짜 2024년 1월 6일 월요일 내용 페이스북 로그인을 구현하자 결국 태그된 게시물을 가져오기 위해, 페이스북 로그인을 추가해주기로 했다. 이전에 해봤던 작업이기 때문에 전체적인 틀이나 방식에 대해선 잘 알고 있다. 페이지와 인스타그램 비즈니스 계정은 1대1 관계라., 계정정보를 저장하는 테이블에 페이스북 페이지 정보와 토큰을 저장하는 필드를 추가했다. 구현하다가 알게된건 이전에 내가 이용했던 것과는 다른듯 하다.. 예전에는 페이스북 API에 접근하기 위한 페이스북 로그인을 구현했었다. 이번에는 인스타그램 API를 접근하기 위한 페이스북 로그인을 구현하기 때문에 조금 달랐다. 실제로 전자는 페이지 정보를 모두 가져와서 유저가 인스타그램 비즈니스 계정이 연결된 페이지를 선택하는 기능을 우리가 직접 만들어야 했는데 후자는 페이스북 쪽에서 제공하는 화면에서 다 처리되서 편하다. 지금에서야 이해가 되었으니 편하지 만들때는 헷갈려 죽을 뻔했지만… ...

2025년 1월 6일 · 2 분 · 배준수

51% 풀스택 개발자 되기

Today I Learned 날짜 2024년 1월 3일 금요일 내용 51% 스택 개발자 되기 반쪽자리 풀스택 개발자에서 조금은 진화하는 중이다. 백오피스에 모든 스크립트를 정보를 불러오고, 현재 설치된 스크립트를 불러와 비교한 후 설치된것과 안된것을 구별하는 코드를 작성했다. 1 2 3 4 5 6 7 8 9 10 11 combineScriptLists() { ... 기존 코드 if (appType !== undefined) { ... 진행 로직 ... } else { console.warn(`Invalid appTypeKey: ${appTypeKey}`); } }); } } 이렇게 짰는데.. 존경하는 프론트엔드 동료분께 리뷰를 받았다. ...

2025년 1월 3일 · 2 분 · 배준수

범인은 메타였다.

Today I Learned 날짜 2025년 1월 2일 목요일 내용 범인은 메타일지 모른다. 태그된 게시물이 불러와지지 않는다는 이슈가 또 접수되어… 희망 없이 인터넷을 맴돈지도 일주일이 넘은듯 하다. 이세상에 나와 같은 이슈를 겪는 자는 정말 없을까… 현재 서비스 이용자 전체를 조회해보니 700개가 넘은 인스타그램 계정 중에 239개만 태그된 게시물을 불러올 수 있고, 539개 계정에선 불러와지지 않는다. 대체 이게 무슨일이람… 도저히 진척되지 않는 상황에 지쳐서 GG를 쳤고 다른 서비스에서는 잘 되는지 확인해보았다. 정말 내 문제인지, 메타의 문제인지… 그런데 거기서도 우리랑 똑같은 오류가 뜬다. 진짜 메타에서 제대로 안주는 게 원인일 지도 모른다는 의미다! ...

2025년 1월 2일 · 1 분 · 배준수

권장하지 않는 방법과 편한 방법

Today I Learned 날짜 2024년 12월 31일 화요일 내용 권장되지 않는 방법은 해도 될까? 네이버 상품 상세정보에서 내가 추가한 태그를 확인해야 한다. 어떤 경우에 어떻게 변하는지 확인하기 위해 구체적으로 테스트 케이스를 설정했다. 약간의 배경지식을 더하자면 상품 상세정보 페이지는 HTML로 직접 작성하는 방식과 스마트에디터원을 사용하는 방식 2가지가 이용된다. 스마트에디터원은 HTML을 사용할 줄 모르는 사람을 위한 손쉬운 편집기 느낌이다. 사용자가 스마트에디터원으로 작성한 상품을 API로 수정할 경우, HTML 형식으로 무조건 변경된다. 그리고 HTML을 스마트에디터원으로 변경할 경우, 내용이 반영되지 않고 모두 제거된채 처음부터 다시 작성해야 한다. ...

2024년 12월 31일 · 3 분 · 배준수

되는 게 없는 날

Today I Learned 날짜 2024년 12월 30일 월요일 내용 되는게 정말 단 하나도 없는 닶도 없는 날이다. 네이버 상품 상세정보 조회하기 매주 월요일 오전, 네이버 상품 상세정보에 추가해놓은 이미지를 새로운 것으로 업데이트해야 한다. 이때 사용자가 상품 상세페이지에서 배너 이미지를 지웠다면 업데이트를 진행하지 않고 연동 중지 상태로 멈춘다. 따라서 업데이트 진행은 상품 상세정보에 저번주에 생성한 이미지가 있는 지에 따라 결정된다. 배너이미지의 HTML은 일정한 형식을 가진다. <a> 태그로 둘러쌓여있고, 안에는 <img> 태그가 있다. 이미지의 링크는 S3인데 내부 디렉토리도 정해진 규칙이 있다. 그래서 ...

2024년 12월 30일 · 2 분 · 배준수

태그된 게시물이 불러와지지 않음

Today I Learned 날짜 2024년 12월 27일 금요일 내용 태그된 게시물 태그된 게시물이 불러와지지 않는다는 이슈가 들어왔다. 확인해보니 진짜 안들어온다. 문제는 누구는 들어오고 누구는 들어오지 않는다는 것이다… {“error”:{“message”:“Unsupported request - method type: get”,“type”:“IGApiException”,“code”:100,“fbtrace_id”:“AJeSMqmb-9xrcVdqxJ9xf3L”}} 차라리 들어오는 계정이 눈에 띄는 특징(우리 테스트 계정만 들어온다던가)이라도 있었으면 답을 찾았을텐데 도저히 찾지 못했다. 태그된 게시물을 불러올 수 있는 계정과 불러올 수 없는 계정을 온갖 방법으로 비교해봤다. 액세스토큰 디버그 https://developers.facebook.com/tools/debug/accesstoken/ 에 들어가면 페이스북에서 받은 액세스 토큰을 디버그할 수 있다. 둘다 가진 권한이 똑같고, 유효한 토큰이라 토큰의 문제는 아니었다. ...

2024년 12월 27일 · 1 분 · 배준수

while문 무한루프가 발생한 이유

Today I Learned 날짜 2024년 12월 26일 목요일 내용 무한 루프 인스타그램에서 필요한 데이터들을 가져오는데 상당히 지나치게 오래걸린다. 이게 데이터가 많아서 그런거라고 생각했는데.. 충격적이게도 아주 허무한 코드 오류가 있었다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 url = f"https://graph.instagram.com/{instagram_post.post_id}/comments" params = { "access_token": self.instagram_account.access_token, "fields": "timestamp,text,from,like_count", "limit": 50, } response = requests.get(url, params=params) res_json = response.json() if "data" in res_json: comment_arr += res_json["data"] while "paging" in res_json and "next" in res_json["paging"]: response = requests.get(res_json["paging"]["next"]) res = response.json() if "data" in res: comment_arr += res["data"] 이 코드였는데… 댓글이 50개 이상 있을 경우, 다음 페이지에 요청을 지속해서 보내는 반복문이다. 더이상 다음 페이지가 없을 때까지 반복된다. while문 안에서 새로 받아온 데이터를 res_json 이 아닌 res 로 지정해버렸다.. 그래서 res_json 은 최초로 보낸 요청의 것으로 계속 유지되어서 안에 while 문이 유지될 조건이 계속 충족되는 상태였고, 계속 똑같은 요청을 무한대로 보내고 있었다. 바보도 이런 바보가… ...

2024년 12월 26일 · 1 분 · 배준수

Postgresql Secondary Table에 필드 추가하기

Today I Learned 날짜 2024년 12월 24일 화요일 내용 secondary table에 필드를 추가하기 네이버 배너이미지에는 인스타그램 게시글의 사진이 포함될 수 있다. 한 게시글은 당연히 여러 이미지에 포함될 수도 있다. many to many를 설계 과정에서 어떻게 처리할지 고민하다가 secondary table로 구현했다. id로 4를 가진 네이버 배너이미지데이터가 생성되고 이 배너이지에 포함되는 게시글 3개의 id가 1,3,5라면 naver_banner_image_id instagram_post_id 4 1 4 3 4 5 secondary table에는 이렇게 저장이 된다. 만약 id가 12인 네이버 배너이미지가 생성되고 게시글을 3,5,22 를 id로 하는 데이터들을 포함한다면 ...

2024년 12월 24일 · 2 분 · 배준수

대형 고객님은 처음이라..

Today I Learned 날짜 2024년 12월 23일 월요일 내용 네이버 커머스 솔루션 쪽에 상당히 큰 업체가 들어왔다. 인스타그램에서 가져와야할 댓글만 16만개인데, 저장이 안되어있다. 실서버 EC2 로 돌려봤는데 몇시간 째 끝날 생각을 안한다… 잘 되고 있는거 맞나.. 회고 아프지 말자

2024년 12월 23일 · 1 분 · 배준수