2024/07/30 2

24.07.30 use client

use client는 hydration이 필요한 컴포넌트에서 사용된다.use client가 의미하는 것은 client단에서 js가 hydrate되어야 한다는 것이다.useclient가 사용되지 않은 컴포넌트는 서버에서 보내주고 hydration이 일어나지 않는다. use client가 사용되면 client component, 사용되지 않으면 server component인 것이다.항목클라이언트 컴포넌트 (ClientComponent)서버 컴포넌트(Server Component)실행 위치브라우저 (클라이언트)서버 (Node.js 등)데이터 페칭클라이언트 사이드 데이터 페칭 방식(fetch, axios, ...)서버 사이드 데이터 페칭 방식(getServerSideProps, getStaticProps, ...

2차 공부/TIL 2024.07.30

24.07.30 SSR , CSR의 차이 / hydration

SSR : Server Side RenderingCSR : Client Side Rendering말 그대로 SSR은 서버측에서 렌더링을 하는 것이고, CSR은 클라이언트(사용자)측에서 렌더링을 하는 것이다.  CSR : Client Side RenderingSSR : Server Side Rendering1사용자가 웹 사이트를 요청함유저가 웹 사이트를 요청함2CDN이 HTML파일과 JS접근링크를 보내줌서버가 렌더가 준비된 HTML파일을 생성함3브라우저가 HTML을 다운로드하고, JS를 다운로드함단, 이때 사용자는 사이트를 볼 수 없음(빈 화면)브라우저가 HTML을 빠르게 렌더링하지만사이트는 아직 상호작용이 불가함4브라우저가 JS를 다운로드함브라우저가 JS를 다운로드함5JS가 실행되고 data를 위한 ap..

2차 공부/TIL 2024.07.30