개발기술/감정일기장(React)

[TDD] Jest + react-test-library

✅ 참고자료 해당 글은 코딩앙마 유튜브의 React Testing Library 강의를 참고하여 작성했습니다 전체 코드를 볼 수 있는 저의 Github URL입니다 https://github.com/yeafla530/jest-practice 이 전 글을 보실 분들은 아래를 눌러주세요 Jest 기본 ✅ react-test-library 🔴 특징 렌더링 결과에 집중 실제 DOM에 대해 신경을 많이 쓰고 컴포넌트의 인스턴스에 대해 신경쓰지 않고, 실제 화면에 무엇이 보여지는지, 어떤 이벤트가 발생했을 때 화면에 원하는 변화가 생겼는지 이런것을 확인하기에 더 최적화 되어 있음 jest-dom을 이용해 DOM에 관련된 `matcher`를 추가해줌 react 공식문서에서도 추천하는 testing방법 react-te..

[TDD] Jest 기본

✅ Jest란? Jest는 페이스북에서 만들어서 React와 더불어 많은 자바스크립트 개발자로부터 좋은 반응을 얻고 있는 테스팅 라이브러리 입니다. Jest는 라이브러리 하나만 설치하면, Test Runner와 Test Mathcher 그리고 Test Mock 프레임워크까지 제공해주기 때문에 현재 대세라고 말할 수 있습니다. ✅ Jest 학습 이유 많은 기업에서 Jest를 이용한 테스트를 진행한다는 것을 알게되었고 TDD를 사용해 개발을 진행해보고 싶었습니다. TDD를 사용하게 될 경우 생산성이 저하될 수 있다는 단점이 있긴 하지만 버그가 줄어들고 소스코드가 간결해진다는 장점이 있습니다. Test Code를 작성하여 정확성을 높이고 어떻게 하면 더 나은 코드를 작성할 수 있을지 고민하고 개선해보기 위해 ..

[React] "한입 크기로 잘라먹는 리액트" 강의 후기 (feat. 감정일기장)

인프런의 :"한입 크기로 잘라먹는 리액트(React.js) : 기초부터 실전까지" 강의를 토대로 프로젝트를 완료하고 작성한 글입니다. 리액트를 공부한 이유 Vue.js에서는 템플릿 구문을 사용하는데 React.js는 javascript 문법을 그대로 사용하여 javascript 실력을 향상시킬 수 있다 생각했습니다. React.js를 배우면 React의 파생 기술인 React Native또한 금방 익힐 수 있어 데스크탑, Android, IOS에서 동작하는 애플리케이션을 배울 수 있다라는 장점때문에 배우고 싶다 생각했습니다. 많은 기업들이 React를 사용하는 만큼 취업에도 도움이 될 것이라 생각했습니다. 프로젝트를 만들고 배운 것 ✅배포 URL : https://yerm-react-diary.web.a..