운영중인 앱에서 출석체크 이벤트를 도입하게 되었다. 출석체크 이벤트는 사용자들에게 매일 자정에 접속하여 출석체크를 하면 보상을 제공하는 간단한 메커니즘이다. 하지만... 예상했던 것 이상으로 수만 명의 사용자들로부터 동시에 들어오는 출석체크 요청의 폭풍에 직면했다. 동시성 문제 수만 명의 사용자들로부터 동시에 들어오는 요청을 처리하는 것은 결코 간단한 일이 아니었다. 서버의 자원은 한정되어 있고, 동시에 너무 많은 요청이 처리될 경우 데이터베이스 충돌, 성능 저하, 심지어는 서비스 다운에 이르기도 한다. 이는 단순히 기술적인 도전을 넘어, 우리 서비스의 안정성과 사용자의 신뢰성에 대한 문제였다. CloudWatch를 확인해보면 출석체크가 시작되는 밤 12시 (UTC 15:00)에 API 요청이 수만 건으..
회사에 백엔드파트 리더로 전 야놀자 리더분께서 오셨다. 오셔서 코드품질과 성능개선에 대해서 설명해주시는데, 그동안 내가 쓰레기같은 코드들만 빨리 짜고 있었구나 싶었다..🥲 그래서 요새는 기존 코드들을 하나씩 리팩토링에 들어가고있다. TypeOrm을 좀 효율적으로 잘 쓰자고 강조하셨다. 그래서 오늘은 TypeOrm의 loadRelationCountAndMap() 메서드에 대해서 포스팅을 해보려한다. 우선 기존 코드를 먼저 확인해보자. 기존 Code 사진속 코드에 대해서 설명을 하자면 투표 댓글 작성 API 인데, 존재하지 않는 투표거나, 종료된 투표가 내가 참여한 투표가 아니면 댓글을 못달게 에러를 return하는 로직이였다. vote Repository / voting Repository로 두번 DB C..
소셜로그인 1편에 이어서 바로 2편을 포스팅하려 했는데 refresh_token과 JWT 전략에 대해서 이것저것 머리싸매면서 고민하느라 늦어졌다.. 정말 다양한 JWT 전략과 고민할 사항이 많았다. 한 계정으로 여러 디바이스에서 로그인을 할 수도 있고, access_Token 만료시 refresh-API 실행 타이밍을 백엔드에서 만료를 체크해서 할 지, 아니면 프론트엔드에서 access_Token "exp"로 만료 체크해서 API 요청할지 등등... 바로 본론으로 들어가기전에 소설로그인 1편을 꼭 보고오시길 ! https://ilikezzi.tistory.com/64 [Nest.JS] 구글, 네이버, 카카오 소셜로그인 구현 - 1 진행중인 사이드 프로젝트에서 기획이 끝나서 화면기획서가 나오고, 디자인쪽도..
진행중인 사이드 프로젝트에서 기획이 끝나서 화면기획서가 나오고, 디자인쪽도 피그마로 UI/UX 디자인을 시작하고, 개발쪽도 DB ERD 설계, 서버설계, Stg서버 등등.. 기본적인 개발하기 위한 준비를 마치고 온보딩, 메인페이지 부터 드디어 Api 작업에 들어갔다. 막상 개발은 큰 어려움이 없을텐데, 역시나 처음해보는 기획이나 DB/서버 설계에서 시간이 많이 걸리고, 제대로 처음 해보는거라서 어렵더라.. 따로 Local 이메일 로그인은 제외하고 구글 / 카카오 / 네이버 로그인 세가지를 넣기로 했다. NestJS에서 소셜 로그인을 붙히기 위해서는 순서에 대한 이해가 필요하다. 하나씩 차근차근 살펴보자. 소셜 로그인 순서 내가 이해한 순서를 이해하기 쉽게 그림으로 만들어 보았다. (디자인 감각 Zero ..
운영중인 서비스에서 응답시간이 느려진 부분이 있어서, 이를 개선하고 싶었다. 마침 유저 구분이 필요 없고, 수정이 거의 없는 페이지라서 캐싱 전략을 사용하기 적합해 보였다! 해당 페이지에 대해 간략하게 설명하자면, 당일 새벽시간의 뉴스데이터를 전부 분석을 해서 아침 8시에 그날의 뉴스를 한눈에 정리해서 보여주는 페이지다. 따라서 유저별로 개인화가 들어가는 페이지도 아니고, 웬만해서는 수정이 이뤄지지 않는 API 이다. 그럼 바로 캐싱작업을 시작해보자. 설치 해당 프로젝트로 이동해서 필요한 패키지를 몇가지 설치해주자. npm install cache-manager cache-manager: 캐싱을 담당할 라이브러리다. npm install @nestjs/common nestjs의 CACHE_MANAGER:..
회사에서 협업툴로 Slack을 사용하고 있는데, 각종 통계자료 몇 로그데이터를 매일 알림으로 보내주면 좋을 것 같았다. 그래서 무슨데이터를 전송해주면 좋을지 고민하다가 1.전체 유저수 / 2.가입자수 / 3.기사 조회수 / 4.언론사별 기사 발행수 / 5.댓글수 / 6.DAU / 7.WAU 해당 7가지 데이터를 보여주기로 결정했다. Slack bot을 통한 axios와 schedule를 사용해서 자동화를 시켜줄 것이다. 우선 Slack bot을 만들자. https://api.slack.com/apps/ 해당 URL에 접속하여 슬랙봇을 생성을 하고, https://api.slack.com/methods 다음 URL에서 슬랙봇의 chat.postMessage 권한을 추가해 주도록 하자. 그 후 Install..
오늘은 백엔드 개발에 있어서 필수적이라 생각하는 페이지네이션에 대해서 포스팅을 해보려고 한다. 우선 페이지네이션에 대해서 간략하게 설명하자면, 흔히 페이지수(쪽수)를 매기로 정렬할 떄 쓰이는 개념으로써 웹에서 자주 다루게 된다. 나도 마찬가지도 이번 프로젝트 개발을 하면서 페이지네이션을 상당히 많이 사용하였다. 댓글 목록 투표 목록 팔로잉 목록 차단 목록 북마크 목록 선물함 목록 포인트 내역 목록 이벤트 목록 내가 본 뉴스 목록 알림 목록 등등.. 이 처럼 거의 대부분에 목록(@GET) 에서는 페이지네이션을 사용하였다. 우선 알림쪽을 사진으로 간략하게 보자. 해당 사진은 알림 목록 쪽 사진인데, 아래로 스크롤하면서 10개씩 끊어서 로딩해서 보여주게끔 해준다. 즉, 한번에 많은 양을 로딩해서 보여주는것이 ..
벌써 일주일이나 포스팅을 하지 못했다. 개발중인 서비스 런칭일이 한달도 남지않아서 UnitTest랑 QA랑 협업업체 대응 하느라 정신이없다... 한달전에 내가 개발한 코드를 보면 왜 이렇게 짰나 어질어질하다. 그만큼 가파르게 성장하고 있다는 반증인 것 같아서 내심 뿌듯하기도 하다 ^__^ 본론으로 돌아와서 프로젝트를 하면서 자주 사용하지만 그 차이점을 제대로 모르고 사용했던게 있다. 바로 DTO 와 Interface 이다. 두개가 비슷하다고 생각해서 이 케이스에서는 둘중에 뭘 쓰는게 맞는거지? 하고 고민했던적이 많았다. 오늘 두개의 비슷한 점과 명확히 다른점에 대해 알아보고 제대로 이해를 해 볼 것이다. DTO란? 말그대로 Data Transfer Object, 계층간 데이터 교환을 위해 사용하는 객체..
요새 외부업체들과 협업이 잦아지면서 API를 연동 시키기 위해 Axios를 많이 사용하고 있다. 그래서 이 참에 Axios에 대해서 제대로 알고 사용할 겸 포스팅을 해보려고 한다. 우선, Axios란 ? Http클라이언트 라이브러리로서, 웹 애플리케이션에서 웹 API와 통신하는 데 사용되며, 웹 브라우저와 Node.js 환경 모두에서 사용할 수 있다. 1. Promise 기반 Axios는 Promise 기반으로 작성되어 있어서, 콜백 대신 .then()과 .catch() 또는 async/await를 사용하여 비동기 작업을 처리할 수 있다 . 이를 통해 비동기 작업을 처리 시, 코드의 가독성과 유지 관리성이 향상된다. 2. HTTP 메서드 지원 Axios는 다양한 HTTP 메서드 (GET, POST, PU..
오늘은 DTO 객체의 키 이름을 @Transform 데코레이터를 사용하여 바꾸는 방법에 대해 포스팅을 할 것이다. 음,, 이렇게만 얘기해서는 무슨소린지 헷갈리니 바로 예제 코드로 보자. findBookmark=[ { target_uuid: 123, name: Blanc, ... }, { target_uuid: 234, name: Jack, ... }, { target_uuid: 345, name: Scott, ... } ] ///////////////////////////// BookmarkReadDto={ @Expose() @ApiProperty() uuid: string; @Expose() @ApiProperty( name: string; ... } 변수 findBookmark : [] 와 Bookm..
