Axios란?

1. Axios

ⅰ. Axios

• Axios는 JavaScript에서 HTTP통신을 위한 라이브러리
• Promise기반으로 작동하여 비동기 처리를 쉽게 할 수 있음
• Axios를 사용하면 서버로 HTTP 요청을 보내고 응답을 받는 것이 간단해짐

ⅱ. Axios의 장점

• Promise 기반
  Axios는 Promise를 반환함. 이를 통해 비동기적인 동작을 쉽게처리할 수 있음
• 요청과 응답을 반환
  사용자가 요청을 보내기 전이나 응답을 받은 후에 데이터를 변환할 수 있음
• HTTP 요청 취소 가능
  Axios는 HTTP 요청을 취소하는 기능을 제공함
• HTTP 요청 재시도
  네트워크 이슈나 서버의 일시적인 문제로 요청이 실패한 경우 자동으로 재시도하는 기능을 제공함

ⅲ. Axios설치 및 기본 사용 예제

• Axios 설치 방법

npm install axios
yarn add axios

• 아래와 같이 import 하여 사용할 수 있음

import axios from "axios";

• Axios는 다양한 HTTP 메서드(GET, POST, PUT, DELETE 등)를 사용할 수 있음

// GET 요청
axios.get('https://api.example.com/items')
  .then(function (response) {
    // 성공 시 데이터를 화면에 출력
    console.log(response.data);
  })
  .catch(function (error) {
    // 실패 시 에러 메시지 출력
    console.log(error);
  });

// POST 요청
axios.post('https://api.example.com/items', {
    name: 'New Item',
    description: 'This is a new item.'
  })
  .then(function (response) {
    console.log(response.data);
  })
  .catch(function (error) {
    console.log(error);
  });

// PUT 요청
axios.put('https://api.example.com/items/1', {
    name: 'Updated Item',
    description: 'This is an updated item.'
  })
  .then(function (response) {
    console.log(response.data);
  })
  .catch(function (error) {
    console.log(error);
  });

// DELETE 요청
axios.delete('https://api.example.com/items/1')
  .then(function (response) {
    console.log(response.data);
  })
  .catch(function (error) {
    console.log(error);
  });

 

ⅳ. Axios 응답 처리

• Axios의 요청은 Promise를 반환하므로 .then()을 사용하여 응답을 처리하고, .catch()를 사용하여 오류를 처리할 수 있음

axios.get('/user?ID=12345')
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

ⅴ. Axios 고급 기능

• 요청 취소
  Axios는 요청을 취소하는 방법을 제공하는데 이를 위해서는 CancelToken 소스를 생성하고 이를 요청 설정에 전달해야함
• 요청 및 응답 인터셉터
  Axios는 요청이나 응답을 가로채는 데 사용할 수 있는 인터셉터를 제공함
  이를 사용하려면 요청이나 응답을 전달하기 전에 필요한 동작을 추가할 수 있ㅇ므
• 요청 재시도
  Axios에서 제공하는 요청 재시도 기능을 사용하여 일시적인 네트워크 문제로 인한 요청 실패를 해결할 수 있음

주특기 주차를 마무리하면서 다른분들과 로그인 기능 구현을 해보았는데 처음으로 서버의 데이터를 받아왔더니 정말 어려웠던거 같다.
다시 한번 심화주차 강의를 다시 들어보고 정확하게 파악을 해야지 마지막 실전에 가서 잘 사용할 수 있을거 같다는 생각이 들었다.
주특기 주차가 끝나고 주특기 프로젝트가 시작이 되었는데 우리조는 프론트가 나 혼자배정이 되었는데 내가 모든걸 만들어 보니깐 실력이 많이 늘거라고 생각하면서 문제를 해결해 가야겠다!!!!
그리고 최대한 열심히 빠르게 하고 나서 하루에 하나씩 블로그 쓸수 있게 시간을 만들어 보아야겠다ㅠㅠ