はじめに
フロントエンド開発ではAPIは切っても切り離せないツールの一つです。APIを利用することで開発効率が上がったりパフォーマンスを向上させることで時間の節約が期待できます。
現在では数多くのAPIが世に出回っていますが、今回はこのAPIにおいて筆者がより重要だと感じているAPIを5つ紹介します。
知っておくべきAPI 5選
Fake Store API
Fake Store APIはECサイトの作成などのプロトタイプを作成する際に利用する機会が多いAPIとなります。
サーバ側のコストを気にすることなく、ダミーのショップデータをフロントエンド側に返してくれます。
ログインやカート、ユーザ情報や製品情報が主な返却してくれる情報となります。
JSONPlaceholder
JSONPlaceholder APIはRESTで実装されたダミーデータを返してくれるAPIです。RESTサービスの作成などで実際のREST APIサーバがまだ稼働していない場合など、GET/POSTなどの処理テストで利用するケースが多いかと思います。
以下のような階層構造が用意されていますので利用の際はその構造でのみ利用可能です。
/users
└/posts
│ └/comments
└/albums
│ └/photos
└/todos
Coingecko
Coingeckoは仮想通貨の情報を取得するAPIとなります。
自動売買アプリを作成する場合や自身のポートフォリオをAPIを通じて提供するために利用するなど、仮想通貨に関するアプリを作成する場合は必ず利用しておいた方が良いでしょう。
実際にpythonを利用してビットコインやイーサリウムの価格を取得するサンプルです。かなりシンプルです！
import requests
import json
url = "https://api.coingecko.com/api/v3/simple/price"
params = {"ids":"bitcoin,ethereum","vs_currencies":"jpy,usd"}
response = requests.request("GET", url, params=params)
r = response.json()
print(json.dumps(r, indent=2))
Random User Generator
Random User Generator APIはダミーのユーザ情報をJSON形式で提供してくれるAPIとなります。
実際リリース時のデータは本番の個人データを利用しますが、テスト段階などでユーザ情報が欲しい場合など、利用用途は多岐に渡ります。
以下のように利用するだけで、簡単にダミーユーザを作成することができます。
$.ajax({
url: 'http://api.randomuser.me/',
dataType: 'json',
success: function(data) {
$("img").attr("src",data.results[0].user.picture.medium);
}
});
Unsplash API
Unsplash APIは60万以上のライセンス無料かつ高品質、高解像度の写真データを無料で利用可能なAPIとなります。
画像検索アプリやデザインテンプレートに利用する画像を提供するようなアプリケーションを作成する際にはとても役立つAPIと言えます。
セットアップ方法は省きますが、以下のようにすることで、画像データを取得することができます
ttps://api.unsplash.com/search/photos?query=検索ワード&client_id=アクセスキー
最後に
フロントエンジニアは時間が勝負な場合が多々あります。
APIを駆使すれば時短効果が望めるため是非使えるAPIを増やしておいた方が良いかと思います。
