SSG 2

(CS) [렌더링 과정] SSG

SSG란? (정적 사이트 생성)페이지를 빌드 시점(build time)에 HTML 파일로 미리 생성해두고 요청 시에는 서버가 아닌 CDN이나 정적 호스팅을 통해 즉시 제공하는 방식사용자가 웹 사이트 접속 시 브라우저는 완성된 HTML을 그대로 제공추가 페이지 요청 시 미리 생성해 둔 해당 페이지의 HTML을 내보냄데이터가 자주 바뀌지 않는 페이지에 매우 적합Next.js, Gatsby, Hugo 등에서 사용 가능CDN분산된 서버 네트워크사용자에게 더 빠르게 콘텐츠 제공ex) 한국 사용자가 미국에 있는 서버에서 사이트를 열면 거리만큼 느려짐그래서 CDN은 한국, 일본, 싱가포르 등 아시아 지역에도 서버가 있어서 가장 가까운 서버에서 콘텐츠를 전달함정적 호스팅정적 호스팅은 정적인 파일(HTML, CSS, J..

(Next.js) 주요 특징 SSR vs SSG

서론React로 프로젝트를 하다가 Next.js를 알게 됨 "React랑 뭐가 다르지?" 싶었는데, Next.js는 프레임워크라고 함 찾아보니 SSR, SSG, ISR 같은 렌더링 방식이 있더라 특히 SSR과 SSG가 뭐가 다른지 헷갈렸음 그래서 Next.js가 뭐고, SSR과 SSG의 차이를 정리해봄본론Next.js가 뭐야?Next.js는 React 기반의 풀스택 프레임워크 클라이언트 사이드만 하던 React에서 한 걸음 나아가서 서버 사이드도 처리할 수 있게 해줌React vs Next.jsReact는 클라이언트에서 모든 렌더링을 함브라우저 → 빈 HTML 받음 → JavaScript 실행 → 화면 렌더링Next.js는 서버에서도 렌더링할 수 있음브라우저 → 완성된 HTML 받음 → JavaScrip..