리액트는 페이지 하나면 다 된다

개바리바리·2025년 6월 7일

프론트엔드

목록 보기
8/8
post-thumbnail

최근 리액트 프로젝트에서 URL 관련 기능을 만들다 검색하는 중에,
리액트는 SPA 기 때문에 URL이 바뀌어도 사실은 페이지가 바뀌는게 아니란 사실을 알게 됐다
충격이다. 난 URL이 바뀐거면 당연히 페이지도 바뀌는 걸로 알았다

SPA

일단 SPA 가 뭐냐 Single Page Application의 약자로 '싱글 페이지 앱'이란 의미다
반대되는 개념으론 MPA(Multiple Page Application) '멀티 페이지 앱'이 있다
싱글 페이지 앱이라. 어쩐지 리액트 프로젝트에서 페이지는 index.html 뿐이었다

SPA에서의 URL 변화

근데 어떻게 URL에 따라 화면이 바뀌는 걸까?

그건 바로 라우팅 기능 덕분이다
라우팅은 브라우저의 History API를 통해 URL을 바꾸고 그 URL에 맞는 컴포넌트 렌더링을 의미한다
라우팅으로 페이지 전체가 아니라 필요한 부분만 빠르게 업데이트 되며

그렇게 우리는 사용자 경험이 부드럽고 빠르게 느껴졌던 것이었다

profile
누군가에게 도움이 되는 글을 쓰자

1개의 댓글