2023년 05월 11일
수정하기
문서 생성 2023-05-11 22:24:15 최근 수정 2023-05-12 22:01:54
배부른 하루
📚 오늘 도전하고, 배운 것
React Server Component와 Client Component
- 브라우저는 페이지에서 JavaScript를 가져와 렌더링한다. 사용자는 서버에 데이터를 요청한다. react는 데이터를 받아 페이지를 렌더링한다.
- 여기서 서버가 데이터를 가져와 렌더링할 수 있고 브라우저는 하이드레이션만 한다면? -> 이것이 서버 컴포넌트가 나온 이유다.
- 서버 컴포넌트는 서버에서 가져와서 렌더링되고, 클라이언트 컴포넌트는 클라이언트에서 가져와서 렌더링된다.
- 서버 컴포넌트는 클라이언트 번들에 포함되지 않는다. 덕분에 작은 클라이언트 번들을 제공할 수 있다. 따라서 사용자가 다운로드해야 하는 자바스크립트 양이 줄어드는 장점이 있다.
- Next.js 13에서 컴포넌트는 기본적으로 서버 컴포넌트다.
- SSR을 사용하면 HTML이 로드된 후 여전히 필요한 컴포넌트를 다운로드 하고 구문 분석, 실행해야 한다.
- 서버 컴포넌트는 HTML을 반환하는 대신 렌더링 UI에 대한 설명을 반환한다.
🤔 학습하면서 궁금하거나 어려웠던 점
- SSR과 Server component는 이름 때문인지 명확하게 구분이 안된다. 좀 더 다른 자료를 읽어봐야겠다. 제일 중요한 건 이게 왜 나왔고 왜 필요한지다.
🌅 내일은 무엇을?
- Next 문서 읽기
✒️ log
- 30분 뛰었다. 운동하고 칼국수 먹으니 꿀이었다.