Vue는?

웹 프런트 엔드 MVC 프레임 워크입니다.
공식 문서로 「처음에 보는 페이지」가 이쪽에 준비되어 있으므로, 모르는 쪽은 봐 주세요.

Vue 공식 문서: 소개
htps // jp. 아 js. rg/v2/구이데/가서 x. HTML

Vue의 제작자 에반씨
htps : // 기주 b. 이 m/u yx990803
(※이전에는 meteor도 개발되고 있었던 것 같다! meteor는 일본에서는 활발하지 않네요. 프런트 엔드로부터 멀어지기 때문에 여기 근처에서··)

Vue는 무엇이 좋은가?

하지만 프런트 엔드 프레임 워크는 많이 있죠? 유명한 것이라면, React, Angular이지만, 그 근처의 비교가 정중하게 Vue의 공식으로 정중하게 쓰여져 있어요. 덧붙여서 전 전직까지 Angular 사용이었습니다. 그 밖의 변의 차이도 쓰고 싶지만, 오늘은 Jest에 대해서만 쓰네요. (이 기사에 좋아하는 사람이 많으면 기력으로 쓸 수 있을지도 모른다)

Vue 공식 문서: 다른 프레임워크와의 비교
htps // jp. 아 js. 오 rg/v2/구이데/코 m파리소. HTML

Jest는?

Facebook이 개발하는 웹 프런트 엔드에서 실행되는 프로그램 (JavaScript 및 TypeScript) 단위 테스트 용 테스트 프레임 워크입니다.
쉘상에서 테스트 결과를 볼 수 있습니다.

공식 문서(일본어): htps : // / stjs. 이오 / 그럼 /

어떻게 사용합니까?

Jest 단체로 넣는 경우는 이쪽을 참조해 주세요.
htps : // / stjs. 이오/도 cs/그럼/갓찐 g-s r d. HTML

Vue-CLI를 사용하고 있으므로 Unit Test Framework는 Vue-CLI를 설치할 때 설정했습니다.

설정 방법은 Vue-CLI 설치 시 "단위 테스트는 무엇으로 하는가?"라고 듣기 때문에 Jest를 선택합니다. 그만큼.
Pick a test runner는 곳이군요.


※이 스크린 샷은 개인 앱의 초기 설정을했을 때 찍은 것입니다. 반년 전이므로 스타일이 바뀌고 있을지도 모릅니다.

Vue-CLI: htps : // cぃ. 아 js. rg/

Jest를 선택한 이유

이전 Jasmine을 사용하고 있었습니다만, 쓰는 방법이 비슷해서 들어가기 쉽다고 생각했기 때문에.
Jasmine: h tps // 그럼 s 미네. 기주 b. 이오/

호환성도 있으므로 지금까지 만든 앱 마이그레이션도 쉽게 할 수 있다는 것입니다.
htps : // 지 stjs. 이오 / 도 cs / 자 / 미 g 라치 온구이

좋은 곳

아직 쓰기 시작한 지 얼마 지나지 않아 많이 말할 수는 없지만 · ·

커버리지가 매우 알기 쉽다. 게다가 행수까지 나온다. 이러한 행의 처리에 대해서 테스트가 쓰여지지 않았다고 지적되는 것입니다. 웃음

모의 함수도 Jasmine과 비슷해서 사용하기 쉽다.
(mock의 사용성은 API 통신이 들어가는 기능 테스트를 할 때 중요하다고 생각하기 때문에. 사전 준비의 간이함이라는 의미로.)
htps : // / stjs. 이오 / 도 cs / 그럼 / 모 CK FUNC C Chion s

Uncovered Line에 행 수가 표시됩니다. 기본적으로 업무에서는 앱 전체&개별로 80%를 넘으면 OK라고 생각하고 있습니다.


이미지 인용 소스 : htps : // 지 stjs. 이오/

나쁜 곳

지금은 찾을 수 없습니다.
Jasmine 때는 테스트 시간이 길고 엉망이었습니다만, 아직 많은 테스트를 쓰고 있지 않으므로, 향후 개발하면서 모습을 보고 싶습니다.

도입을 망설이고 있는 분에게

공식 문서도 일본어 대응＆충실하고 있으므로, 개인적으로는 안심할 수 있는 프레임워크라고 생각하고 있으므로 추천입니다. 특히 jasmine이라든지 mocha라든지 사용하고 있던 사람은 슬러슬라라고 쓸 수 있을 것이다. 차이를 모르는 정도(말씀)ヽ(^o^)동