그알것 — 그럼에도 알아야 할 것들
홈질문커뮤니티
로그인
그알것 — 그럼에도 알아야 할 것들

Service

  • 홈
  • 소개
  • 질문
  • 커뮤니티

My

  • 내 워크스페이스
  • 저장한 질문
  • 작성한 답변

Policy

  • 이용약관
  • 개인정보처리방침
  • 문의

© 2026 그알것 · What Still Matters

질문 목록React
React

클라이언트 사이드 라우팅은 어떤 과정으로 동작하나요?

실무5/5
설계3/5
인간4/5
기초3/5

면접관의 질문 의도

라이브러리 사용 경험이 아니라 History API와 경로 매칭 기반 동작 원리를 어디까지 따라가는지 본다. 뒤로가기·데이터 페칭까지 한 흐름으로 설명하면 깊이 질문을 이어간다.

큐레이션 답변

학습 자료

클라이언트 사이드 라우팅은 링크 클릭의 기본 페이지 이동을 막고 history.pushState로 URL만 바꾸는 데서 시작한다. 서버에 HTML을 새로 요청하지 않고 라우터가 현재 경로를 매칭해 해당 컴포넌트를 렌더링하며, 필요한 데이터는 그 컴포넌트가 마운트되면서 비동기로 가져온다. 뒤로가기와 앞으로가기는 popstate 이벤트를 라우터가 받아 같은 매칭 과정을 다시 돌려 화면을 교체한다. 결국 URL 갱신·경로 매칭·렌더링·페칭 네 단계가 같은 흐름 안에서 맞물려 돌아야 라우팅이 깨지지 않는다.

좋은 답변 구조

  1. 01링크 클릭 시 기본 동작을 막는 이유부터 짚는다
  2. 02pushState로 URL을 갱신하고 라우터가 경로를 매칭하는 과정을 잇는다
  3. 03매칭 결과로 컴포넌트가 렌더링되고 데이터 페칭이 이어지는 흐름을 설명한다
  4. 04popstate로 뒤로가기·앞으로가기가 같은 매칭을 다시 돈다는 점으로 마무리한다

자주 실수하는 포인트

URL 변경이 자동으로 컴포넌트 렌더링을 일으킨다고 본다
CSR 전환에서도 서버가 매번 HTML을 다시 내려준다고 설명한다
popstate 처리를 빠뜨려 뒤로가기 동작을 누락한다

실무 맥락

  • 리로드 없이 페이지를 빠르게 전환해야 하는 SPA를 만들 때
  • 뒤로가기·앞으로가기에서 폼 상태나 스크롤이 깨져 UX가 흔들리는 환경
  • 라우트마다 데이터 페칭 타이밍이 달라 로딩 UX를 다시 설계해야 하는 상황

본인 경험에 녹이는 힌트

라우트 전환이 느려서 prefetch나 코드 스플리팅으로 잡아본 경험이 있다면 라우터 동작 흐름과 연결할 수 있다

뒤로가기에서 화면이나 스크롤이 깨졌던 버그를 잡아본 경험이 있다면 popstate 처리와 묶어 말할 수 있다

라우트별 데이터 페칭 전략을 고민해본 경험이 있다면 컴포넌트 마운트 타이밍과 로딩 UX 이슈로 연결된다

커뮤니티 인기 답변

전체 0개

아직 공개된 답변이 없어요. 첫 공개 답변을 남겨보세요.

관련 꼬리 질문

Q1CSR에서 초기 진입 URL을 서버가 어떻게 처리해야 하나요
Q2라우트 전환 중 로딩 상태를 어떻게 설계하나요
Q3prefetch 전략은 어떤 기준으로 적용하나요
아직 답을 쓰지 않았어요.
큐레이션 답변과 다른 사람 답변을 보고, 자기 언어로 답을 정리해보면 학습 효과가 가장 큽니다.
목차
  • 01면접관의 질문 의도
  • 02큐레이션 답변
  • 03좋은 답변 구조
  • 04자주 실수하는 포인트
  • 05실무 맥락
  • 06본인 경험에 녹이는 힌트
  • 07커뮤니티 인기 답변준비중
  • 08관련 꼬리 질문