react native

21.12.21 코인마켓캡 API 연결

슈팅스타제제 2021. 12. 28. 10:16

API documentation

https://coinmarketcap.com/api/documentation/v1/#section/Quick-Start-Guide

 

Account

 

coinmarketcap.com

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

const Prices = () => {
const [ data, setData ] = useState([])
  useEffect(() => {
    axios
      .get(
        'https://pro-api.coinmarketcap.com/v1/cryptocurrency/listings/latest',
        {
          headers: {
            'X-CMC_PRO_API_KEY': '자신의 키',
          },
        },
      )
      .then((res: any) => {
        const DataArray = JSON.parse(res.request.response).data
        setData(DataArray)
      })
  })
  return (
    <>
      <Text>{'불러온 코인 총 100개'}</Text>
      {data.map((item, index) => {
        return (
          <>
            <Text key={index}>{item.name}</Text>
            <Text>{item.quote.USD.price}</Text>
          </>
        )
      })}
    </>
  )
}

export default Prices