Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

stop mocking fetch (24.05.26) #1

Merged
merged 3 commits into from
Jun 3, 2024
Merged

stop mocking fetch (24.05.26) #1

merged 3 commits into from
Jun 3, 2024

Conversation

lurgi
Copy link
Member

@lurgi lurgi commented May 26, 2024

의견

  1. 번역을 하면서 필요한 부분들을 번역글 중간 중간에 넣었습니다. (스스로 공부한 내용) 이유는 필요한 맥락에서 어떤 의미로 사용되었는지 쉽게 알 수 있다고 판단했습니다. 원글을 그대로 번역하는게 좋다고 이야기 했었는데 이 방법은 어떤지 일단 올려봅니다.
  2. tl;dr를 추가했습니다.

원글을 해치는 것 같긴 합니다. 의견 반영해서 원글의 내용 외의 내용은 다 빼버릴 지 결정하려고 합니다!

Comment on lines 9 to 22
## ❗️tl;dr - 옮긴이

**Fetch 모킹의 문제점**

1. **백엔드 재구현:** fetch를 모킹하면 테스트 곳곳에서 백엔드의 기능을 재구현해야 한다. 이는 중복 작업을 초래하고 테스트의 복잡성을 증가시킨다.
2. **테스트와 서버 코드의 분리:** 클라이언트와 서버 사이의 상호작용을 모킹함으로써 실제 서버의 동작과 테스트가 분리되어, 테스트가 실제 환경을 제대로 반영하지 못할 수 있다.
3. **구현 세부사항으로부터의 격리:** 모킹은 구현 세부사항으로부터 테스트를 격리시키지만, 이로 인해 실제 사용 시 발생할 수 있는 문제를 놓칠 위험이 있다.

**MSW 사용의 필요성**

1. **실제 서버 행동 모사:** msw(Mock Service Worker)는 실제 서버의 동작을 모사하여 요청을 처리함으로써, 테스트가 실제와 더 가까운 환경에서 이루어질 수 있도록 한다.
2. **테스트의 격리와 재사용성:** msw를 사용하면 테스트 중에 서버 핸들러를 쉽게 추가하거나 제거할 수 있어, 각 테스트의 독립성을 유지하면서도 필요에 따라 서버 응답을 조정할 수 있다.
3. **개발 환경에서의 유용성:** msw는 개발 중에도 브라우저에서 동일한 서버 핸들러를 사용할 수 있어, 개발 과정에서도 일관된 테스트와 디버깅 환경을 제공한다.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

해당 내용은 study 폴더에서 파일 새로 생성해서 작성해주면 좋지 않을까요??

@lurgi lurgi changed the title stop mocing fetch (24.05.26) stop mocking fetch (24.05.26) May 27, 2024
@soi-ha soi-ha assigned Jaymyong66 and unassigned brgndyy May 27, 2024
@Jaymyong66
Copy link
Member

Jaymyong66 commented May 28, 2024

코로케이션이랑 rest 등 따로 스터디한 내용이 좋았습니닷

다같이 논의해보면 좋을 한가지는 코로케이션이나 씨딩 같은 단어는 그냥 영단어가 더 이해하기 좋지 않나? 싶어서, 어느 정도까지 그냥 영단어를 쓸지 인 것 같아요.
colocation이나 아예 응집성 같은 단어라던지?!

개인적인 질문으로는 msw를 구현해도 결국 서버에서의 로직을 프론트가 알아서 구현해야하는 것인지? 인데,
예를 들어 이번 미션의 경우, 상품 목록을 가져올 때 sort 로직을 그럼 msw handler에서 저희가 구현해야하나? 싶네요

@lurgi
Copy link
Member Author

lurgi commented May 31, 2024

코로케이션이랑 rest 등 따로 스터디한 내용이 좋았습니닷

다같이 논의해보면 좋을 한가지는 코로케이션이나 씨딩 같은 단어는 그냥 영단어가 더 이해하기 좋지 않나? 싶어서, 어느 정도까지 그냥 영단어를 쓸지 인 것 같아요. colocation이나 아예 응집성 같은 단어라던지?!

개인적인 질문으로는 msw를 구현해도 결국 서버에서의 로직을 프론트가 알아서 구현해야하는 것인지? 인데, 예를 들어 이번 미션의 경우, 상품 목록을 가져올 때 sort 로직을 그럼 msw handler에서 저희가 구현해야하나? 싶네요

제 생각을 말씀드린다면~ 번역이 조금 이상해서 이렇게 이해할 수 있다고 생각이 드네요!
정확하겐 msw에서는 백엔드의 로직을 구현할 필요가 없다! 가 아니라
fetch는 그 자체를 모킹하는 것이기 때문에, 각각의 테스트 파일에 해당하는 fetch에 해당하는 백엔드 로직을 전부 다 만들어줘서 중복되는 로직이 발생할 수 있다는 것입니다!
msw를 사용하면, 백엔드 로직을 만들더라도, handler 에서 한 번에 관리할 수 있기 때문에 중복된 로직을 줄일 수 있구요,
fetch를 하나의 모듈에서 관리한다 하더라도, 그 url값을 받을 수 없어서 결국 각각의 테스트 로직에 대한 백엔드를 작성해야하기 때문입니다!

@Jaymyong66 Jaymyong66 merged commit 1fb7029 into main Jun 3, 2024
1 check failed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants