Next.js 2

[Next.js/13] use client와 use server 이해하기

들어가며Next.js 13 이상에서는 App Router 도입과 함께 use client와 use server라는 개념이 등장했습니다.이는 React Server Components(RSC)를 활용한 렌더링 방식의 최적화를 위한 것으로 클라이언트와 서버의 역할을 명확히 나눔으로써 성능과 개발자 경험을 향상하는 것에 초점을 맞추고 있습니다.use client와 use server의 차이를 이해하고 각 기능이 필요한 경우와 실제 프로젝트에서 어떻게 활용할 수 있는지 정리하는 시간을 가져보겠습니다.먼저 설명드리고 싶은 부분이 있는데, 바로 기본적으로 Next.js의 모든 컴포넌트는 서버 컴포넌트라는 것입니다.이 부분을 인지한 후 들어가시는 것이 이해가 쉬울듯 하여 언급하였습니다.use client'use cl..

WEB/Next.js 2025.01.25

[Next.js] CSR 장단점 / SSR 필요성 / Next.js yarn start했을 때의 내부 살펴보기

원티드의 프리온보딩 챌린지를 통해 작성하게된 글임을 밝힙니다. Next.js 좋다 좋다 말만 들었지 (도입을 시도했으나)사내에서 사용하고 있지 않아서 더더욱 궁금한 유니콘 같은 존재라 원티드 프리온보딩을 통해 공부해볼 수 있는 좋은 기회가 생겨서 감사히 참여하게 되었다. 1. CSR이란 무엇일까? 클라이언트가 렌더링 할게! client-side-rendering, 영문 뜻 그대로 클라이언트 단(웹 브라우저)에서 JavaScript를 사용하여 동적으로 콘텐츠를 생성하고 렌더링하겠다는 의미이다. 서버에는 데이터를 요청하고, JavaScript로 컨트롤 한다. SSR은 반대로 서버에서 동적으로 콘텐츠를 생성하고 렌더링하겠다는 의미가 된다. CSR, 장점? 깜빡임이 없는 매끄러운 UX 클라이언트에서 응답 데이터..

WEB/REACT 2023.07.04
728x90
반응형