728x90
반응형

Hydration 2

[Next] SSG(Static Site Generation)란? 🚀

SSG(Static Site Generation)란?🚀 Next.js에서 SSG(Static Site Generation, 정적 사이트 생성)빌드 시점에 HTML을 생성하여, 요청 시 빠르게 제공할 수 있도록 하는 렌더링 방식입니다. 즉, 페이지를 서버에서 미리 렌더링해놓고 정적인 HTML 파일로 저장하여, 사용자가 접속할 때 즉시 제공하는 방식이에요. 이렇게 하면 사용자에게 빠른 로딩 속도를 제공하고, 검색 엔진 최적화(SEO)에도 유리하다는 장점이 있습니다.🥸 SSG는 왜 생겨났을까요?과거에는 동적 콘텐츠를 제공하기 위해 서버사이드 렌더링(SSR)이나 클라이언트사이드 렌더링(CSR) 방식이 주로 사용되었습니다.그러나 이 방식은 페이지 로딩 시간이나 서버 부하 문제 등에서 한계를 드러냈습니다. 특히..

Front-end/Next.js 2025.02.01

[WEB] 하이드레이션(Hydration): 서버와 클라이언트의 환상적인 협업 🌊

하이드레이션(Hydration) 톺아보기! 🌊웹 개발을 하다 보면 하이드레이션(Hydration)이라는 개념을 마주칠 때가 있을 거예요. 단어부터 어딘가 ‘촉촉’한 느낌이 들지만, 사실 하이드레이션은 서버와 클라이언트가 힘을 합쳐 빠르고 매끄러운 사용자 경험을 제공하기 위한 기술입니다. 오늘은 이 하이드레이션이 무엇인지, 어떻게 작동하는지, 그리고 왜 중요한지를 살펴보면서 웹 개발의 세계로 한 발짝 더 들어가 봅시다!🌟 하이드레이션이란?하이드레이션이란, 서버에서 렌더링된 정적 HTML에 클라이언트에서 JavaScript를 결합해 인터랙티브한 애플리케이션으로 변환하는 과정을 말해요.1. 서버에서 HTML 렌더링서버는 사용자가 요청한 페이지를 HTML 형태로 제공합니다. 이 HTML은 초기 화면을 보여주..

Web 2025.01.05
728x90
반응형