[REACT] newsapi

newsapi 에서 제공하는 API를 통해 최신 뉴스를 불러 온 후 출력하는 예제
사전에 newsapi에서 제공하는 API키를 발급받아야한다.

 

1. 발급

https://newsapi.org/account

Login - News API

 

2. 발급받은 api를 axios를 사용하여 불러오기

import { useState } from "react";
import axios from "axios";
const App=()=>{
  const[data, setData] = useState(null);
  const onClick=()=>{
    axios
      .get('https://newsapi.org/v2/top-headlines?country=kr&apiKey=e52ce7509c584062931c0b88bfba87ee')
      .then(response=>{
        setData(response.data);
      });
  }
  return(
    <div>
      <div>
        <button onClick={onClick}>불러오기</button>
      </div>
      {data && <textarea rows={17} value={JSON.stringify(data, null, 2)} readOnly={true} />}
    </div>
  )
}

export default App;