티스토리 뷰
[React] TDD(Test Driven Development), 자기 주도 개발 - 테스트가 개발을 이끌어 나간다 ✨
doeunnkimm 2023. 4. 23. 23:57
🚀 TDD란?
TDD란 Test Driven Development의 약자로, '테스트 주도 개발'이라고 합니다. 반복 테스트를 이용한 소프트웨어 방법론으로, 엔지니어 켄트 벡(Kent Beck)에 의해 고안되었습니다.
작은 단위의 테스트 케이스를 작성하고 이를 통과하는 코드를 추가하는 단계를 반복하여 구현합니다. 짧은 개발 주기의 반복에 의존하는 개발 프로세스이며 애자일 방법론 중 하나의 eXtream Programming(XP)의 'Test-First' 개념에 기반을 두고 있습니다.
eXtream Programming(XP)란 ?
미래에 대한 예측을 최대한 하지 않고, 지속적으로 프로토타입을 완성하는 애자일 방법론 중 하나이다. 이 방법으로는 추가 요구사항이 생기더라도, 실시간으로 반영할 수 있다.
+애자일) 협력과 피드백
TDD란 대체 무슨 의미일까
예를 들어, 자동차를 만든다고 생각했을 때, '엑셀을 만들고', '브레이크를 만들자'라고 개발을 시작하게 될 겁니다. 하지만 TDD 방법론으로 진행하게 되면, '엑셀을 밟으면 차가 앞으로 가는가', '엑셀을 놓으면 차가 서서히 서는가', '브레이크를 밟으면 차가 서는가'라는 체크리스트를 사전에 만들게 되는데 그것이 Test라고 보면 되겠습니다.
그리고 해당 체크리스트가 통과되도록 로직을 만들게 되면 우리가 원했던 '엑셀'과 '브레이크'를 만들었다고 볼 수 있는 것입니다.
개발자들에게 TDD가 필요한 이유
위 이유는 생각하기 나름으로 유지보수를 위함일 수도 있지만, 위에서 얘기했던 자동차를 만드는 케이스로 생각해보면, 만약 제품을 먼저 만드는 단계에서 '엑셀'을 만들고, 밟으면 앞으로 가고, 놓으면 서는 기능을 넣을 것입니다. '브레이크'를 만들고 밟으면 서고, 놓으면 아무런 기능을 하지 않도록 만들 것입니다.
어떤 기능 구현에 대해 생각하다보면 결합(integration)에 대한 부분을 놓치기 쉽습니다. 만약 '엑셀과 브레이크를 동시에 밟으면?'와 같은 케이스를 생각해보기 어렵다는 말과 같습니다. 하지만 체크리스트라는 기준으로 생각하게 되면, 아무래도 위와 같은 케이스를 생각하기가 조금 쉬워집니다.
결론적으로 TDD를 해야하 이유를 다음과 같이 정리해 보았습니다.
- 개발자가 의도한대로 로직이 동작하는지 명확하게 알 수 있고, 로직에 대해 보증할 수 있다.
- 사전에 다양한 케이스를 고려해봄으로써 문제가 될 수 있는 잠재적 오류를 방어할 수 있다.
일반 개발 방식과 TDD 개발 방식의 비교
일반 개발 방식
보통 개발 방식은 '요구사항 분석 → 설계 → 개발 → 테스트 → 배포'의 평태의 개발 주기를 갖습니다.
이러한 방식은 잠재적 위험이 존재합니다. 그 이유는 아래와 같습니다.
- 소비자의 요구사항이 처음부터 명확하지 않을 수 있다.
- 따라서 처음부터 완벽한 설계는 없다.
- 자체 버그 검출 능력 저하 또는 소스코드의 품질이 저하될 수 있다.
- 자체 테스트 비용이 증가할 수 있다.
이러한 문제점이 발생되는 이유는 어느 프로젝트든 초기 설계가 완벽하다고 말할 수 없기 때문입니다.
고객의 요구사항 또는 디자인의 오류 등 많은 외부 또는 내부 조건에 의해 재설계하여 점진적으로 완벽한 설계로 나아가고는 합니다. 재설계로 인해 개발자는 코드를 삽입, 수정, 삭제하는 과정에서 불필요한 코드가 남거나 중복될 가능성이 큽니다.
결론적으로 이러한 코드들은 재사용이 어렵고 관리가 어려워서 유지보수를 어렵게 만듭니다.
작은 부분의 수정에도 모든 부분을 테스트해야 하므로 점진적으로 버그를 검출하기 어려워집니다. 따라서 자체 버그 검출 능력이 저하됩니다. 그 결과 어디서 버그가 발생할지 모릅니다. 이는 소스코드의 품질 저하와 직결되고, 작은 수정에도 모든 기능을 다시 테스트해야하는 문제가 발생하여 자체 테스트 비용이 증가됩니다.
TDD 개발 방식
TDD와 일반적인 개발 방식의 큰 차이점은 테스트 코드를 작성한 뒤에 실제 코드를 작성한다는 것입니다. 디자인(설계) 단계에서 프로그래밍 목적을 반드시 미리 정의해야만 하고, 무엇보다 테스트해야 할지 미리 정의(테스트 케이스 작성)해야만 합니다. 테스트 코드를 작성하는 도중 발생하는 예외 사항(버그 및 수정사항)은 테스트 케이스에 추가하고 설계를 개선합니다. 이후 테스트가 통과된 코드만을 코드 개발 단계에서 실제 코드로 작성합니다.
이러한 반복적인 단계가 진행되면서 자연스럽게 코드의 버그가 줄어들고 소스코드는 간결해집니다. 또한 테스트 케이스 작성으로 인해 자연스럽게 설계가 개선됨으로 재설계 시간이 절감됩니다.
TDD 개발 방식의 장점
보다 튼튼한 객체 지향적인 코드 생산
TDD는 코드의 재사용 보장을 명시하므로 TDD를 통한 소프트웨어 개발 시 기능 별 철저한 모듈화가 이루어집니다. 이는 종속성과 의존성이 낮은 모듈로 조합된 개발을 가능하게 하며 필요에 따라 모듈을 추가하거나 제거해도 소프트웨어 전체 구조에 영향을 미치지 않게 됩니다.
재설계 시간의 단축
테스트 코드를 먼저 작성하기 때문에 개발자가 지금 무엇을 해야하는지 분명히 정의하고 개발을 시작하게 됩니다. 또한 테스트 시나리오를 작성하면서 다양한 예외사항에 대해 생각해 볼 수 있습니다. 이는 개발 진행 중 전반적인 설계가 변경되는 일을 방지할 수 있습니다.
디버깅 시간의 단축
이는 유닛 테스팅을 하는 이점이기도 합니다. 예를 들면 사용자의 데이터가 잘못 나온다면 DB의 문제인지, 비즈니스 레이어의 문제인지 UI의 문제인지 실제 모든 레이어들을 전부 디버깅 해야하지만, TDD의 경우 자동화된 유닛 테스팅을 전제하므로 특정 버그를 손 쉽게 찾아낼 수 있습니다.
테스트 문서의 대체 가능
프로젝트를 진행하다 보면 문서를 많이 만들게 되는데, 코드에 대한 문서는 의미가 없는 경우가 많다고 합니다. 문서는 잘 바꿀 수 없지만, 코드는 계속 바뀌기 때문입니다. 만약 TDD의 테스트 코드를 문서로 쓴다면, 코드와 함께 업데이트되기 때문에 항상 코드 문서의 동기(sync)를 맞출 수 있게 됩니다.
TDD 개발 방식의 단점
가장 큰 단점은 바로 생산성 저하
개발 속도가 느려진다고 생각하는 사람이 많기 때문에 TDD에 대해 반신반의 한다고 합니다. 왜냐하면 처음부터 2개의 코드를 짜야하고 중간중간 테스트를 하면서 고쳐나가야하기 때문입니다. TDD 방식의 개발 시간은 일반적인 개발 방식에 비해 대략 10~30% 정도 늘어난다고 합니다.
TDD 시작하기
테스트 주도 개발(TDD)은 위와 같은 사이클로 작동합니다.
1. 먼저 실패하는 테스트를 만들고
2. 테스트가 성공하게 하는 코드를 구현하고
3. 리팩토링
TDD에 대해 찾아보면 가장 많이 나오는 내용임에도 불구하고 잘 이해가 되지 않을 수 있는데요.
2019년 12월 로버트 C 마틴이 트윗한 내용에 의하면 TDD를 다음과 같이 요약할 수 있습니다.
- 실패하는 테스트 없이 코드를 넣지 않기
- 실패가 생기면 테스트 작성을 멈추기
- 실패한 테스트를 넘기면 즉시 코딩 멈추기
- 리팩토링 이후 반복
시작하기 전에
제가 참고한 블로그에서 시작하기 전에 마음에 담고 시작하면 좋은 몇 가지가 정리되어 있어 여기에도 정리를 해보았습니다.
위 블로그에서는 마음에 담고 시작하면 좋을 3가지를 이야기했습니다.
- 최소 단위 테스트 :테스트는 가장 작게
- 테스트 대상의 고립 : 테스트 대상은 다른 UI 컴포넌트에 의존성이 없어야 한다
- 테스트의 문서 역할 : 다른 문서가 없어도 테스트를 읽으면 우리가 작성한 코드를 다른 개발자가 바로 쓸 수 있도록
여기까지해서 TDD에 대해 알아보았습니다 :)
앞으로는 테스트 코드를 써보는 연습을...........
'프론트엔드 > React' 카테고리의 다른 글
[React] jest-dom으로 처음 테스트해보기 & 테스팅 라이브러리 구문 소개 (0) | 2023.06.06 |
---|---|
[React] Storybook 소개 & 사용법 📖 + 심화 (2) | 2023.06.04 |
[React] Jotai👻로 전역 상태 관리를 해보자 (0) | 2023.04.22 |
[React] Hook에 대해 정확히 이해해보자📌 (0) | 2023.04.06 |
[React] styled-components와 emotion는 무슨 차이 ? (0) | 2023.04.06 |
- Total
- Today
- Yesterday
- 디프만
- 프론트엔드 기초
- jest
- react-query
- JSP
- react
- TypeScript
- 프론트엔드 공부
- testing
- 데이터분석
- 인프런
- 자바스크립트
- 자바
- 타입스크립트
- 머신러닝
- 자바스크립트 기초
- 파이썬
- Python
- CSS
- 프로젝트 회고
- 리액트 훅
- styled-components
- 딥러닝
- frontend
- 리액트
- 스타일 컴포넌트 styled-components
- HTML
- rtl
- next.js
- 프론트엔드
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |