시리즈 1)페이지 이동 = 페이지 이동 + 라우팅

sincerity developer·2023년 9월 30일

서론

개발을 하다보니 가장 좋은 방법은 나한테 맞는 쉬운 용어를 써서 이해하고, 적용시켜보는 것이라는 생각이 들었다.
쉬운 용어를 써서 정리를 하는 습관을 갖고싶어서, 이렇게 블로그에 따로 테마까지 만들어서 적게 되었다.

페이지 이동 + 라우팅

❗️"똑같은 말 아니야...? 개발을 하면서 들었던 생각이다"❗️

application의 규모가 커지게 되면서, 페이지 이동없이는 웹 앱을 구현할 수 없게 되었다.
우연의 일치로, 이번 프로젝트에서 라우팅이라는 기술의 구현을 담당하게 되었는데,
처음엔 그저, 라우팅 === 페이지 이동이라는 생각을 갖고 개발에 들어갔고,
크게 다르지는 않아서인지.. 개발하는데 큰 문제는 없었다.
하지만 결과론적으로 난 잘못된 개념을 가진 채 개발을 했다는 것.....

그럼 어떻게 다른건지....?

페이지 이동

잘못 알았던 개념 : 페이지 이동은 페이지 랜더링까지 포함.
새롭게 알게된 내용 : 페이지 이동은 단순 의사 결정, 의도.
❗️결국 라우팅이란 기술이 있어야 실제로 페이지 이동이 결정 된다.

  • 페이지 이동이 하는 일
    -1. 어떤 URL로 이동하는지 적어둔다.
    -2. 페이지 이동이 SPA방식인지 MPA방식인지 결정한다.

라우팅

페이지 이동에서 결정된 사항을 바탕으로 ❗️url에 따른 페이지를 정말 랜더링 해주는 기술❗️
즉, 어떤 url로 이동하는지 (/jisung)
SPA방식인지 ex) <Link> MPA방식인지 ex) <a></a>
결정에 따라서 실제 페이지 랜더링을 해준다!

  • ✨ 그래서 라우팅은 페이지 이동의 의사결정을 계속해서 추적하고 있어야한다 ✨

결론

  • 물론 2가지를 1가지 개념으로 합쳐서 보는 사람들도 있다고 생각한다.
    하지만 조금 더 라우팅의 고유 역할에 대해서 알고싶었다
  1. 페이지 이동은 의사 결정(아직 행동❌)
  2. 라우팅 : 결정된 사항을 바탕으로 한 페이지 랜더링
    • 어떤 url로 갈건지 (❗️페이지 이동 의사결정을 추적❗️)
    • 어떤 방법으로 화면 랜더링 할건지(SPA vs MPA)

라우팅 vs 라우터

여기서 또 궁금한게 생겨서 찾아보게 되었다...

라우터

라우팅 기술을 구현하기 위해서 쓴 특정 라이브러리나 코드
- 리액트 : react-router

라우팅

라우터를 이용해서 만들어진 실제 기술

👏 읽어주셔서 감사합니다!👏

profile
열심히 할 필요없이 그냥 일단 하면된다!

0개의 댓글