메가테라 16주차 주간회고

16주 차 회고


메가 테라 16주 차를 진행하면서 있었던 일을 종합해서 회고하였습니다.

 

이번 주는 지난주에 대부분의 기능은 구현했기 때문에 디테일적인 부분과 전체적인 완성도를 높이는데 집중을 했던 것 같다. 특히 테스트 코드를 작성하는데 시간을 대부분 할애한 것 같은데 그 이유는 모킹에 대한 어려움을 겪었었기 때문이다. 강의에서 배운 대로 따라 해도 혼자 하면 생각보다 쉽지 않아서 모킹 하는 방법을 익히는데 시간을 많이 들였다.

근데 모킹을 하지 않아도 테스트가 가능하다는 것을 뒤늦게 깨달았다. 모킹 때문에 테스트 코드 작성이 어려우면 설계가 잘못되었을 가능성이 높다는 아샬님의 영상을 보고 컴포넌트 구조를 살짝 바꿨는데 모킹 없이 쉽게 테스트할 수가 있었다.

page 컴포넌트에서 필요한 것들을 불러와 하위 컴포넌트에게 props로 전달해 주는 구조였는데 처음에는 이 구조를 제대로 이해하지 못했었다. 강의에서 page 컴포넌트 만들고 page 컴포넌트 안에서 또 컴포넌트를 선언해 그 안에서 웹페이지에 보여줄 것들을 적어줬었는데 처음에는 page 컴포넌트는 아무것도 안 하는 것 같은데 왜 두 번을 거쳐서 컴포넌트를 만드는지 이해를 못 했었다.

 

 

이런 식으로 LoginPage 컴포넌트는 아무것도 없이 LoginForm만 리턴하고 있었다.

근데 이 구조 또한 관심사의 분리를 위해 만들어졌었다는 것을 너무 늦게 깨달았다.

page 안의 컴포넌트(LoginForm)는 웹 페이지에 보이는 것들만 존재하고 이 컴포넌트에서 필요한 값들은 page 컴포넌트에서 선언하여 props로 전달받아 사용하는 구조였었다. 결국엔 나의 코드는 관심사의 분리가 제대로 되지 않은 상태였었다. 관심사의 분리가 전혀 되지 않아 테스트하기도 어려웠고 코드를 수정하기도 어려웠었다. 뒤늦게나마 props로 값들을 넘겨주는 식으로 구조를 바꾸니 테스트 작성이 한결 편해졌었다.

2주간 고생해셔 만든 마카오 기프트 웹 서비스 중 스토어 화면이다.

 

어떤 상품들을 진열할까 하다 무신사에 있는 인기 상품들로 꾸미니까 나름 쇼핑몰 같이 생겼다.. ㅎㅎ

 

다음 주부터는 지금까지 배운 것들을 활용해서 2달간의 프로젝트가 시작되는데 2주 동안 레벨테스트를 진행해 보면서 목표가 항상 있어야 2달간 지치지 않고 프로젝트를 진행할 수 있을 것 같다는 판단이 들었다.

한 주 한 주간 목표 설정을 제대로 해서 지치지 않고 원하는 서비스를 제대로 한번 만들어 보자