3일차 웹 프론트엔드 개인 프로젝트

Last 24 Hrs

아직도 리액트 훅 및 기본 개념에 대한 강의를 듣는 중이었다. 그러나 강의를 들을수록 미리 숙지해 둔 기능구현 목록의 기능들을 어떤 기술을 사용하여 구현할 수 있는 지 그림이 보인다는 것은 큰 수확이었다. 그러한 부분을 만날 때 마다 나는 주석으로 기록해두었다. 예를 들어, 사용자 정보를 받는 시작페이지에서 나는 useState를 사용하여 입력내용을 저장하려고 했지만, 그것은 state를 잘못 다루는 용법인 것을 깨달았다. 화면에 보이는 상태값 정보를 단순히 읽어서 저장할 때는 (특히 form 태그의 submit액션이 있을 경우) 상태값을 변경할 때 사용하는 useState가 아닌 useRef를 사용해야 한다는 것이다.

나는 이렇게 기술을 활용한 기능 구현의 퍼즐을 하나씩 맞추어가는 방식으로 개발을 진행하고 있다. 물론 남들처럼 미리 대부분의 작업을 끝내고 디버깅 / 테스트 / 보수를 하는 것이 더 유리할 수도 있지만, 이번 프로젝트의 형태를 보며 판단되기를 본 의도는 기술을 혼자 사용하고 다시 재정립하면서 나의 것으로 만드는 것이 아닌가하는 게 내 생각이다. 지금까지 한 작업은 다음과 같다.

진행 사항

• useRef를 활용한 form 태그 submit 액션 시, 사용자 정보 입력값 저장
• useContext를 활용하여 전역 distributing이 필요한 상태값 관리 및 저장, 변경
• axios 서드파티 라이브러리를 통해 공공데이터 API 통신으로 필요 데이터 받아오기 및 출력 (데이터 형태 확인)

Next 24 Hrs

이젠 또 다른 강의와 블로그를 병행하면서 참고하여 기능 구현을 차근차근 진행해야 할 차례인 것 같다. 이미 사전 준비 작업에 3일의 시간을 투자했으니, 나머지 2/3의 기간 중 1/3 + a는 기능 구현에 투자하고 남은 1/3은 디버깅 및 리펙토링 작업에 할애할 계획을 가지고 있다. 계획은 언제나 유동적으로 변할 수 있으니, 매일 아침 지난 날 해놓은 작업을 복기하고 앞을로 할 수 있는 가능한 작업을 추려 실행에 옮기는 식으로 flexible하게 가져가고 싶다.

느낀점

이번 개인프로젝트 덕에 리액트의 기본 개념과 기술에 대해 더 상세한 학습을 할 수 있어서 좋았다. 이제 학습의 성과를 개발 과정에 녹여내는 일만 남았다.