정말 오랜만에 하는 포스팅이다 ! 최근에 프로젝트, 회사업무, 코딩테스트 준비때매 너무 정신없이 바빴다. 프로젝트는 기획이 어느정도 나오고 한달 넘게..? 걸려서 모든 API 개발을 완료했다. 처음에는 간단하게 하려고 했는데 점점 욕심이 생겨서 API도 50개 넘게 생겨버렸다...^^ 예비군 동미참 가느라 3일 빼고 전부 달렸네.. 따흑 그래도 내꺼를 만드니깐 확실히 재밌긴하다 ! 프로젝트에서 "테마" 를 고르는 부분이있는데 각각의 테마에 이모지가 붙어있어서 해당 이모지를 "코스이름"을 만들어줄때 붙혀주기로 했다. 이런식으로 코스이름에 이모지를 붙여 줘야 한다. 그래서 API 로직을 짜고 실행을 시켰더니 에러가 나왔다. 엥 이게 뭐지 싶었다. 그래서 ChatGPT 와 구글링을 해봤다. 이모지를 저장하려면..
회사에 백엔드파트 리더로 전 야놀자 리더분께서 오셨다. 오셔서 코드품질과 성능개선에 대해서 설명해주시는데, 그동안 내가 쓰레기같은 코드들만 빨리 짜고 있었구나 싶었다..🥲 그래서 요새는 기존 코드들을 하나씩 리팩토링에 들어가고있다. 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 ..
오늘은 5단원인 "클로저" 를 포스팅 할 것이다. 클로저(closure)는 자바스크립트에서 중요한 개념 중 하나지만, 사실 이번에 처음 제대로 파본다... 실행 컨텍스트에 대한 사전지식이 없으면 분명 이해가 안 갈 것이다. 마침 2단원에서 실행컨텍스트를 다뤘으니 꼭! 꼭! 보고 오길 권장한다. https://ilikezzi.tistory.com/55 [Javascript] 실행 컨텍스트_코어 자바스크립트 저번에 포스팅한 "데이터 타입" 에 이어서 다음 챕터인 "실행 컨텍스트"를 포스팅 할 것이다. https://ilikezzi.tistory.com/52 [Javascript] 데이터 타입_코어 자바스크립트 계획했던대로 자격증 취득도 다 ilikezzi.tistory.com 05. 클로저 클로저의 의미 및..
저번주에 숙명여대에서 Bigdata/AI Streamlit 해커톤을 진행했다. 나는 AWS 멘토로 참여하게 되어서 간략하게 후기를 써보려고 한다. 저번 인하대 해커톤 AWS 멘토로 참여했을때, 멘토진들이랑 거의 동일해서 반가웠다ㅎㅎ 이번 해커톤은 오뚜기가 후원사여서 오뚜기의 상품 판매 데이터와, 제품 리뷰 데이터를 받아서 진행했다. 해당 데이터와 생성형 AI를 활용하여 Streamlit or Cloud native app을 개발을 하였다. Streamlit에 대해서 이번기회에 처음 접하게 되었는데, Streamlit은 데이터 사이언티스트나 백엔드 개발자처럼 프론트엔드에 익숙하지 않은 사람들도 쉽게 데이터 시각화나 웹 앱을 만들 수 있도록 해주는 파이썬 라이브러리이다. 코드 몇 줄만으로도 인터랙티브한 대시..
운영중인 서비스에서 응답시간이 느려진 부분이 있어서, 이를 개선하고 싶었다. 마침 유저 구분이 필요 없고, 수정이 거의 없는 페이지라서 캐싱 전략을 사용하기 적합해 보였다! 해당 페이지에 대해 간략하게 설명하자면, 당일 새벽시간의 뉴스데이터를 전부 분석을 해서 아침 8시에 그날의 뉴스를 한눈에 정리해서 보여주는 페이지다. 따라서 유저별로 개인화가 들어가는 페이지도 아니고, 웬만해서는 수정이 이뤄지지 않는 API 이다. 그럼 바로 캐싱작업을 시작해보자. 설치 해당 프로젝트로 이동해서 필요한 패키지를 몇가지 설치해주자. npm install cache-manager cache-manager: 캐싱을 담당할 라이브러리다. npm install @nestjs/common nestjs의 CACHE_MANAGER:..
얼마 전 회사 프론트직원분께서 staging admin에서 504에러가 뜬다고 찾으셨다. 그래서 바로 staging Swagger에서 관련 API를 날려보니 다음과 같이 나왔다. 확인해보니 504 Time-out 에러가 나왔다. 이제 차근차근 해결을 해보자 ! 해결 1 - axios timeout 설정 해당 API 부분은 axios로 코드를 불러와서 파싱한 후 리턴하는 코드다. axios 할 때 일정 시간을 초과하면 504에러가 뜰 수 있다는 얘기가 있어서, 우선 time-out 시간을 늘려주기로 했다. 갑자기 504에러가 뜬 이유는 axios로 받아오는 chatGpt 관련 처리시간이 늦어진듯 하다. 그래서 timeout 을 10분으로 넉넉히 변경하였다. timeout : 600000 로컬에서 코드를 돌..
오늘은 4단원인 "콜백 함수" 를 포스팅 할 것이다. 중간에 "콜백 함수 내부에서의 this" 에 대해서 깊게 다루니 이전 포스팅인 "this" 에 대해서 필수적으로 알고 있어야 한다. https://ilikezzi.tistory.com/58 [Javascript] this_코어 자바스크립트 오늘은 3단원인 "this" 를 포스팅 할 것이다. 지난번 포스팅한 "실행 컨텍스트" 도 읽어보면 도움이 될 듯하다. https://ilikezzi.tistory.com/55 [Javascript] 실행 컨텍스트_코어 자바스크립트 저번에 포스팅 ilikezzi.tistory.com 04. 콜백 함수 콜백 함수란? 콜백 함수는 쉽게 말해 함수 안에 함수다. 즉, 다른 함수의 인자로 전달되는 함수이다. 비동기 작업이 끝..
오늘은 3단원인 "this" 를 포스팅 할 것이다. 지난번 포스팅한 "실행 컨텍스트" 도 읽어보면 도움이 될 듯하다. https://ilikezzi.tistory.com/55 [Javascript] 실행 컨텍스트_코어 자바스크립트 저번에 포스팅한 "데이터 타입" 에 이어서 다음 챕터인 "실행 컨텍스트"를 포스팅 할 것이다. https://ilikezzi.tistory.com/52 [Javascript] 데이터 타입_코어 자바스크립트 계획했던대로 자격증 취득도 다 ilikezzi.tistory.com this.... '이것' 이라는 단어 그 자체로의 뜻을 가지지만, 가끔씩 어디를 가르키는건지 헷갈렸는데 이제 그 헷갈리던 this에 대해서 제대로 잡아보자. 03. this 전역 공간에서의 this 브라우저 ..
