REST APIって何？簡単なReact/Node.jsアプリで作って理解する・その1


初記事なので、至らぬところがあるかと思いますが、その際はぜひコメントくださいませ。

未経験からエンジニア転職を目指して学習していく中で、個人的に一番わかりにくかったのが**REST API**です。

**React/Next.js** を学習していましたが、フロントエンドの制作は、作っているものがわかりやすく目に見えるため楽しいですよね。

一方、バックエンドは個人的に苦手だと感じる部分だったので、自分の理解を整理するため、ざっと復習したいときに役立つようにこの記事にまとめました。

# APIとは
**API（Application Programming Interface）** は、アプリケーション同士がデータをやりとりするための仕組みです。

例えば、調剤薬局の薬剤師さんのように、
- 客（フロント）が出した処方箋（リクエスト）をもとに、
- 薬棚（データベース）から薬（レスポンス）を客に返す。

これがAPIの役割です。

## なぜAPIを使うのか？

「ブラウザから直接サーバーにアクセスしてデータを取ってきればいいんじゃないの？」と思うかもしれませんが、それには**セキュリティ上のリスク** があります。

サービスのデータはもちろん、顧客情報などの機密データがあるサーバーにフロントから直接アクセスできると、不正にデータを盗まれたり改ざんされたりする危険があります。

先ほどの調剤薬局の例でも、客が勝手に薬棚から薬を取って行ったら、さまざまな問題が発生しますよね。

そのため、**ユーザーの認証** や**アクセス権限の管理** を行うためにもAPIが使用されます。

# REST APIとは
ではREST APIについてですが、REST APIは以下の**4つの原則** と**3つの特徴** を持つサーバーへのリクエスト方式です。

## RESTの原則

1. アドレスの可読性
リソースを表すURLはわかりやすく、人が読んでも理解できる形式にすること。

2. ステートレス性
各リクエストは独立しており、サーバーはクライアントの状態を保持しないこと。

3. キャッシュ可能性
レスポンスはキャッシュ可能で、クライアントはキャッシュを利用して効率的にデータを取得できること。

4. 統一インターフェース
一貫した方法でリソースにアクセスし、操作を行うこと。

## REST APIの特徴
1. リソースごとにURLを定義する
各リソース（データ）は独自のURLを持ち、それによってアクセスします。

2. メソッドでリソースへの処理を定義する
HTTPメソッド（GET、POST、PUT、DELETEなど）を使用して、リソースに対する操作を指定します。

3. JSONでデータをやりとりする
データのやりとりには主にJSONフォーマットが使用され、クライアントとサーバー間で共通の形式を持ちます。

いちいち出てくる専門用語がわかりにくいため、個人的には以下のように覚えました。

### リソース
「サーバーで管理されているデータそのもの」

例えば、ユーザー情報や商品情報などです。リソースは、言ってみればデータベースのテーブルにあるデータの集まりだと考えてOKです。

要するに、サーバーが持っている「何か」のことです。これをスーパーの品物に例えると、リソースは棚に並んでいる商品一つひとつのようなものです。

### URL
**「リソースにアクセスするための住所」**

各リソースはそれぞれ独自のURLを持っています。例えば、`/users`はユーザー情報、`/products`は商品情報にアクセスするためのURLです。リソースごとにURLを定義することで、どこに何のデータがあるかが明確になります。

スーパーで言うと、商品の棚の場所にあたります。「この商品は飲み物コーナーにあるよ」といった感じで、商品の場所を示す住所です。

### メソッド
**「データに対する操作の指示」**

HTTPメソッド（GET、POST、PUT、DELETEなど）を使ってリソースに対する操作を行います。例えば、ユーザー情報を取得したいときは `GET /users` 、新しいユーザーを追加したいときは `POST /users` という具合に、操作内容をリクエストで指定します。

スーパーで例えると、GETは「この商品を取って見せて」という指示、POSTは「新しい商品を棚に並べて」という感じです。

### JSON
「データのやりとりをする共通の形式」

サーバーとクライアントの間でデータをやりとりする際には、JSONというフォーマットがよく使われます。例えば、ユーザー情報を取得すると、サーバーはクライアントに対してその情報をJSON形式で返します。これは、プログラム同士が同じ言葉（形式）で会話するためのルールのようなものです。簡単に言うと、データをわかりやすく包む箱のようなものですね。

スーパーの例で言うと、商品のラベルやパッケージに相当します。商品に名前や価格が書かれているので、それを見れば中身がわかりますよね。

## なぜRESTが推奨されるのか？
RESTが広く使われている理由はいくつかあります。

- シンプルでわかりやすい
RESTはHTTPの基本機能（メソッドやURLなど）を使うため、Web開発をしている際に非常に自然で理解しやすいです。

- スケーラビリティ
RESTではサーバーとクライアントが明確に分かれているため、システム全体を大規模にしたり、メンテナンスを行ったりするのが容易です。

- 一貫性
HTTPメソッドを使用することで、誰が見ても「このAPIはこういう動きをするんだな」とすぐに理解できます。

- キャッシュが使える
REST APIはHTTPのキャッシュ機能を利用できるため、適切に設定するとパフォーマンスを向上させることが可能です。

## REST APIの具体例
例えば、REST APIをコンビニやスーパーでの品出しに例えてみましょう。

- リソース：商品（例えば、飲み物やお菓子）
- URL：商品の棚の場所のようなものです。例えば、`/drinks`は飲み物の棚、`/snacks`はお菓子の棚にアクセスするためのURLです。
- メソッド：商品の取り扱い方法です。
`GET /drinks`：飲み物の棚から商品を確認する（「どんな飲み物があるか見せて！」というリクエスト）
`POST /drinks`：新しい飲み物を棚に追加する（「新しい飲み物を追加して！」というリクエスト）
`PUT /drinks/{id}`：特定の商品を別の場所に移動したり内容を変更する（「この飲み物の場所を変えて！」や「内容を変えて！」というリクエスト）
`DELETE /drinks/{id}`：特定の商品を棚から取り除く（「この飲み物を棚から片付けて！」というリクエスト）

このように、REST APIではリソース（例えば商品）をURLで指定し、メソッドを使ってそのリソースに対する操作を行います。これがRESTの基本的な考え方です。

## まとめ
REST APIとは、サーバー上のリソースに対してURLとHTTPメソッドを使って操作するためのリクエスト方式です。これにより、クライアント（例えばブラウザ）とサーバー間でシンプルかつ一貫性のあるデータ操作が可能になります。

次回の記事では、実際にNode.jsでREST APIを作成し、簡単なReactのTodoアプリを作ってみます！