2023.03.05 - [Library, Framework] - Next JS 13 적용해 보기 - App Routing 편 이번 Next JS 13 적용해 보기 시리즈에서는 서버에서 데이터를 불러오는 data fetching 방법에 대해서 알아보도록 하겠습니다. Next JS 13 이전 버전에서는 getStaticProps이나 getServerSideProps라는 메서드를 사용하면 data fetching 및 사전에 각 페이지의 HTML을 생성해 두는 Pre-rendering이 가능했습니다. 사실 이름만 복잡하지 막상 사용해 보면 크게 사용하기 힘든 점은 없었으나 처음 Next JS를 접했을 때는 어렵게 느껴질 수도 있을 법만 한 것들이기도 하고 React 18에 Server Component와 Cli..

예전부터 꼭 배워보고 싶은 Next JS 프레임워크에 드디어 입문했다. 여태까지 관리자 페이지나 랜딩페이지를 만들다 보니 CSR(Client Side Rendering)로도 충분했지만 현재 SEO과 원할하게 이루어져야 하는 프로젝트에 투입되어 SSR을 지원하는 넥스트 JS를 배우고 있다. React 자체적으로도 SSR (서버 사이드 렌더링)이 가능하긴 하지만 생각보다 복잡하기 때문에 이왕 배우는 거 넥스트 JS를 배우고 있다. 일단 CRA(Create React App)처럼 create-next-app으로 간단하게 넥스트앱 프로젝트를 생성할 수 있다 npx create-next-app # 또는 yarn create-next-app 폴더 구조 .next build/배포 시 필요한 파일들이 담겨있는 폴더 c..