페이지 라우팅 - React SPA & CSR

김도현·2023년 8월 10일
0

Routing이란?

라우팅 네트워크에서 통신 데이터를 전송할 경로를 정해주는 행위 자체와 그런 과정들을 모두 포함해서 일컫는 말

Page Routing이란?

브라우저에 접속 url 을 입력하면 웹 서버에서 이에 해당하는 html 파일을 뿌려주는 것 (이러한 것을 nginx와 같은 웹서버가 수행함)
=> 요청에 따라서 어떠한 페이지를 돌려줄지 결정하는 과정들을 일컫는 말

MPA

MPA (Multi Page Application) 은 말 그대로 여러 개의 페이지로 이루어진 애플리케이션이다 즉, html 파일이 여러개

MPA에서의 페이지 이동은 페이지 이동할 때마다 웹 서버에게 요청하여 html 파일을 받아와서 뿌려줘야함 => 리소스가 크다

SPA

리액트는 SPA(Single Page Application)으로 이루어져 있는데,

리액트의 페이지 이동할 때

  • 한번 요청하였을 때 리액트 앱자체를 넘겨줌(index.html과 함께) 그리고 페이지 이동을 할 때 리액트 앱이 알아서 index.html 파일을 업데이트 시켜준다.
  • 그리고 데이터를 변경해야 하는 상황은 웹서버에게 요청하여 json 형태의 데이터만 받아온다.
  • 이렇게 클라이언트 측에서 알아서 페이지를 렌더링하는 방식을 CSR(Client Side Rendering) 이라고 부른다.

즉, 리액트는 단일 페이지로 구성되는 SPA으로 구성되면서 CSR으로 페이지를 렌더링함

profile
Just do it

0개의 댓글