1. 백엔드 서버 vs 프론트엔드 서버
-
백엔드 서버: 데이터를 저장하고 처리하며, API 요청에 응답하는 역할을 하는 서버이다. 예를 들어, 데이터베이스에서 정보를 가져오거나, 인증을 처리하는 서버를 말한다.
- 예: Node.js로 작성한 API 서버, Django, Spring 서버 등
-
프론트엔드 서버: 사용자가 웹사이트를 열 때 브라우저로 보내줄 HTML 파일을 만들어주는 역할을 하는 서버이다. 넥스트.js가 실행되는 서버가 바로 프론트엔드 서버이다.
2. 프론트엔드 서버의 역할
넥스트.js는 SSR(Server Side Rendering)을 지원한다. SSR에서는 사용자가 브라우저에서 페이지를 요청할 때, 다음과 같은 일이 발생한다:
1. 사용자의 요청이 넥스트.js 프론트엔드 서버로 전달된다.
2. 넥스트.js는 요청에 따라 서버에서 HTML을 즉석에서 생성한다.
2-2. 여기서 API 요청을 백엔드 서버에 보내 데이터를 가져오는 경우도 있다.
3. 생성된 HTML이 브라우저로 전송된다.
즉, 넥스트.js의 서버는 "사용자가 볼 수 있는 화면을 미리 생성해주는 프론트엔드 전용 서버"인 것이다.
3. 프론트엔드 서버의 이점
- 빠른 로딩 속도: 브라우저가 요청하기 전에 HTML이 미리 만들어지기 때문에 초기 로딩 속도가 빠르다.
- SEO 친화적: 검색 엔진이 크롤링할 때 HTML이 이미 준비되어 있어, 더 나은 검색 엔진 최적화(SEO)를 제공한다.
- 사용자 맞춤 데이터: 로그인된 사용자에게 맞는 데이터를 포함한 HTML을 서버에서 즉시 생성해 전달할 수 있다.
4. 핵심 요약
넥스트.js에서 말하는 "서버"는 HTML을 동적으로 생성하고 브라우저에 전달하는 프론트엔드 역할의 서버를 뜻한다. 이는 데이터를 처리하는 백엔드 서버와는 다른 개념이며, 주로 페이지 렌더링과 관련된 작업을 한다.
이해하기 쉽게, 넥스트.js 서버는 "브라우저에 보여줄 준비된 웹페이지를 만들어주는 주방"으로 생각하면 된다!
기록하자