그동안 JavaScript와 TypeScript를 공부하면서 기본 개념부터 타입 시스템까지 차근차근 정리해 왔다.
(자바스크립트 스터디 시리즈 & 타입스크립트 스터디 시리즈 보러가기)
이제는 배운 내용을 실제로 사용해 보기 위해, 작은 프로젝트를 만들어 보려고 한다.
프로젝트에서는 데이터를 불러오고, 추가하고, 수정하고, 삭제하는 기본적인 CRUD 기능들을 직접 구현해 볼 예정이다.
HTTP 통신은 fetch를 기반으로 진행하고, API 서버는 테스트용으로 많이 사용하는 reqres.in 서비스를 활용할 계획이다.
reqres.in은 프론트엔드에서 API 요청을 테스트하기 위해 만들어진 공개 API 서비스로, 로그인·CRUD·페이징 등 다양한 요청을 실제처럼 연습할 수 있다.
(우리가 실습해볼 내용은 CRUD다)
타입 정의는 지금까지 배운 TypeScript 문법을 기반으로 직접 작성해 나갈 예정이다.
개발 환경은 Vite + React를 사용할 예정이다.
이 글에서는 프로젝트를 진행하면서 마주친 문제들과 그 해결 과정, 그리고 작업 과정에서 새롭게 배운 점들을 중심으로 기록해 나갈 것이다.
퍼블리셔에서 프론트앤드로 전향하기