Today I did
- 프로젝트 설정 - 필요한 기술 세팅
- 컴포넌트 및 데이터 흐름 구상
- route 지정
- 공통 컴포넌트 구현
간단 기록
스택 선택
react / typescript / redux-toolkit / styled-components
일단 react와 ts는 필수여서 선택의 여지가 없었지만, ts로 구현하기는 처음이라 열심히 구글링하면서 진행했다. ㅠㅠ 부딪혀보면서 배우는거지 뭐~ 🤣
상태 관리 라이브러리로 redux-toolkit을 선택한 이유는 redux를 훨씬 간편하게 쓸 수 있다는 장점 때문이다. (참고한 글) 멘토링 때 redux-toolkit의 존재를 알게되었고, redux vs redux-toolkit vs recoil 중에 고민했지만 recoil을 쓰기엔 또 새롭게 배워야하고 redux를 쓰기엔 redux-toolkit의 메소드들이 훨씬 간편하게 사용할 수 있다는 장점으로 선택했다.
스타일링 라이브러리로 styled-components를 선택한 이유는 시간이 촉박하기 때문에 익숙하게 사용할 수 있는 걸 선택했다. 나중에 여유가 되면 stetches로 적용해볼 생각이 있다. ㅎㅎ
컴포넌트 및 데이터 흐름 구상
시간은 촉박하지만 컴포넌트 구상이나 데이터 흐름을 그려보는 것이 중요하다고 생각하기 때문에 시간을 들여서 그려봤다. 공통으로 쓸 수 있는 컴포넌트가 눈에 들어왔고, 데이터 흐름에 따라 상태를 어떻게 설정해야 할지 알 수 있었다.
그리고 repo에 todolist와 issue들을 생성해서 개발 일정을 잡았다.
route 지정
react-router-dom이 작년 말에 v6로 업데이트한 걸로 기억하는데 그때 진행하고 있었던 프로젝트가 있어서 열심히 공식 문서를 훑었던 게 기억이나 경로 설정은 금방 끝낼 수 있었다.
공통 컴포넌트 구현
하.. 여기는 정말 할 말이 많은데 따로 포스팅을 할 예정 ㅠㅠ
react에서 ts로 배열을 mapping하는 것이 이렇게도 어려울 줄이야.. 열심히 구글링하고 지인에게 sos도 쳐보고 어찌저찌 해결은 했는데, 이건 무조건 단독 포스팅각이다.. 😂
Tomorrow To Do
- 리스트 기능 구현
- 카테고리 기능 구현
- 링크
