[05.17] fetch API

• fetch API/Axios
• 회고

---

📌 fetch API/Axios

fetch API

: 특정 url로부터 정보를 받아오는 역할 → 비동기로 이루어짐

[예시]

let url =
  "https://koreanjson.com/posts/1";
fetch(url)
  .then((response) => response.json())
  .then((json) => console.log(json))
  .catch((error) => console.log(error));

Axios

: 브라우저, node.js를 위한 Promise API를 활요하는 HTTP 비동기 통신 라이브러리

⇒ 백엔드랑 프론트엔드랑 통신을 쉽게하기위해 Ajax와 더불어 사용

Fetch API vs Axios

Axios	Fetch API
써드파티 라이브러리로 설치가 필요	빌트인 API라 별도의 설치 필요 없음
자동으로 JSON 데이터 형식으로 변환	.json() 메서드를 사용

Axios 사용법

1. 설치

   : 써드 파티 라이브러리기 때문에 사용하기 위해서 설치 필요

   npm install axios

2. Get 요청

   : 요청은 일반적으로 정보를 요청하기 위해 사용되는 메서드

   • 첫번째 인자 : url 주소
   • 두번째인자(필수 x) : 요청시 사용되어지는 옵션들 설정

   axios.get("url"[,config])

3. Post 요청

   : 서버에게 데이터를 보내기 위해 사용되는 메서드

   • 첫번째 인자 : url 주소
   • 두번째인자(필수 x) : 요청시 사용되어지는 옵션들 설정

---

🙋🏻‍♀️회고

정말 비동기 너무 어렵다…

이해하려고 복습하고 유투브 강의를 찾아보아도 이해가는게 쉽지 않다..

내일부터는 리액트를 들어가는데 또 체한상태에서 소화제 먹어가면서 수업을 따라가야하는건가… 걱정이다..

선미가 부릅니다.. 24시간이 모자라..