TIL

TIL - 20220607

오늘은 코드숨 리액트 6주차 과제를 진행했다. 강의 영상을 시청하면서 지난 3주차부터 5주차까지 테스트, redux 테스트, redux 비동기 테스트를 과제를 진행하며 쉽지 않았던 기억이 존재했기에 이번 라우팅 테스트는 얼마나 어려울려나 초조한 마음으로 시청하고 있었는데 라우팅 테스트하는 법에 대해 강의로 알려주셔서 천만다행이라고 생각했다. 또한, 라우팅 테스트는 비교적 간단했다. Link 태그를 사용하고 있는, 그 위에 존재하는 컴포넌트들을 테스트할 때, react-router-dom에서 제공하는 MemorRouter로 감싸주어 @testing-library/react의 render로 진행하면 된다. 해주지 않으면, 테스트를 진행하는 console 창에서 error를 보게 된다. 다음과 같이 작성하면 ..

TIL - 20220606

오늘은 코드숨 리액트 과정의 6주차로 라우팅에 대해 공부했다. 과거 코드숨 과정을 진행하기 전 리액트를 독학으로 공부할 때, react-router-dom을 잘못 사용해서 한 페이지에서 다른 페이지로 바뀔 때 바뀐 부분만 렌더링하는 리액트의 장점을 활용하지 못하는 것 같다는 생각을 한 적이 있어 6주차의 라우팅이 기대되는 수업들 중 하나였다. 먼저 이 고민에 대한 답은 react-router-dom switch 밖으로 빼줘야하는 것이었다. 예를 들어, 우리가 사용하는 홈페이지들 중 중복해서 사용하는 헤더 부분은 switch 밖으로 빼고 여러 페이지들의 라우팅은 switch 안에 route를 이용하여 처리해주어야 하는 것이다. 또한, 위 이미지와 같이 App 컴포넌트에서 사용하는 BrowserRouter를..

TIL - 20220605

오늘은 코드숨 커뮤니티에서 마침 내가 이번 한 주 동안 열심히 공부했던 Github Commit 메시지 관련하여 재밌는 정보를 배웠다. 정말 정곡을 찔렸다. 내가 이번 한 주 동안 이미지와 같이 Feat:, Fix -, Refactor -,TEST와 같은 형식으로 작성했다. 지금 돌이켜보면 왜 이렇게 작성해야 하지?라는 의심을 전혀 하지 않았다. 실제 다른 분의 pull request도 이러한 형식으로 작성되어있었고, Github Gommit 메시지 작성법을 구글링 통해 찾아보다 앞서 말한 형식으로 제목을 짓는다는 글을 보고 의심이 순식간에 확신으로 바뀌어버렸다. 내가 하는 형식은 그저 형식일 뿐이다. 정확히 표현하면 udacity의 스타일 가이드일 뿐 이 스타일 가이드를 맹목적으로 따를 필요는 없는 것..

TIL - 20220604

오늘은 코드숨 리액트 5주차 과제 풀이 영상을 보며 풀이 과정과 어떤 결정을 하는지 자세히 지켜보며 복습하는 시간을 가졌다. 먼저, 가장 인상 깊게 느낀 부분은 TDD Cycle은 지키면서 파일간 이동이 자유롭다는 점이다. 나는 과제를 진행하면서 reducer부터 시작하면 reducer 테스트 코드 작성 - reducer 코드 작성 - reducer 리팩토링 다음으로 action 테스트 코드 작성 - action 코드 작성 - action 리팩토링으로 이어지면서 reducer 테스트 코드를 작성할 때는 action 테스트 코드를 작성하지 않는 약간 경직된 개발 방식으로 진행했다. 하지만 아샬님은 reducer 테스트 코드 작성 - action 테스트 코드 작성 - action 코드 작성 - reducer..

TIL - 20220603

오늘은 코드숨 과제를 진행하며 생겼던 헷갈리는 부분들을 윤석님과 함께 시원하게 해소하는 시간을 가졌다. 먼저, 테스트 대상을 어떻게 정하느냐에 대한 부분이다. 예를 들어, reducer를 테스트한다고 가정하자. BDD를 사용한다면 테스트 대상은 당연히 reducer가 될 것이다. 그다음 reducer로 처리할 액션들을 테스트 대상으로 규정해야 할지 아니면 크게 reducer만 테스트 대상으로 보고 액션들은 reducer의 행동으로 볼 것인지 이 부분이 헷갈리는 점이었는데, 내가 내린 결론은 보는 사람의 관점에 따라 달라지며, 나는 전자를 선택했다. 전자를 선택한 이유는 테스트를 진행할 액션이 한두 가지가 아닌 여러 가지기 때문에 전체 reducer의 행동으로 보며 작성한 테스트 코드보다 액션들을 테스트 ..

TIL - 20220602

오늘은 코드숨 과제 리뷰와 함께 기존에 작성한 코드를 수정하는 시간을 가졌다. 기억에 남는 리뷰 중 다음과 같은 리뷰를 받았는데, 리뷰를 보자마자 바로 아!가 입에서 나왔다. 처음 코드를 작성할 때 category 버튼을 클릭하면 changeCategoryId를 호출하면서 (V)표시가 추가되기 때문에 아무 문제가 없다고 생각하며 위와 같은 테스트 코드를 작성했는데, 사실 " 'category' 버튼을 클릭하면 '(V)' 표시가 추가된다"라는 텍스트에서는 해당 테스트에서 fireEvent.click과 같은 클릭 이벤트에 대한 내용을 다루는 코드가 없었다. 그래서 올바른 테스트 코드를 작성한다면 테스트 설명을 바꾸지 않은 채로 fireEvent.click과 같은 클릭 이벤트를 추가하거나 테스트 설명을 '"c..

TIL - 20220601

어제 작성한 Commit 메시지에 다음과 같은 피드백을 받았다. 테스트 코드를 추가하는 Commit 메시지를 작성하면서 어차피 소스 코드 보면 알 수 있으니까 테스트 코드를 추가했다는 정도만 작성하면 되겠지라는 막연한 생각을 갖고 있었는데, 생각해보면 테스트 코드 또한 어떤 것을 테스트하고 싶은지 그 이유를 명확하게 적어놔야 협업할 때 테스트 코드를 작성한 이유에 대해 물어보지 않을 것이니까 앞으로 테스트 코드도 왜 이러한 테스트 코드를 적었는지 의도를 좀 더 생각하고 자세히 적는 습관을 가져야겠다. 그리고 Commit 메시지를 작성하다 내가 지금 잘못 작성하고 있는 거 같은데라고 느낀 지점이 있다. https://jason-api.tistory.com/89 를 참고하여 Commit 메시지 제목을 작성할..

TIL - 20220531

Git과 Github를 더욱더 능숙하게 다루기 위해 Commit log를 규칙에 맞게 작성해보고자 다음과 같이 작성했고 오늘 다음과 같은 리뷰를 받게 되었다. 먼저, 리뷰를 받고 나서 또 하나 배워갈 수 있는 요소를 얻어서 그런지 기분이 좋았다! 그래서 Commit log를 공부하기 위해 https://github.com/CodeSoom/git-training에서 https://djkeh.github.io/articles/How-to-write-a-git-commit-message-kor/ 와 https://jason-api.tistory.com/89를 참조하며 작성했다. 이전에는 commit 메시지를 작성할 때 그냥 내가 뭘 했는지 간략하게 적는 것이라고 생각했는데, Commit log를 공부하면서 내..