📝 WIL: 지난 일주일의 회고
1. FACTS (사실, 객관)
- 이번 주는 프로젝트에서 주소 관리 페이지 구현에 집중했습니다.
- REST API를 활용하여 주소 목록을 불러오고, 동적으로 렌더링하는 기능을 개발.
- 메인 주소 설정 및 취소, 주소 수정 및 삭제를 포함한 CRUD 기능 구현.
- 사용자 인증을 위해
Bearer Token을localStorage에서 읽어 API 요청 헤더에 포함.
- 개발 과정에서 Pico.css와 Fetch API를 사용하여 UI와 비동기 통신을 처리.
- 주요 작업 외에도 코드의 재사용성과 유지보수를 고려하여 로직을 정리하고 리팩토링 진행.
2. FEELINGS (느낌, 주관)
- 처음에는 REST API와 비동기 요청을 다루는 데 익숙하지 않아 어려움이 있었지만, 점차 흐름을 이해하면서 자신감을 얻음.
- 특정 작업(예: 메인 주소 취소 이벤트 처리)이 복잡하게 느껴졌고, 중간에 막힐 때 답답함을 느낌.
- 작업을 완료하고 페이지가 정상적으로 작동하는 모습을 확인했을 때 큰 성취감을 느낌.
3. FINDINGS (배운 것)
- Fetch API와 비동기 처리:
async/await문법과 함께 Fetch API를 사용하는 방법을 학습.- HTTP 응답 상태를 처리하고, 오류 상황에 적절히 대응하는 로직의 중요성을 깨달음.
- 동적 UI 생성:
- 데이터를 기반으로 DOM 요소를 동적으로 생성하고, 이벤트 리스너를 추가하는 기술을 익힘.
- 코드 구조화:
- 반복되는 코드(예: API 호출 로직)를 별도의 함수로 분리하여 재사용성을 높이는 것이 효과적이라는 점을 인식.
- 사용자 경험:
- 오류 메시지나 로딩 상태를 적절히 표시하는 것이 사용자 신뢰를 높이는 데 필수적임을 배움.
4. FUTURE (미래)
- 비동기 처리 능력 향상:
- 더 복잡한 비동기 로직이나 병렬 처리 상황을 학습하여 다양한 상황에 대비할 계획.
- UX 개선:
- 버튼 클릭 시 로딩 애니메이션 추가 및 중복 요청 방지를 구현하여 더 나은 사용자 경험 제공.
- 리팩토링 및 테스트 강화:
- 코드의 재사용성을 더욱 높이고, Jest 같은 테스트 도구를 사용해 코드의 신뢰성을 확보할 계획.
- 프로젝트 문서화:
- 작업한 내용과 API 통신 구조를 정리하여 팀원들이 쉽게 이해할 수 있는 문서를 작성할 예정.
지난 일주일은 REST API와 비동기 처리, 그리고 사용자 인터페이스 개선에 있어 많은 것을 배우고 경험한 시간이었다. 이러한 배움을 바탕으로 더 효율적이고 사용자 친화적인 기능을 개발할 수 있도록 노력할 것이다.
Node.js 7기