벨로퍼트와 함께하는 모던 리액트

벨로퍼트님의 함께하는 모던 리액트 내용을 학습하며 정리한 내용입니다.

API 연동하기

웹 애플리케이션을 만들 땐 데이터를 브라우저에서만 들고 있는게 아니라,
데이터를 보존하고, 다른 사람들도 조회 할 수 있게 하려면
서버를 만들고 서버의 API 를 사용해서 데이터를 읽고, 써야 한다.

자바스크립트의 비동기처리(Promise, async/await)을 이용

1. API 연동의 기본

axios를 사용해서 GET, PUT, POST, DELETE 등의 메서드로 API 요청할 수 있다.

• GET: 데이터 조회
• POST: 데이터 등록
• PUT: 데이터 수정
• DELETE: 데이터 제거

useState 를 사용하여 요청 상태를 관리하고,
useEffect 를 사용하여 컴포넌트가 렌더링되는 시점에
요청을 시작하는 작업

요청에 대한 상태를 관리 할 때에는 다음과 같이 총 3가지 상태를 관리

• 요청의 결과
• 로딩 상태
• 에러