옛날에는 프론트, 백엔드를 나누지 않고 하나의 저장소안에 프론트와 백엔드를 작업했습니다. 대부분 서버사이드 언어(php)를 사용해서 빠르게 구축했습니다.

하지만 근래에는 프론트의 중요성이 대두되면서 프론트서버와 백엔드서버를 나누고, 프론트에서 관리해야 할 데이터, 백엔드에서 관리해야 할 데이터를 분리합니다. 그에 따라 프론트는 점점 사용자의 니즈에 맞게 반응형으로 작업하게 되었고 ui/ux 의 중요성은 점점 증가했습니다.

CSR(Client Side Rendering)이란?

한국말로 직역하자면 화면 쪽에서 랜더링을 하는 것입니다. 랜더링이란 웹사이트가 그려지는 과정을 뜻합니다.

랜더링(client).png

  1. 웹서버는 브라우저로부터 요청을 받습니다.
  2. 응답 값으로 html, css, js, 이미지 등등의 데이터를 응답합니다.
  3. 화면에서 랜더링을 시작하기 전까지 유저들은 아무것도 볼 수 없습니다.
  4. 랜더링이 완료된 후 사용자들은 화면을 볼 수 있고 조작할 수 있습니다.

SSR(Server Side Rendering)이란?

서버 쪽에서 렌더링 준비를 끝마친 상태로 브라우저에 전달하는 방식입니다.

랜더링(서버).png