🐶서론 next.js 13버전이 나오고, 전반적으로 큰 변화가 있어 12버전만을 붙들고 있어서는 안되겠다 ! 싶어 13버전으로 기존프로젝트를 마이그레이션 하기 시작했다. 기존 로그인폼에서는 useState를 이용해 아이디와 비밀번호를 받았기 때문에, 당연히 로그인은 client side rendering이 되어야 한다 생각했다. next-auth 라는 라이브러리의 존재를 알고있었지만, 우리 프로젝트에는 백엔드가 있었고 JWT토큰을 사용하여 쿠키에 저장해야했기에 굳이? 싶어 사용하지 않았다. 마이그레이션 계획을 하면서, 굉장히 편한 라이브러리 라는것을 알게되었고 기존페이지들의 렌더링방식 결정에 조금 더 도움이 되지 않을까 하는 생각에 도입하게 되었다. 1️⃣ Next-Auth 란 무엇인가? next-aut..

브라우저는 html의 정보를 읽어서 이를 내부적으로 렌더링하고 js + css 를 반영한 후 최종적으로 뷰를 뿌려준다. 리를 렌더링이라고 하며 렌더링에는 두가지 방식이 있다. 1. CSR(Client Side Rendering) React.js만 사용하여 웹을 만들면 기본적으로 CSR, SPA(Single Page Application)방식으로 랜더링된다. 최초로 한번만 전체 페이지를 로딩하고 이후에는 브라우저 내부에서 데이터만 사용하는 방식이다. 따라서 이 방식은 때마다 렌더링을 할 경우에 성능에 부담을 줄 수 있기에 이를 고려한 환경에서 자주 이용된다. 이러한 SPA방식은 트래픽을 감소시키고 사용자에게 최적화 된 환경을 제공해 줄 수 있다. CSR은 서버는 단순히 클라이언트에게 json파일만을 보내주..