코드숨 리액트

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를 공부하면서 내..

TIL - 20220530

오늘은 코드숨 리액트 과정의 5주차로 비동기에 대해 공부했다. 3주차부터 시작해서 4,5주차 난이도가 점차 올라간다고 느껴져서 이동하는 버스에서 영상을 먼저 한 번 보고 공부하면서 한 번 더 보며 총 2번 반복했다. 과거부터 비동기에 대한 키워드를 공부할 때 나는 항상 동기를 동시라고 생각했다. 그러면 비동기는 동시가 아니라는 의미로 비동기는 요청을 하고 나서 응답을 동시에 받는 게 아닌 요청에 대한 응답이 올 때까지 다른 일을 수행하면서 기다린다고 생각하니까 좀 더 비동기라는 개념이 더 잘 이해돼서 오랫동안 잊지 않고 기억할 수 있었다. 비동기라는 개념을 이용하여 지금까지 Redux는 동기 처리만 했었는데 이번 주부터 비동기를 이용하여 서버의 API들을 dispatch하니깐 난이도가 더 높아졌다. 게다..

TIL - 20220529

오늘은 어제 적지 못했던 어떻게 문제를 풀 것인가를 기반으로 코딩 테스트 푸는 방법에 대해 배운 내용을 기록하려 한다. 과거 코딩 테스트(우아한 테크코스)를 준비할 때 알고리즘, 자료구조만 간단히 배우고 문제만 계속 풀었던 기억이 있다. 문제를 풀 때도, 문제가 정확히 어떠한 문제이며 어떤 답을 원하는지, 또 주어진 자료는 무엇이 있으며 이걸 어떻게 활용하며 풀어가야 할지 딱히 구체적인 방법을 생각하지 않은 채로 코드만 만들었기 때문에 역시나 광탈했다. 코드숨 커뮤니티에서 진행한 데모에서 어떻게 문제를 풀 것인가는 4단계의 과정을 갖고 있다. 1단계는 문제에 대한 이해, 2단계는 계획, 3단계는 실행, 4단계는 반성으로 이루어져 있다. 과거 나의 코딩 테스트를 준비할 때는 비율로 나누면 2 : 2 : 4..

코드숨 리액트 4주차 회고

정규 교육 과정 8주차 중 4주차, 벌써 절반이 지났다. 주차가 지날수록 난이도는 점차 올라가며 잘 따라가려면 더더욱 열심히 정진해야겠다는 생각이 들었던 한 주이다. 코드숨 리액트 4주차 Redux. React는 UI만 관리하도록 하고 상태 관리는 다른 친구가 하도록 하는 거에서부터 출발하여 Redux를 배우게 됐다! 사실 처음 배울 때는 확실히 난이도 있다고 생각했다. Redux에서 상태값은 오직 action에 의해서만 변경되어야 하며 reducer에서 이전 상태와 이 action 객체를 받아 새로운 상태를 반환해주고, Redux의 상태값은 store라는 객체에 저장된다. 여기에 더하여 action type, action creator, dispatch와 같은 용어들의 개념도 알고 있어야 하며 Redu..

TIL - 20220528

오늘은 코드숨 리액트 4주차 과제 풀이 영상을 보며 과제를 복습하는 시간을 가졌다. 마침 4주차 과제를 진행하며 고민했었던 문제의 해답이 영상에 있었다. 고민했었던 문제는 input이 여러 개일 때, 즉 예를 들어 식당의 이름, 분류, 주소를 적는 input이 있다고 할 때, input의 입력 변화를 setState로 받는 함수를 input 하나하나 만들어줘야 하나? 함수 하나만 만들어서 이 여러 개의 input을 다룰 수는 없을까?라는 문제였다. 이 문제의 해답은 input에 존재하는 name 속성을 이용하여 event를 받을 때, event 속 target 객체 안에 존재하는 name은 이 input이 어떤 input인지 알려주는 요소이고 value는 현재 입력된 값이 무엇인지 알려주는 요소임을 이용..

TIL - 20220527

내가 해냈다! 사실 누군가에겐 정말 별거 아닐 수 있는 문제인데, 거의 3~4시간 정도 매달렸음에도 불구하고 해결하지 못해 도움을 요청하려 쓴 글도 지운 다음, 결국 해냈을 때의 쾌감은 엄청난 거 같다. 그 일이 뭐였냐면... 한창 과제를 진행하다 ListContainer.test.jsx에서 다음과 같은 에러를 만났다. 이전에 있었던 과오를 되풀이 하지 않는다. 에러 문구부터 천천히 읽어보자. TypeError: Cannot read properties of undefined (reading 'map') : (내가 스스로 한 번역) undefined의 properties를 읽어올 수 없다는 것이다. 나는 restaurantCatalog가 배열이길 원한 건데 jest는 배열을 받지 못했다는 것이다. 내가 ..

TIL - 20220526

오늘도 어김없이 코드숨 리액트 4주차 첫 번째 과제에 대한 피드백과 두 번째 과제를 진행했다. 첫 번째 과제에 대한 코드 리뷰를 진행하며 다음과 같은 리뷰를 받았다. Redux를 사용하기 위한 reducer코드의 일부인데, state와 action을 받아 action의 type별로 if 조건을 이용하여 원하는 action을 dispatch하는 코드였다. 여기서, 이 action의 type을 if문 없이 작성하는 것이 리뷰이자 과제였는데, 작성하면서 어떻게 작성해야 하지 막연히 떠오르지 않아 생각을 많이 했다. 그래서, 1주차에서 진행한 과제의 코드를 참고하여 다음과 같이 만들었다. 앞서 reducer 함수처럼 이번 리듀서도 state와 action을 받고, 여기서 중요한데, action의 type을 알아..