프론트엔드 개발을 하다보면 API를 사용하는 경우가 당연히 있다. 로그인 처리, 게시글 목록 등등 아주 다양하게 당연하게 필요하다. 이것을 가져와서 연동하는 작업을 수행하기 위해서 따로 모킹 서버를 만들어줄 수 있지만, 아주 번거로운 작업이다. 이것을 Mock Service Worker를 통해서 해결할 수 있다. 어떤 방법으로? 풀 네임 그대로 Service Worker를 사용해서 기능을 제공한다. 간략하게 Service Worker에 대해서 설명하자면, 일종의 대리 서버로 리소스 요청을 가로채 수정을 할 수 있고, 리소스를 세부적으로 캐싱해 조작할 수 있다. 이것을 활용해서 네트워크를 사용하지 못하는 환경에서도 어떤 방식으로 동작하는지 조작이 가능하다 MSW도 Service Worker와 비슷하게 동작..

서비스 워커는 브라우저가 백그라운드에서 실행하는 스크립트로, 웹페이지와 별개로 작동하면서 웹페이지 또는 사용자의 인터랙션이 필요하지 않는 기능을 제공한다. 오프라인에 문제가 생겼을 때 해결을 하기 위해서 등장하였다. 개발자에게 오프라인 환경을 통제할 수 있는 권한을 부여해서, 오프라인 환경에서 캐시와의 상호작용, 백그라운드 동기화, 푸시 알람 등의 기능을 가능하게 했다. 서비스 워커의 특징 ▶ 사용자가 요청해야 동작하고, 목표하는 일이 끝날 때까지 꺼지지 않는다. ▶ 웹페이지 밖에서 동작하기 때문에 브라우저의 열고 닫힘과는 무관하게 동작한다. ▶ 브라우저 밖에서 동작하므로 DOM 요소에 접근할 수 없다. 활용 예시 ▶ 캐시와의 상호 작용 서비스 워커가 Fetch 이벤트의 중간자 역할로 HTTP를 통해 정..