세모이
개발 계발
세모이
전체 방문자
오늘
어제
  • 분류 전체보기 (83)
    • 알고리즘 (1)
    • 자바스크립트 (29)
    • 리액트 (10)
    • HTML&CSS (2)
    • TIL (26)
    • 파이썬 (8)
    • Dev (1)
    • 데일리 (3)
      • 2023 (3)
      • 2025 (0)
    • 에러일기 (1)

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • 모던 자바스크립트
  • 옵셔널 체이닝
  • 시멘틱 태그
  • 자바스크립트 strict mode
  • 자바스크립트
  • 개발자 도구 Network
  • 자바스크립트 전역 변수의 문제점
  • html 신기한 태그
  • 자바스크립트 빌트인 객체
  • 자바스크립트 프로토타입
  • 자바스크립트 프로퍼티 어트리뷰트
  • 자바스크립트 함수와 일급 객체
  • &&연산자
  • 모던 자바스크립트 deep deive
  • const let 키워드와 블록레벨 스코프
  • 함수
  • 자바스크립트 깊은 복사 얕은 복사
  • 자바스크립트 생성자 함수에 의한 객체 생성
  • 모던 자바스크립트 deep dive
  • 리액트 key

최근 댓글

최근 글

티스토리

반응형
hELLO · Designed By 정상우.
세모이

개발 계발

TIL

라우팅

2022. 2. 13. 10:41
반응형

동적 라우팅

1. Routing

라우팅 - 다른 경로(url 주소)에 따라 다른 View(화면)를 보여주는 것.


2. 동적 라우팅

id 값에 따라 많은 url이 나타나고 각각의 모든 url에 대해 모든 경로의 형태와 개수를 결정할 수 없기 때문에 쓴다

그래서 url에 들어갈 id를 변수처럼 다룬다.

이처럼 정적이지 않은 동적일 수 있는 경로에 대해 라우팅 하는 것을 동적 라우팅이라 한다.


2-1 동적 라우팅 처리하는 방법

path parameter vs query parameter

1. query parameter

/products?id=1
/products?id=5
/products?id=15

id란 변수에 값을 담아 백엔드에 전달하는 방식이 Query string이다. products에 담긴 정보 중 id 1,5,15의 자료를 요청 하는 것


2. path parameter

/products/1
/products/5
/products/14

위와 동일한 요청 끝에 다른 id(값)를 요청할 수도 있는데 이것을 Path Variable이라고 한다.


언제 쓰면 좋은가?

/products
/products?limit=20&offset=0
/products/123

일반적으로 우리가 어떤 자원(데이터)의 위치를 특정해서 보여줘야 할 경우 Path variable을 쓰고, 정렬하거나 필터해서 보여줘야 할 경우에 Query parameter를 쓴다. 아래가 바로 그렇게 적용한 사례이다.

Query string과 Path variable이 이들 메소드와 결합함으로써 "특정 데이터"에 대한 CRUD 프로세스를 추가의 엔드포인트 없이 완결 지울 수 있게 되는 것인다.

-> 백엔드에서 일일이 모든 주소값에 대한 api를 생성할 필요가 없다.



물론 위와 같은 규칙을 지키지 않더라도 잘 돌아가는 API를 만들 수 있다.

하지만 지키지 않을 경우 서비스 엔드포인트는 복잡해 지고,

개발자간/외부와 커뮤니케이션 코스트가 높아져 큰 잠재적 손실을 초래할 수 있으니 이 규칙은 잘 지켜서 사용하는 것이 필수라 하겠다.

반응형

'TIL' 카테고리의 다른 글

자바스크립트 함수  (0) 2022.02.13
AWS  (0) 2022.02.13
자바스크립트 간단 요약 ver2  (0) 2022.01.29
[TIL] RESTful API  (0) 2022.01.26
[TIL] 리액트에서 FontAwesome 사용하기  (0) 2022.01.26
    'TIL' 카테고리의 다른 글
    • 자바스크립트 함수
    • AWS
    • 자바스크립트 간단 요약 ver2
    • [TIL] RESTful API
    세모이
    세모이
    개발 공부!

    티스토리툴바