[Vanilla JS 문서편집기 설명 및 개선] 9. Jest를 이용해 테스트 코드 적용하기

도입 목적지난번에 이어 Rich한 에디터를 만들어야하지만 그 전에 테스트 코드를 도입하기로 했습니다. 🎉이유는 Rich 에디터를 만들면서 코드도 너무 복잡하게 꼬이고, 버그 하나를 고치면 버그가 새로운 곳에서 생기는 문제가 자주 발생했기 때문입니다. 버그를 고치고 일일히 모든 기능을 테스트하기엔 자원의 낭비가 심했고 이에 따라 리팩토링을 하는데 엄두도 나지 않았습니다.하지만 테스트 코드를 적용한다면? 오류가 나도 테스트에서 알려주기 때문에 안심하며 리팩토링이 가능합니다!이런 목적으로 도입하게 되었고 연습삼아 Component 템플릿의 테스트 코드를 작성해보았습니다. 제가 Jest를 선택 한 이유와 테스트 코드의 장점, 환경 구축하는 법은 Jest를 Vite 프로젝트에 적용하기에 자세히 설명했습니다. C..

• format_list_bulleted 프로젝트/Vanilla JS 문서편집기
• · 2024. 9. 15.
• textsms

Jest를 Vite 프로젝트에 적용하기

사용 목적프로젝트를 진행하며 점점 테스트 코드의 필요성을 느끼게 되었습니다.한 부분에서 오류 나서 수정하면 기존에 잘 동작하던 부분에서 오류가 발생하고 수정하면 또 오류 발생하고... 무한반복...지금 프로젝트가 이 상태....오류를 수정하고 다른 곳에 문제가 없는지 직접 테스트해보는 건 정확도도 떨어지고 시간 낭비라 생각되었습니다. 그렇기 때문에 관심은 많았지만 미뤄뒀던 테스트 코드 적용을 해야겠다고 마음먹었습니다!테스트 코드를 작성해야하는 이유1. 사업의 신뢰성버그가 포함된 채로 배포된 코드는 서비스의 이미지를 추락시킵니다. 그리고 이 이미지를 회복하려면 많은 시간과 비용이 필요합니다. 테스트 코드는 예상하지 못한 버그를 조기에 발견해 서비스 이미지를 지켜주는 역할을 합니다. 2. 높은 유지보수성개발..

• format_list_bulleted 개발 공부/기타 (개발 공부)
• · 2024. 9. 15.
• textsms