<aside> 📌 MSW - Service Worker를 이용하여 실제 요청을 가로채는 API Mocking Lib

</aside>

개발, 디버깅, 테스팅에 사용이 가능하다

Service Worker를 이용하여 API를 Mocking하여 기존 소스를 바꿀 필요가 없어지며 공수가 줄어든다

*) MSW는 어플리케이션의 발신 요청을 수신대기하는 서비스 워커를 등록하고 fetch할 경우 요청을 라이브러리 측(MSW)으로 보내고 사용자에게 응답

Untitled

MSW를 이용한 개발 Flow

  1. 컴포넌트를 개발
    1. 컴포넌트는 Storybook을 통해 UI만 생성
  2. API Endpoint를 서버에서 전달받거나, 임시로 생성하여 return data를 생성
  3. 컴포넌트나 페이지에서 해당 API요청부를 함께 개발하고 이후 실제 API로 교체

MSW 사용기