03-api-practice

API 통신 실습

실습 환경 설정

# 프로젝트 생성
npm create vite@latest api-practice -- --template react-ts
cd api-practice
npm install
npm run dev

사용할 API

이 실습에서는 JSONPlaceholder를 사용합니다.

• Users: https://jsonplaceholder.typicode.com/users
• Posts: https://jsonplaceholder.typicode.com/posts
• Comments: https://jsonplaceholder.typicode.com/comments

실습 문제 목록

1. UserList

사용자 목록을 API에서 가져와 표시

2. PostManager

게시글 CRUD (Create, Read, Update, Delete)

3. SearchPosts

실시간 검색 기능 (디바운싱 포함)

4. UserProfile

사용자 정보와 게시글을 함께 표시

각 컴포넌트를 src/components/ 디렉토리에 만들고, App.tsx에서 테스트하세요.