Next.js에서 MSW(Mock Service Worker)로 네트워크 Mocking하기

js 환경에서 MSW(Mock Service Worker)를 도입하며 겪었던 고민과 해결 과정을 공유합니다. js로의 대규모 마이그레이션 과정에서 단위 테스트의 중요성을 인지하고 이를 강화하려 했습니다.

하지만 기존 방식으로는 API 통신 의존성이 높은 기능의 테스트 코드 작성 시 불필요한 코드와 중복 코드가 증가하는 문제가 발생했습니다. 이를 해결하기 위해 MSW를 도입하여 실제 API 요청 없이도 프론트엔드 개발 및 테스트를 효율적으로 진행할 수 있는 방안을 모색합니다.

글에서는 MSW 도입의 필요성과 함께, 기존의 자체 모킹 방식의 한계를 지적하며 MSW가 제공하는 이점을 설명합니다. 의 자체 모킹 방식의 한계를 지적하며 MSW가 제공하는 이점을 설명합니다.