Programing/Next.js2 [Next.js] 렌더링 방식 - CSR, SSR, SSG, ISR 우선 리액트를 공부하며 익숙한 렌더링 방식인 CSR, SSR이 있고Next.js에서는 SSG와 ISR 이라는 렌더링 방식을 추가로 지원합니다.✅ CSR (Client Side Rendering)직역 : 클라이언트 측 렌더링서버로부터 모든 정보를 받아 클라이언트에서 렌더링을 진행하는 방식입니다. 👍🏻 장점1. 첫 로딩 이후 렌더링 속도가 빠르다.2. SPA3. 클라이언트에서 렌더링하므로 서버에 부하가 적다. 👎🏻 단점1. 첫 페이지 로딩속도가 느리다.2. SEO 최적화가 않좋다.3. 보안에 취약하다. 보안에 대한 정보도 클라이언트로 전달됩니다.4. CDN에 캐시가 안됩니다.✅ SSR (Server Side Rendering)직역 : 서버 측 렌더링서버에서 렌더링을 진행 후 클라이언트에게 페이지를 전.. Programing/Next.js 2024. 5. 20. [Next.js] Next.js란? ✅ Next.js란?웹 어플리케이션을 만들기 위한 React Framework 입니다.React로만 웹 개발을 할 때 한계를 보완하는 다양한 기능이 존재합니다. 🤔 React의 한계는 무엇이고, 어떻게 보완한다는 건가요?🤗 React는 CSR입니다. 그래서 CSR의 단점을 고스란히 갖게됩니다. Next.js는 SSR부터 하이브리드 렌더링까지 제공합니다.CSR의 단점(= React의 한계)1. 초기 로딩속도가 느리다.2. SEO 최적화 안좋다.3. 보안이 안좋다. (클라이언트에 전달되기 때문)4. CDN에 캐시가 안된다.✅ Next.js를 사용하면 얻을 수 있는 기능들SSR, 하이브리드 렌더링pre-rendering풀스택 개발 가능파일 시스템 기반 라우팅 🛠️ 용어 정리⚙️ Framework 개발에.. Programing/Next.js 2024. 5. 19. 이전 1 다음