반응형

nextjs 12

[NextJS] 프로젝트 생성 및 실행 방법

NextJS Next.js는 Pre-Rendering, 서버 사이드 렌더링(SSR), 정적 웹 페이지 생성 등 리액트 기반 웹 애플리케이션 기능들을 가능케 하는 Node.js 위에서 빌드된 오픈 소스 웹 개발 프레임워크이다 * Pre-Rendering, SSR, CSR 개념 * https://cocococo.tistory.com/41 1. NextJS 실행 과정 1) reactJS를 백엔드에서 동작시켜서 페이지를 미리 만들어 컴포넌트들을 렌더링 시킨다. 2) 렌더링이 끝났을 때 HTML이 되고 HTML를 페이지 소스 코드에 넣어준다. 3) 사용자는 자바스크립트와 reactJS가 로딩되지 않더라도 콘텐츠를 볼 수 있다. 4) react가 로딩이 끝났을 때 기본적으로 존재하는 것들과 연결시켜주어 react ..

React 2022.10.12

[NextJS] Pre-Rendering, Client-Side-Rendering, Server-Side-Rendering 개념

NextJS Next.js는 Pre-Rendering, 서버 사이드 렌더링(SSR), 정적 웹 페이지 생성 등 리액트 기반 웹 애플리케이션 기능들을 가능케 하는 Node.js 위에서 빌드된 오픈 소스 웹 개발 프레임워크이다 * ReactJS는 Client-Side-Rendering 방식이다. 1.Client-Side-Rendering( CSR ) 이란? CSR은 클라이언트(사용자)에서 모두 처리하는 방법으로 서버에서 전체 페이지를 최초에 한번 렌더링 하여 보여주고 사용자가 요청할 때마다 리소스를 서버에서 제공받아 클라이언트가 해석하고 렌더링 하는 방식이다. SSR과 달리 서버에 HTML 문서를 요청하는 것이 아니라, 브라우저에서 자바스크립트로 콘텐츠를 렌더링 하는 것이다. ( 최초 렌더링된 HTML ) ..

React 2022.10.11
반응형