Mocking 라이브러리를 도입해야하는 이유

Frontend 현재 이슈

• 신규 개발 진행 시
  • 백엔드 API 작업과 동시에 FE 개발을 진행할 경우
  • FE 개발사항
    • 백엔드 개발자와 API 인터페이스 상의 후 스펙정의
    • mocking 데이터가 만들어지기 전까지는 샘플 데이터를 만들어서 화면 컴포넌트를 개발 진행
      • 기획/제플린 시안에 맞게 테스트를 위해서는 조건에 맞는 샘플 데이터를 생성
• 기존 기능을 변경 시
  • FE 개발사항
    • 백엔드 개발자분이 실 API를 만들어 주기 전까지는 API 연동불가
    • 제플린, 기획문서에 나온 화면만으로 분석이 어려움(상태값/데이터에 따른 화면이 달라짐)
      • 기획/제플린 시안에 맞게 테스트를 위해서는 조건에 맞는 샘플 데이터를 생성
• 결론
  • 신규/기존 기능을 개발하던지, 백엔드 mock/실 api 나오기 전까지는 구현된 코드에 샘플데이터를 만들어서 테스트 진행
    • 실수로 샘플데이터/연동 코드를 지우지 않는 경우 코드 에러, 서비스 품질 안좋아짐.
    • 개발 막바지에 mock/실 API 연동 시 여러 상황에 대한 테스트가 전반적으로 이뤄지지 못해서 FE팀 업무가 과중됨
  • 실질적인 개발일정 수립 및 코드 품질이 좋지 않음.

이런 일은 왜 일어날까?

백엔드 API 작업과 동시에 FE 개발을 진행할 경우

• 대부분의 개발 진행 시 기획,디자인/BE/FE 개발이 동시에 진행되다보니, 프로젝트 완성 단계의 엔드포인트 담당하는 FE팀이 API연동/샘플데이터 생성/테스트 등을 작업함으로써 시간적인 압박, 진행에 어려움 발생

기존에 개발된 화면 수정을 위해서 기능 파악 해야할 경우

• 기획/디자인/개발 관련 정의서 미흡하거나 담당자가 부재일 경우
  • 기능 파악을 위해서 샘플데이터 생성, 백엔드에 API 문의 등 개발하는데 걸림돌이 많음

FE팀에서 해결하고자 하는 점은 무엇일까?

백엔드 API 작업과 동시에 FE 개발을 진행할 경우

• 실 구현 코드에 샘플데이터를 추가/수정하지 않고, API 인터페이스에 맞춰서 병행해서 개발이 가능하면 좋겠다.
  • 특히 실 API 연동 시 최대한 문제 없이 연동이 가능하면 좋겠다.
• API 개발이 완료되기 전에 프론트엔드 실 개발을 마무리 하면 좋을 것 같다.