React axios란? 간단 요약

axios란 인기있는 자바스크립트 라이브러리다.

 

어떨때 쓰는가 하면,

브라우저와 Node.js 환경에서 Http를 쉽게 처리할 수 있게 도와준다.

예) 게시물을 5개를 리턴하는 자바 API 호출.

 

특히 강력한 기능은, 인터셉트로 요청 및 응답의 중간에서 데이터를 처리할 수 있다.

설치는 아래와 같은 명령어로 간단하게 할 수 있다.

 

npm install axios

 

사용 예제

import React, { useState, useEffect } from 'react';
import axios from 'axios';

const ExampleComponent = () => {
  const [data, setData] = useState([]);

  useEffect(() => {
    const fetchData = async () => {
      try {
        const response = await axios.get('https://lenagend.tistory.com/rss');
        setData(response.data);
      } catch (error) {
        console.error('Error fetching data:', error);
      }
    };

    fetchData();
  }, []);

  // 컴포넌트 렌더링 로직...
};

해석

1. axios.get()을 이용해 API에서 데이터를 가져온다.

2. useEffect 훅을 사용해 컴포넌트가 마운트되는 시점에 데이터를 불러온다.

3. useState 훅을 사용하여 가저온 데이터를 저장한다.