SSR 2

[NEXT.JS] 정적 사이트 생성(SSG)

소개Next.js의 정적 사이트 생성(SSG)은 빌드 타임에 HTML 페이지를 미리 생성하여 빠른 로딩 속도와 SEO 최적화를 제공합니다. 이 가이드는 SSG 기능을 자세히 설명합니다.  SSG의 장점 빠른 로딩 속도: 미리 생성된 HTML 페이지는 서버 요청 없이 즉시 로드됩니다.SEO 최적화: 정적 페이지는 검색 엔진이 쉽게 인덱싱할 수 있습니다.안정성: 서버 부하를 줄이고, CDN을 통해 전 세계에 빠르게 배포할 수 있습니다.   GetStaticProps pages/index.jsexport async function getStaticProps() { const res = await fetch('https://api.example.com/data'); const data = await res...

[NEXT.JS] 서버사이드 렌더링(SSR)

소개서버사이드 렌더링(Server-Side Rendering, SSR)은 서버에서 HTML을 생성하여 클라이언트에 전달하는 방식입니다. Next.js는 이 기능을 통해 초기 로딩 속도와 SEO를 향상시킬 수 있습니다.  SSR의 장점 초기 로딩 속도 향상: 서버에서 미리 렌더링된 HTML을 제공하여 초기 로딩 시간을 단축합니다.SEO 최적화: 검색 엔진이 미리 렌더링된 HTML을 인덱싱할 수 있어 SEO 성능이 개선됩니다.유저 경험 개선: 초기 콘텐츠가 빠르게 표시되어 사용자 경험이 향상됩니다.   getServerSideProps 사용법Next.js에서 SSR을 구현하기 위해 getServerSideProps 함수를 사용합니다. 이 함수는 각 요청 시 서버에서 실행되며, 페이지 컴포넌트에 데이터를 전달..