본문 바로가기

전체 글

(325)
20201028 T.I.L -과제 보수를 완성시켰다. 오전에 일찍 작업을 마치고 리뷰받은 내용도 수정했다. 근데 마지막에 문제가 생겼다. url로 바로 쳐서 페이지 경로를 이동시키면 제대로 작동이 안 되는 것이다. 예를 들어 url.../restaurants로 들어가는 것은 문제가 없지만 url.../restaurants/1로 들어가는 것은 url.../restaurants/main.js 이런 식으로 불러들여와서 문제가 생긴다. 이것을 해결해주기 위해서는 index의 스크립트 경로 앞에 '/'만 추가해주면 되지만 모듈로도 이걸 컨트롤할 수 있다는 것을 알고 오늘 하루는 모듈을 위해 투자하기로 했다. 코드 숨 첫 번째 강의에서 제시해준 모듈에 관련된 문서는 모두 읽고 (그래도 아직 심화는 이해하지 못했다.) 내 개인 포트폴리오 페이..
20201027 T.I.L -라우터를 이용해 레스토랑 정보를 조회하는 페이지를 구현하고 있다. 거의 늦은 오후가 돼서야 완성했다고 생각했는데 과제를 잘못 봐서 원래 있는 정보가 아닌 새로운 데이터를 fetch 해서 가져와야 한다는 것을 깨닫고 다시 하나둘씩 고쳐나가기 시작했다. 뜻밖의 보수 작업 시작이다. 솔직히 꼼꼼하지 못한 나를 자책하고 싶은데 이번 기회에 리팩터링을 연습하는 것이라고 생각하고 열심히 해나가야겠다. ㅜㅜ 얼마 안 남았으니까 내일 오전 중으로 금방 마쳐야겠다!
20201026 T.I.L - 새로운 과제와 함께 리액트 라우터에 대해 배우기 시작했다. 과제는 항상 마지막으로 갈수록 어려운 법이라 지금 처음이 비교적 수월 한 건지 내가 TDD에 조금 익숙해진 건지 강의 영상을 보고 연습도 TDD로 하기 시작했다. 강의가 처음부터 리액트 라우터로 진행하는 것이 아닌 라우터를 사용하지 않고 href를 이용한 코드를 다 작성한 후 리액트 라우터로 리팩터링 하면서 진행해 나가는 과정이었는데 초반 강의에서는 테스트 코드를 작성하지 않고 넘어가는 부분이 있어 이 부분도 욕심이 나 연습할 때 내가 테스트 코드를 넣어서 적용시켜보고 싶어 졌다. 욕심을 부려 진행해 나가다가 window의 location객체를 모킹하고 테스트하는 부분에서 콱 브레이크가 걸렸다. 일단 첫째로 어떻게 window를 모킹 하는지 ..
20201024 코드숨 5주차 회고 5주 차 주간 회고 한 일 Redux에서의 비동기 액션을 실행하는 법 배우기 과제 1 : 레스토랑 조회 구현하기 알고리즘 문제풀이 포트폴리오 페이지 진행 중 프로젝트 디자인 시작 배운 점 redux thunk를 이용해 함수를 dispatch 하는 법을 배웠다. redux-mock-store와 redux-fetch-mock 모듈을 이용해 store와 fetch를 모킹 해 테스트하는 법을 배웠다. 테스트에서도 철저한 관심사의 분리가 이루어져야 한다는 점을 배웠다. 느낀 점 & 자기 선언 이번 주는 비동기 구현을 얹은 TDD를 연습하는 느낌의 한 주였다. 비동기 코드를 테스트하는 부분에서 또다시 삐걱댔지만 이건 내가 이 테스트에서 무엇을 검사하고 싶은지에 대한 관심사의 분리가 부족해서 더 버벅댔던 것 같다. ..
20201024 T.I.L -과제를 마무리했다. 하나씩 고치면서 느끼는 건데 진짜 리팩터링 과정이 너무 조심스럽고 어려워서 과정 건너뛰고 한 번에 하게 된다. 그래서 이번에는 진짜 하나씩 추가하는 연습을 했다. 다시 테스트 코드를 한 줄 고치고 커밋하고 해당 컴포넌트에 한 줄 고치고 커밋하고 그랬더니 다른 컴포넌트의 테스트가 깨져서 다시 한 줄 고치고 커밋하고 이런 식으로 진행했다. 사실 진행된 거에 비해 과정이 너무 오래 걸리기는 했지만 나중에 실무에서 코드를 고칠 때 이런 과정이 꼭 필요할 거라는 생각이 든다. 소홀히 하지 말고 이렇게 배우기 시작할 때 그 과정을 몸으로 익혀둬야겠다.
20201023 T.I.L 오늘 한 일 하루 종일 포트폴리오 인터렉션 만들기 와과 다음 과제의 디자인을 구상했다. html구조도 엉망진창인 게 자바스크립트 코드도 완전 뒤죽박죽이다. 일단 구현하자!라는 TDD의 geen정신을 따라서(약간의 자기 방어를 하자면 그렇다 ㅎㅎ) 배웠던 대로 진행을 쭉 해나가고 있는데 그래도 내가 많이 성장했는지 코드가 너무 더럽다. 리팩터링을 너무 하고 싶고 설계부터 다시 하고 싶다. 근데 아직은 인터렉션 디자인부터 구현을 해놓자! 해서 더듬더듬 디자인을 짜는 중이다. 점차 점차 짜다가 알고리즘 문제를 풀다가 저녁에는 윤석 님께서 구글 미트로 오픈 세션을 여셔서 참여해서 들었다. 일방적인 공부에 익숙해지는 나는 항상 내가 남들보다 모르는 게 많고 부족해서 이런 고민을 하는 것 같고 그런 생각이 많았는데..
20201022 T.I.L 오늘 한 일 드디어! 과제를 일단 완성시켰다! fetch는 테스트를 어떻게 하나 몰라서 열심히 찾아보고 jest-fetch-mock라는 좋은 모듈을 찾아서 적용시켰다. 이제 나도 조금씩 검색하고 찾아보고 모듈 사용법을 보면서 적용시킬 수 있는 능력이 조금씩 나아지는 것 같다. 과제를 완성하고 나서도 계속해서 보면서 내가 할 수 있는 한 최선으로 리팩터링을 했다. 그래도 오늘 하루는 꽤 시간이 남아서 포트폴리오를 만들면 좋을 것같아서 저번에 조금씩 시작했던 이력서 페이지를 만졌다. 인터렉티브 한 웹 구현하는 것이 한 달 반? 두 달? 이 지나니 이것도 가물가물해서 다시 강의를 빠르게 훑으며 기억을 되돌렸다. 역시 안 하면 녹스는 법! 녹슬지 않게 프로젝트를 할 때마다 꾸준히 적용시켜서 실력을 다져가야겠다.
20201021 T.I.L 오늘 한 일 비동기를 다루는 것은 어렵다. 그러나 비동기를 테스트하는 것은 더 어렵다. redux-mock-store를 사용해서 처음 테스트를 해봤는데 이걸 사용하는 것조차 쉽지 않았다. ㅜㅜㅜ 게다가 TDD로 과정을 작성해야 하기 때문에 정말 하루 종일 한 부분만 붙들고 있었다고 해도 과언이 아니었다. 다 왔다고 생각했는데 아직 갈길이 먼 과제인 거 같다. 이번 주는 계속해서 연습해서 비동기를 아주 잘근잘근 익혀주겠어. 라고 다짐한 오늘이었다.