# MSW

70개의 포스트
post-thumbnail

[React] [MSW] Failed to register the Service Worker:

왜 MSW가 실행되지 않을까?

2일 전
·
0개의 댓글
·

리액트 프로젝트 세팅하기

Node.js 개발 환경 세팅TypeScriptESLintReactJestParcelReact Routerstyled-componentsstyled-resetusehooks-tsusestore-tsAxiostsyringereflect-metadatajest-domMSW

2일 전
·
0개의 댓글
·
post-thumbnail

프론트엔드에서 모의 서버 만들기

프론트엔드: API 구현 언제까지 가능한가요? 뺴게에에에에ㅔ겍 ~!~~~~~~~~~~~~

2023년 5월 27일
·
6개의 댓글
·
post-thumbnail

NextJS에서 MSW를 사용해보자

Mock Service Worker의 약자로 Service Worker API를 사용하여 실제 요청을 가로채는 API mocking 라이브러리보통 프로젝트를 진행할 때, 백엔드가 API를 만들면 그 API를 통해 프론트엔드가 인터페이스를 만든다. 만약 같이 시기에 프로

2023년 5월 24일
·
0개의 댓글
·

[Next.js] MSW 적용하기

SNS 프로젝트를 진행하면서 아직 백엔드 api 개발이 다 되지않아서 모의 데이터를 만들어야해서 찾아보다가 MSW(Mock Service Worker)를 알게 되어서 프로젝트에 MSW를 적용시켜보았다. MSW(Mock Service Worker)란? MSW(Mock

2023년 5월 22일
·
0개의 댓글
·
post-thumbnail

graphql codegenerator를 활용한 msw 자동화 세팅

웹프론트엔드 개발 시 msw를 사용할 코드를 codegen plugin을 이용하여 자동화 하기

2023년 5월 18일
·
0개의 댓글
·
post-thumbnail

MSW로 모킹 테스트 with testing-library

테스트 조아...

2023년 3월 29일
·
0개의 댓글
·
post-thumbnail

Story Controls에서 MSW 응답 조작하기

Storybook controls를 이용해 MSW 응답을 조작할 수 있게 만들었습니다. 즉, 1개의 story에서 여러 개의 MSW 응답을 받을 수 있게 되면서 다수의 story를 생성해야 하는 불편함을 해소했습니다.

2023년 3월 20일
·
0개의 댓글
·
post-thumbnail

vite 프로젝트에서 msw, vitest를 이용해 테스트 코드 작성해보기 (2)

저번 시간에 이어 오늘은 본격적인 테스트 코드를 작성해볼 예정입니다. 제가 원하는 테스트는 저번 시간에 말씀드렸다 싶이 4가지 유형에 대해 테스트 코드를 작성해보도록 하겠습니다. 그 과정에서 발생한 이슈사항이 여러 개 있었는데 어떻게 해결하였는지 정리하였습니다.

2023년 3월 17일
·
0개의 댓글
·
post-thumbnail

vite 프로젝트에서 msw, vitest를 이용해 테스트 코드 작성해보기 (1)

vite 프로젝트에서 msw를 통해 mock api를 구성하고 jest와 비슷한 vitest를 이용해 테스트 코드를 작성해보는 것을 목표로 진행해봤습니다. 이렇게 제대로 테스트 코드 작성은 거의 처음이다보니 하다가 막히는 부분과 고민이 많았습니다.

2023년 3월 17일
·
0개의 댓글
·
post-thumbnail

💻 TIL 23.03.13

JWT란

2023년 3월 16일
·
0개의 댓글
·
post-thumbnail

[MSW] Mock Service Worker 사용 하기

프로젝트 중에 클라이언트 코드를 테스트할 때, 서버가 구축되어 있지 않을 때 더미 데이터를 이용해서 테스틀르 진행하고는 합니다.

2023년 3월 16일
·
0개의 댓글
·
post-thumbnail

MapleStoryWorld

hitDong과 deleteDong 함수를 만든 후 handletriggerenterevent 두개를 만들어 하나는 똥에 맞았을때, 하나는 바닥에 닿았을때.그리고 클리아언트와 서버를 잘 선택해준다.time변수를 만들어준후delta는 0.xx초로 흘러가는데 이걸 self

2023년 3월 14일
·
0개의 댓글
·

MSW(Mock Service Worker) 모킹하기

MSW는 Mock Service Worker로 서비스 워커를 이용하여 API를 모킹하는 라이브러리입니다. 네트워크 요청을 가로채도록 설계된 Service Worker API를 활용하기 때문에 목 사용 여부 관계 없이 동일한 애플리케이션 동작을 보장합니다.MSW를 여러가

2023년 3월 13일
·
0개의 댓글
·
post-thumbnail

MSW(Mock Service Worker) 적용기 😀

프론트엔드 개발을 하면서 구현이외에 불편했던 점들은 백엔드 개발이 끝나야 프론트엔드 개발을 할 수 있다는 점이었다. 그리고 프론트엔드는 나 혼자였고, 3명에 백엔드 개발자들과 함께 하여서 한 번에 API가 많이 업데이트 되면 그만큼 몰아서 해야했다. 또한 로딩, 에러등

2023년 3월 11일
·
0개의 댓글
·
post-thumbnail

Angular에서 MSW 사용하기

서버가 없는 경우 프론트엔드에서 api 요청으로 가져온 데이터를 서버의 역할을 해주는 Mock을 만들어서 활용하는 방식서비스워커를 이용해 서버를 향한 네트워크요청을 가로채서 모의 응답을 주는 라이브러리임.npm install msw --save-dev명령어로 설치를 한

2023년 2월 27일
·
0개의 댓글
·
post-thumbnail

MSW (Mocking Service Worker) ?

기획 : XX 작업은 진행 중인가요? 나 : 네? 그게... 아직 API 부분이 준비되지 않아서 보류 중이라 아마 빠르면 다음주부터 시작해서 조금 기다리셔야 될거 같습니다. ㅜㅜ

2023년 2월 14일
·
0개의 댓글
·

nextjs + redux toolkit 프로젝트에 Mocking Service Worker 적용 (MSW)

nextjs, redux toolkit 프로젝트에 MSW(Mocking Service Worker)를 적용해보았다.적용방법은 쉽고 간단해서 빠르게 적용하고 실제 api요청을 가로채어 mock데이터를 response로 넘겨주는 것까지 확인하였다.다만... 포스팅을 하는

2023년 2월 1일
·
0개의 댓글
·
post-thumbnail

메월드 패키지

커뮤니티 활동이나 이번에 에듀 크리에이터 캠프 하면서 메이플스토리 월드 용 패키지를 꽤 많이 만들어뒀다. 이제 그냥 드라이브에 대충 박는걸로 끝낼 수 없으니 깃허브 리포지토리를 이용하기로 했다.

2023년 1월 29일
·
0개의 댓글
·
post-thumbnail

[MSW] Mock Service Worker

전에 프로젝트를 할때 팀원이 MSW를 쓰자하여 따라해보긴 했었다.MSW를 써보니 express로 Mock 서버를 만드는것보다 간단하고 편리했다.그래서 이번 사이드프로젝트를 하며 MSW를 써보기로 하였다.MSW는 서비스 워커(Service Worker)를 사용하여 네트워

2023년 1월 27일
·
0개의 댓글
·