-
Notifications
You must be signed in to change notification settings - Fork 1
12.16.금
johan edited this page Jan 25, 2023
·
1 revision
react-beautiful-dnd 라이브러리와 Trello API를 사용해 트렐로 서비스를 개선하는 프로젝트를 하다보니 자연스레 해당 기술을 사용하기 위해 영어로 된 공식 문서를 많이 읽게 되었다.
수능 공부할 때 이후로 가장 영어를 많이 읽고 있는 시기이다.
여러 에러 상황이 많았지만 하나하나 해결하면서 프로젝트가 어느정도 완성에 가까워지는 것을 시시각각 눈으로 확인할 수 있는게 즐겁다.
특히 깃허브에서 이슈, 프로젝트, 마일스톤 등 진행 과정을 정리하는 기능들을 사용하면서 내가 어느정도 진행중에 있고 앞으로 뭘 해야하는지에 대해 정리하면서 프로젝트를 진행하니까 이런 이슈들을 하나하나 해결하면서 좀 더 보람찬 개발을 하고 있다.
기록을 잘 해놓는게 정말 중요하다~
- 드래그 앤 드랍을 구현했다.
- JSON.parse(JSON.stringify()) 방식이 아닌 내장 함수 structuredClone() 함수로 깊은 복사
- 드래그 앤 드랍 상태 변경을 위해 cards 상태를 컴포넌트로 끌어올림
- data fetching 이후로 렌더링 시점을 보장하기 위해 불리언 값인 isLoading 상태를 추가
- 드래그 앤 드랍의 핵심 콜백 함수인 onDragEnd 내부 기능들을 구현
- json-server로 테스트하던 http 요청들을 모두 실제 Trello API 요청으로 수정
- react-beautiful-dnd 라이브러리를 대신 할 hello-pangea/dnd 설치
- 불필요한 json-server 삭제