csr2 [Frontend] Next.js server action + CSR 개요Next.js 의 장점인 서버 사이드 렌더링을 최대한으로 활용하려면, server action 이 필요하게 됩니다. 그렇지만 서버 사이드 렌더링만을 사용해서는 인터렉티브 한 웹사이트를 만들려고 할 때 ‘use client'를 쓰라는 오류를 만나게 됩니다.결국 Next.js를 잘 쓰려면 서버 사이드 렌더링과 클라이언트 사이드 렌더링을 잘 접목시켜야 하는데 이번 SARDIP work-space 프로젝트에서는 이 작업을 어떻게 진행했는지 설명드리겠습니다.Server ActionNext.js 공식 문서에서는 server action을 서버에서 실행되는 비동기 함수라고 정의하고 있습니다. 서버 및 클라이언트 컴포넌트에서 호출된다고 하는데 개인적으로는 보통 클라이언트 사이드에서 사용하는 경우가 많았던 것 같습니.. 2024. 10. 19. [네트워크] CSR, SSR CSR (Client Side Rendering) CSR은 사용자의 브라우저, 즉 클라이언트 사이드에서 모든 렌더링이 이루어지는 방식입니다. HTML 파일이 존재하지만 일반적으로 이 HTML 파일에는 id를 가지는 하나의 HTML 엘리먼트를 가지고 있고, 이 HTML 엘리먼트를 기준으로 생성된 JS 파일들이 브라우저로 전송된 이후에 렌더링이 일어나게 됩니다. 대부분의 로직이 클라이언트 측에서 처리되기 때문에 서버의 부담이 줄어드는 장점이 있습니다. 대표적인 라이브러리/프레임워크로 React, Vue, Angular와 같은 것들이 있습니다. 장점 풍부한 인터렉션 CSR은 동적인 사용자 경험을 제공하기에 적합합니다. 페이지 전환 없이 UI를 업데이트할 수 있다는 장점이 있습니다. 서버 부하 감소 초기 로드 .. 2024. 2. 4. 이전 1 다음
