[next.js] 블로그 앱 만들기 5강

🐰 Pre-rendering(사전 렌더링)

- 기본적으로 모든 페이지 pre-render 

- 사전에 HTML 파일들을 만든다는 의미

- 퍼포먼스 향상과 SEO에 좋음 

- Hydration : 정적인 무언가에 생기를 불어넣는 작업들을 칭함

종류 (차이점 : 언제 html을 만드냐)

- Static Generation : 정적생성
   정적은 build시에 만듦 

- Server-side Rendering : 서버 사이드 렌더링 

   요청을 하면 그때 html을 만들어서 보여줌 

 

대부분의 케이스에서는 정적생성이 권고됨 (유저가 요청을 보내기 전에 페이지를 미리 만들어도 되는 경우)

서버 사이드 렌더링 (항상 최신 상태를 유지해야 하는 경우)

 

#SEO (검색 엔진 최적화) 

웹사이트가 유기적인(무료) 검색 방식을 통해 검색 엔진에서 상위에 노출될 수 있도록 최적화하는 과정

 

pre-rendering이 안되면 js를 껐을 때 아무것도 안나오게됨 

 

이번 강의를 통해서는 정적 상태인 페이지를 만들거임

 

클라이언트 환경이 아니기 때문에 .env.파일들에서 NEXT_PUBLIC을 붙힐 필요가 없음 

 

5강 7:13초부터  

 

---

🐨 우여곡절 

- npm run start를 하게되면 실행이 안되서 npm run dev로 해줌 npm run build && npm run start도 마찬가지로 안됨 

$ npm run build && npm run dev