Next.js
Next.js 빌드 워커를 줄여 메모리와 빌드 시간을 개선한 기록
Docker 빌드의 메모리 부족을 계기로 Next.js 워커 수를 비교했습니다. 워커 13개를 1개로 줄인 결과와 이전 커밋을 다시 빌드하며 확인한 내용을 정리합니다.
Category
Next.js
10편
Next.js
pageExtensions를 걷어내고 모노레포로 간 이유
제가 맡은 프로젝트는 한 레포에서 두 도메인을 빌드하고 있었습니다. 일반 사용자가 사용하는 사이트와 마케팅 광고주가 사용하는 관리 사이트, 이렇게 두 도메인을 사용하고 있습…
Next.js
import 한 줄 때문에 모든 방문자가 Firebase SDK를 받고 있었습니다
푸시 알림을 붙이고 나서 초기 로딩이 눈에 띄게 무거워졌습니다. 이상한 건 알림을 안 쓰는 사용자도, 로그인조차 안 한 방문자도 똑같이 느려졌다는 점이었습니다. 알림 기능을…
Next.js
Next.js에서 React-Query를 사용하지 않아도 되는 이유
React 프로젝트를 진행하면서 대부분 서버 패칭과 캐싱, 동기화 등 여러 작업을 좀 편리하게 하고 무한스크롤을 구현할때 대부분 많이 사용했었습니다. 하지만 Next.js에…
Next.js
Next.js을 이용해 PWA(프로그래시브 웹 어플리케이션) 구현
해당 프로젝트에는 댓글 기능이 있고 댓글이 달렸을때마다 팀원분들과 회의를 통해 push 알림을 줄 수 있게 개발하기로 결정했습니다. firebase을 통해 push알림을 구…
Next.js
Next-auth을 통한 일관된 인증 상태 관리
기존에 했던 프로젝트에서 next.js에서 지원하는 cookies를 사용해서 로그인을 구현했습니다. 하지만 로그인 직후의 client측에서 상태를 변화하는 것을 감지해야 c…
Next.js
RSC에 async를 붙일때 Jest 오류 해결
Next.js에서 Jest를 사용할때 RSC에 async를 붙일경우 에러가 발생하는 오류를 발견하였습니다. async를 붙이기전 async 붙인후 찾아보니 이는 react-…
Next.js
Next.js에서 cors 우회 하는 법
React일 경우 저는 http-middleware-proxy을 이용한 방법을 자주 사용했습니다. Next.js에서는 다른 방식을 사용해야 했습니다. next.js에서는 n…
Next.js
Next.js에서 SSR을 지원하지 않는 컴포넌트 다루기
Next.js를 사용하다보면 React 라이브러리를 설치해서 해당 컴포넌트를 사용하게 될때 SSR를 지원하지 않는다면 오류가 발생합니다. 이것은 Next.js가 SSR 기반…
Next.js
Next.js에서 Toast ui 에디터 사용하기
Next.js 가장 최신인 14 버전을 사용했고 Toast ui는 @toast-ui/react-editor 3.2.3 버전을 사용했습니다. Next.js로 모든 세팅이 끝난…