React+フリー素材の検索API

Unsplash Developers

美しい無料画像と写真の数々 | Unsplash

PascalCase

SCREAMING_SNAKE_CASE

axiosのインストール

npm install axios

上記でエラーが出る場合は下記のコードを入力する

npm install axios --save --legacy-peer-deps

API情報

Unsplash API Documentation | Free HD Photo API | Unsplash

const getPhotoData = (e: React.FormEvent<HTMLInputElement>) => {
  e.preventDefault();
  axios
  .get('')
  .then(res => console.log(res))
}

配列の中のデータを分解する

.map((singledata,index) => )

バックティック：文字列の中で変数を扱うことができます．

get(`https:api.unsplash.com/search/photos?query=${word}`

環境変数の呼び出し

${process.env.REACT_UNSPLASH_API_KEY}