[코드숨] 리액트 4주 차 회고

코드숨의 소프트웨어 개발의 지혜 <리액트 편> 9기 과정을 시작한 지 어느새 한 달이 지났다. 한 달 전과 비교했을 때 가장 큰 변화는 역시 습관이다. 공부하고 정리하는 습관이 좀 더 체계적으로 잡혀가고 있다는 생각이 든다. 그리고.. 본격적으로 여름이 시작됐는지 너무 더워졌다! 😱

Flux Architecture & Redux

이번 주의 학습 목표는 Redux를 이용해서 TDD로 레스토랑 목록 보기 및 추가 기능을 개발하는 건데 이를 위해 과제에 앞서 Redux와 Flux Architecture를 학습했다.

출처: https://facebook.github.io/flux/docs/in-depth-overview/

Flux Architecture를 설명하는 대표적인 자료다. Action이 Dispatcher를 통해 Store에 전달되고, 그렇게 바뀐 Store의 상태가 View에 반영된다. 이 개념은 Redux에서도 똑같이 사용되는데 Redux가 Flux Architecutre의 구현체이기 때문이다.

 

이렇게 개발하면서 얻을 수 있는 가장 큰 이점은 상태 관리는 Redux에 맡기고, React는 View에만 관심을 가질 수 있다는 것이다. 실제로 이번 과제를 진행하면서, 비록 간단한 프로그램이긴 하지만 각 모듈 별로 각각의 관심사가 명확히 나눠져 있어서 테스트 작성이나 기능 개발이 수월했다.

 

요즘엔 상태 관리로 Context API나 Recoil도 많이 쓰인다고 하는데 이에 대해서 공부해 보는 것도 좋을 것 같다.

TDD

지난주 과제에서도 테스트를 작성하긴 했지만, 이미 작성된 컴포넌트에 테스트를 추가했던 거라 사실상 TDD는 이번 주부터 시작이었다. 이번 주 과제는 총 2가지로 다음과 같다.

1. To-do 리스트 Redux를 사용하여 리팩터링 하기
2. 레스토랑 정보 확인 및 예약 시스템 구축하기

첫 번째 과제는 아샬 님의 강의 내용과 일치했기 때문에 참고를 많이 했는데 강의를 보고, 과제를 진행하면서 TDD의 루틴을 익힐 수 있었다.

 

두 번째 과제에서는 코드숨을 시작하고 처음으로 바닥부터 TDD로 개발하는 경험을 할 수 있었다. 2주 전의 나로 돌아간다면 테스트 코드 한 줄 자신 있게 작성하는 게 쉽지 않았겠지만, 지난주의 테스트 작성 과제와 이번 주의 첫 번째 과제를 통해 어느 정도 훈련이 됐는지 생각만큼 어렵지는 않았다. 😅

Reducer Test

직접 TDD로 개발하면서 느낀 장점은 크게 두 가지다.

 

첫 번째는 위 사진과 같이 명세를 작성하듯이 테스트를 작성하기 때문에 내가 개발하는 기능을 명확히 할 수 있다.

 

두 번째는 작성한 코드를 수정할 때 정말 편하다. 이번 과제를 진행하면서도 상태의 데이터 구조를 바꾸는 리팩토링 작업이 있었는데 코드를 수정할 때마다 제대로 수정했는지 즉각적으로 피드백을 주고, 문제가 있다면 그 부분만 찾아서 수정하면 되기 때문에 안전하고, 빠르게 코드를 수정할 수 있었다.

TIL

TIL 주 5회 작성 성공

지난 회고에서 TIL 작성이 오래 걸린다고 했었는데, 윤석 님께 공부한 것이 아니라 배운 것을 정리하고 그 방법으로 TIL을 3분 안에 쓴다고 상상하거나 실제로 그렇게 해보라는 피드백을 받았다. 시도해 봤지만 주제와 키워드를 뽑는 것만으로도 항상 3분은 지나있었다. 그래도 10분은 안 넘기도록 하고 있는데 이 역시 꾸준한 노력이 필요할 것 같다.

고통 주도 개발

코드숨의 교육 특징

3주 차인 지난주부터 과제의 난이도가 확실히 높아졌다는 생각이 든다. 나도 그렇고, 같이 공부하는 동기 분들도 많은 고통을 겪고 있는 것 같다. 힘들지만 빠른 성장을 위해서는 필수적인 고통이기 때문에 포기하지 않고, 끝까지 최선을 다해서 꼭 각자 목표하던 바를 이룰 수 있었으면 좋겠다. 💪