TDD로 배우는 웹 프론트엔드 강의 후기
이번에 글또9기에 참여하면서 Udemy 측에서 무료 강의 수강권을 글또 인원들에게 제공해주셨다. 그 기회로 TDD로 배우는 웹 프론트엔드 강의를 수강하게되어 후기를 작성해보려 한다.
강의 개요
TDD로 배우는 웹 프론트엔드 강의는 우아한형제들에 재직중이시고 우아한테크코스의 교육자로 유명하신 메이커준님께서 교육해주시는 강의이다. Cypress를 활용한 TDD 기반의 웹 애플리케이션 개발 방법을 배울 수 있는데 Cypress의 기본적인 사용 방법을 익히고 테스트 코드와 애플리케이션 개발을 위해 문제를 잘개 쪼개는 방법부터
TDD적인 사고방식을 기를수 있는 강의라고 할 수 있다. 총 강의 시간은 3시간 30분짜리로 마음만 먹으면 하루도 안되서 금방 다 수강할 수 있는 그다지 길지 않은 강의이다.
강의 구성은 위와 같다. 프로그래밍을 효과적으로 학습하는 방법과 같이 기본적인 개발자적인 소양부터 크롤링 프로그램을 만들어보는 것 까지 짧은 강의지만 개발자들에게 유용한 알짜배기 내용들이 담겨있다.
강의에서 좋았던 점
방금 언급했다시피 초반에 프로그래밍을 효과적으로 학습하는 방법부터 먼저 배우는데 나는 메이커준님의 이러한 섬세한 포인트들이 강의에 녹아있어서 좋았다. 강의를 수강하는것이 왜 어려운지, 어떠한 마음가짐이 필요한지, 어떻게 재밌게 공부할 수 있는지 개발자적인 관점으로 마인드셋 할 수 있도록 도와주시고, 보통 다른 강의들은 냅다 설명부터 바로 들어가면서 쉴새없이 쭉 달리는데 메이커준님의 강의는 단순히 주입식 교육이 아니라 좋았다.
기억에 남았던 내용중 하나는 바로 TDD에 대한 Best Practice이다. 강의에서 만들어봤던 계산기 애플리케이션과 함께 Best Practice를 나열해보면 다음과 같다.
- 전체 문제가 해결되었을 때 어떤 상태일지 상상하기. 결국 내가 뭐하려는 걸까?
이 그림을 그릴 수 없으면, 굉장히 삽질을 많이 하게 된다. 계산기의 핵심 기능이 뭘까, 핵심적으로 뭐가 동작되야 하는 걸까
사용자가 숫자 버튼을 클릭하고, 연산된 결과를 보여준다. - 적당한 난이도로 문제를 쪼개거나 변형하기. 단, 핵심을 포함하게!
- display 부분에 연산 결과를 보여준다.
- 덧셈 기능
- 뺄셈 기능
- 곱셈 기능
- 나눗셈 기능
- AC
- ...
- 핵심과 가까우면서 할 수 있는 적절한 것을 하나 선택
- display 부분에 연산 결과를 보여준다.
- 결과치가 뭔지 구체화하고 최대한 진짜처럼 시뮬레이션
- it("최초 페이지에 접속했을 때 디스플레이에는 0이 표시된다", () => {...})
- 동작 가능한 가장 작은 버전의 솔루션을 만들고 테스트가 통과하는지 확인한다.
구현 코드 - 리팩터링을 하면서 중복을 줄이거나, 의도를 드러나게 한다. (의도가 잘 드러나기 위한 중복은 허용) 모든 리팩터링 단계마다 테스트가 통과되는지 확인한다.
- 다시 1번이나 2번으로 돌아간다
이러한 개념들이 나를 TDD스럽게 사고하도록 가이드 해주었다.
총평
강의에서도 설명해주는데, TDD 프로그래밍의 가장 큰 의미는 바로 빠른 피드백을 받을수 있다는 부분이다. 내가 잘 개발하고 있는것인지, 잘못된 방향으로 가고있는 것은 아닌지 빨리, 혹은 더 자주 '피드백'을 받는다면 올바른 방향으로 가기 훨씬 수월할텐데 그런 의미에서 TDD적인 생각을 기를 수 있는 이 강의가 도움이 되었다.
그런데 총 수강 시간이 3시간 30분 짜리였던 만큼 이 짧은시간 안에 TDD에 대한 굉장히 딥한 내용까지는 다루지는 않는다. 딱 TDD 강의로 가볍게 보기 좋은 정도? Cypress의 기본 사용 방법에 대해 익히기에도 좋은 내용이였던 것 같다. 분명 실무에서는 이보다 더 복잡한 비즈니스 로직과 함께 테스트 코드를 작성해야 할 일이 있을텐데 더 TDD에 대해 배우고 싶다면 다른 TDD 강의를 추가로 더 수강하는 것을 추천한다.