Postmanを使ったAPIリクエストとモックAPIの基本操作

## 目次
- [はじめに](#はじめに)
- [Postmanについて](#postmanについて)
  - [概要](#概要)
  - [主な特徴と用途](#主な特徴と用途)
- [Postman の基本的な使い方](#postman-の基本的な使い方)
  - [アカウント登録とサインイン](#アカウント登録とサインイン)
  - [Web 版 Postman の基本画面と操作](#web-版-postman-の基本画面と操作)
- [Postmanを使った操作例](#postmanを使った操作例)
  - [APIへのリクエスト送信](#apiへのリクエスト送信)
  - [モックAPIの作成と利用](#モック-api-の作成と利用)
- [Postmanの機能紹介](#postmanの機能紹介)
  - [テスト・コレクションなど業務向けの活用方法](#テスト・コレクションなど業務向けの活用方法)
- [まとめ](#まとめ)

## はじめに

こんにちは！TechoesのCです。

今回は、**API リクエストのテストやモック API の作成ができる便利なツール「Postman」** を使って、基本的な機能を実際に体験してみました。

Postman は、フロントエンドとバックエンドの開発において以下のような場面で活躍するツールです：

- API の動作確認やテストを行いたいとき
- バックエンドが未完成の段階でもフロント側を開発したいとき
- モック API を利用して仕様共有をしたいとき

本記事では、初心者でも始めやすい **Web版 Postman** を使用し、簡単な操作例をもとに API リクエストやモックエンドポイントの体験を紹介していきます。

## Postmanについて
### 概要

Postman は、API のリクエスト送信やレスポンス確認、仕様の共有、モックAPIの作成などを行うことができる **API 開発支援ツール** です。  
Web版・デスクトップ版のどちらでも利用可能で、エンジニアだけでなく、API を扱うあらゆる職種の人にとって便利なサービスです。

GUI ベースで操作できるため、**コードを書かずにAPIの送受信テストを行える**のが大きな特徴で、特に初学者にとって理解しやすい設計になっています。

この記事では、Postman の中でも以下のような **基本機能**を中心に紹介していきます：

- 既存の API への GET / POST リクエストの送信  
- モック API（仮想のAPIエンドポイント）の作成  
- リクエストの保存・共有などチーム開発向けの機能の簡易体験  

これらの機能は、**実際にバックエンドが未完成の段階でもフロントエンドの開発・確認を進められる**など、業務や個人開発でも有用な場面が多く存在します。


### 主な特徴と用途
Postman は単なる API クライアントではなく、**API 開発・管理のための包括的なプラットフォーム**です。以下のような特徴と用途があります。

#### **主な特徴**

- **直感的なGUI操作**  
  プログラムを書かずに、画面上でリクエストのパラメータやヘッダー、ボディなどを設定できるため、非エンジニアでも扱いやすいです。

- **複数メソッドに対応したHTTPリクエスト送信**  
  `GET` / `POST` / `PUT` / `DELETE` などのリクエストが簡単に試せます

- **モックサーバー機能**  
  実際のサーバーが未完成でも、想定されるレスポンスを作成し、クライアント側からテスト可能です

- **リクエストの保存・共有**  
  テストしたリクエストは「コレクション」として保存・共有でき、チームでの開発効率も向上します

- **スクリプトによるテストの自動化**  
  JavaScript ベースのスクリプトを使用して、ステータスコードやレスポンス内容の検証ができます

#### **主な用途**

| 用途 | 説明 |
|------|------|
| API テスト | バックエンドの API が期待通りに動作するか、送信・取得を試して確認できる |
| モックAPIの活用 | フロントエンドの開発を先に進めるために、仮想 API を作成して使用できる |
| チーム共有 | テスト済みのAPI定義をチーム内で共有し、認識のズレを防ぐ |
| ドキュメント自動生成 | API 定義をもとに自動でドキュメントを生成でき、クライアントや他部署との連携がスムーズになる |

Postman は個人開発からチーム開発、学習用まで幅広く活用されており、API を扱う場面では非常に強力なツールです。

## Postman の基本的な使い方

Postman は、API 開発・テストを効率よく行える強力なツールです。今回は Web 版を利用しながら、基本的な使い方を実際に体験してみます。

### アカウント登録とサインイン

Postman を利用するには、まず公式サイト（[https://www.postman.com/](https://www.postman.com/)）にアクセスし、アカウントを作成またはサインインする必要があります。  

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/cf03af7d-ccd9-4aca-88bd-dbcc6d54034d.png)

Google アカウントや GitHub アカウントを使って簡単に登録できるのも便利な点です。

登録が完了すると、そのままブラウザ上で Postman を使い始めることができます（デスクトップ版もありますが、今回は Web 版を使用）。  
※現時点では、Postman の UI は英語のみ対応です。

### Web版Postmanの基本画面と操作

ログイン後に表示されるのが、PostmanのWeb版のホーム画面です。  
左側にはナビゲーションメニュー、中央にはワークスペースの情報やよく使う機能への導線が配置されています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/cd86229c-71bb-4561-b24c-7c61612100b7.png)


主な構成は以下の通りです（※ 現時点では英語のみ対応）：

- **左サイドバー**  
  - `Workspaces`：自分用またはチーム用の作業空間を管理できます
  - `Private API Network` や `Reports` など、チームコラボレーションに関する機能が並びます

- **中央エリア**  
  - 自分のワークスペースや、直近で使用した項目が一覧で表示されます。 
  - テンプレートからすぐに作業を始めることも可能です

- **右上メニュー**  
  - ユーザーアイコン、通知ベル、設定アイコンなどが並び、アカウント情報の確認や言語・テーマの切り替えなどが可能です

この画面から、「新しいリクエストの作成」や「モックサーバーの立ち上げ」など、さまざまな操作へアクセスできます。  

操作に迷った場合は、左下の `Learning Center` などのリンクからチュートリアルに進むのもおすすめです。

以上のように、アカウント登録から基本画面までを確認しました。 

次のセクションでは、実際に API へリクエストを送信し、操作を進めていきます。


## Postmanを使った操作例

まずは、**APIリクエストを送信するための準備**として、操作画面に移動してみましょう。

Postman Web版では、APIのリクエスト作成やテストは、**Workspace**と呼ばれるエリア内で行います。

ログイン後のトップ画面から、`Workspaces > All Workspaces` を選択し、作成済みのワークスペースを選ぶことで操作画面に入ることができます。

![屏幕截图 2025-06-01 224252.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/be560890-636d-4d06-ab83-b58d4999a322.png)

ここでは、これまでに作成したワークスペースが一覧で表示されます。  
新しく作成する場合は、画面右上の **「Create Workspace」** をクリックしてワークスペースを作成できます。

### APIへのリクエスト送信

Postman を使って API にリクエストを送信するには、まず **ワークスペース** を作成して作業環境を整える必要があります。

#### ワークスペースの作成手順

1. Postman の上部メニューから `Workspaces` を選択し、ワークスペース一覧画面に移動します
2. ワークスペース一覧画面の右上にある `Create Workspace` をクリックします
3. 表示されるテンプレート一覧（ワークスペースの種類を選ぶ画面）から `Blank workspace` を選択し、右下の `Next` をクリックします  
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/2110a803-ccb6-4be3-aa3c-208cceccbd42.png)
4. 続いて表示される詳細設定画面で、ワークスペース名（例：`apitest`）を入力し、ワークスペースのタイプ（`Internal`）とアクセス範囲を選んで、`Create` をクリックすると作成完了です
![屏幕截图 2025-06-01 234645.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/ddcde725-e814-4365-8daf-3487cb239189.png)

このようにして作成されたワークスペースは一覧画面に表示され、以後の作業はこのワークスペース内で進めていくことになります。

#### リクエスト作成画面への移動

ワークスペースの作成が完了すると、次のような画面が表示されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/6fe24777-4d21-4d3e-9559-eb4fc5d6e5f6.png)

ここから実際に API リクエストを作成するには、以下のように操作を進めます。

1. 左側メニューの **Collections** タブを確認し、「Create a collection for your requests」と書かれた部分の下にある `Create Collection` ボタンをクリックします  
2. コレクション作成ウィンドウが表示されるので、名前（例：`sample collection`）を入力します 
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/d2a1f2bd-b998-4a39-9706-51f2c74dd29b.png)
 
3. コレクションの中にリクエストを追加することで、GET/POST などの API 操作を試せるようになります

#### 新規リクエストの作成と送信

ここでは、先ほど作成したコレクションに対して `GET` リクエストを作成し、API にアクセスしてレスポンスを確認する一連の流れを紹介します。

今回は、学習用に公開されているダミー API サービス [JSONPlaceholder](https://jsonplaceholder.typicode.com/) を利用して、`GET` リクエストを試してみます。

このサービスは、テストやデモの目的で使われる仮想の REST API を提供しており、実在のデータではなく、あらかじめ用意されたデータに対してリクエストを送ることで、API の動作確認を行うことができます。

##### リクエスト作成手順

1. 画面左上の `New` ボタンをクリックし、表示される一覧から **HTTP** を選択します  
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/047ea131-9f16-4d64-bad0-1d0eeae9730d.png)

2. 新しいタブが開くので、以下の内容を設定します：

   - 左側のプルダウンで `GET` を選択
   - 入力欄に以下の URL を入力：  
     ```
     https://jsonplaceholder.typicode.com/posts/1
     ```

3. 入力後、右側にある `Send` ボタンをクリックします
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/e609e3eb-3726-4a93-bd16-db75ad858147.png)

4. レスポンスの確認
リクエストが成功すると、画面下部にレスポンス情報が表示されます。このエンドポイント `https://jsonplaceholder.typicode.com/posts/1` は、「ID=1 の投稿データ」を取得するサンプル API であり、以下のような JSON 形式のデータが返ってきます：
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/e2d920a4-c8e6-4917-9b0a-1cea2adc363c.png)

このようにして、API がどのようなデータを返すかを簡単に確認することができます。

今回は GET リクエストを使いましたが、Postman では POST、PUT、DELETE など他の HTTP メソッドも選択可能です。

次のセクションでは、簡単な モック API の作成方法 を試しながら、Postman の活用範囲をさらに広げていきます。

### モック API の作成と利用

Postman では、バックエンドの開発がまだ進んでいない段階でも、**モック API（Mock API）** を作成することで、フロントエンドの動作確認やチーム開発を効率的に進めることができます。

ここでは、実際に Postman 上でモック API を作成し、それを使ってリクエストの送信を体験してみます。

初期状態では、モックサーバー関連のメニューが **サイドバーに表示されていない** 場合があります。 

その場合は、画面左下の `Configure workspace sidebar` をクリックし、  
設定パネル内で `Mock servers` のスイッチを有効化してください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/4f0686ca-08ff-4d36-9dbd-944bdd70dcc4.png)


#### モックサーバーの作成手順

1. サイドバーに表示された `Mock servers` を選択し、画面中央の `Create mock server` をクリックします
2. 表示された作成画面で、以下の内容を設定します
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/4d2ffad1-ce9d-4769-b86a-b40422afbeb9.png)

   - `Create a new collection` を選択  
     → 新しいコレクションとしてモック API を作成する

   - **Mock server name**（例: `sample-mock`）

    - **Collection**: 新しく作成するモック API の保存先コレクションを選択（※後から `Collections` 画面で名称や内容を編集できます）

   - **Environment**: `No Environment`（そのままでOK）

   - **Simulate a fixed network delay**: `No delay`（そのままでOK）

   - その他オプション（任意）:
     - `Make mock server private`
     - `Save the mock server URL as a new environment variable`

3. 入力が完了したら、右下の `Create Mock Server` をクリックして作成完了です

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/49165cfe-49b5-49f5-a170-e569c87236ea.png)

これでモック API をホストするための仮想サーバーが作成されました。  

#### モック API の作成

> テ先ほど作成したモックサーバーとコレクションの名称を「mock api test」に変更しました。これにより、サービス名や表示も自動的に反映されます。

モックサーバーを作成しただけでは、まだ具体的な API エンドポイントは存在しません。  
ここでは、実際に API リクエストとレスポンスの内容を定義し、簡単なエンドポイントを完成させます。


##### リクエストとレスポンスの定義手順

1. 左側メニューの **Collections** から、先ほど作成した「mock api test」を展開し、対象のリクエスト（例：`mock Request`）の **右側にある「…（三点リーダー）」をクリックし、「Add Request」** を選択します

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/5f31db3a-27ed-42e5-aea7-9e4ba5f30172.png)
2. 表示された編集画面で、以下の内容を入力して API を定義します：
   - **Request Method**：`GET`（今回は GET を例にします）  
   - **Request URL**：`/test001`（任意のパス名）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/a75b0995-d060-428f-98e0-a2ab687e4be2.png)

   > ⚠️注意：上部の「Request URL」はあくまで **リクエストパスの定義用** です。  
実際の返却内容（レスポンス）は、画面下部の `Body` に JSON を記述して指定してください
   
   - **Response Body**（画面下部の `Body` エリアに JSON を入力）：
     ```json
     {
       "id": 1,
       "title": "Hello from mock",
       "content": "This is a mock response, mock test ok"
     }
     ```

   - **Status Code**：画面下部の `Status Code` 欄に `200` を入力

3. 必要に応じて Headers や Delay（レスポンスの遅延）なども設定可能です

4. 右上の `Save` ボタンをクリックして保存します

これで、API のエンドポイント（例：  
`https://xxxxxxxx.mock.pstmn.io/test001`）が定義されました。  
この URL は、モックサーバー画面右上の「Copy URL」から取得可能です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/bb11237b-4fa6-44fe-be5c-294b5b5e3305.png)

ブラウザや Postman でこの URL にアクセスすると、定義した JSON レスポンスが返ってきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3565778/9f495f8e-6e4f-4aea-82e4-e382da573479.png)

作成したモック API のエンドポイントは、Postman からの確認だけでなく、  
フロントエンドや他のツールからの API リクエストとしてもそのまま利用することができます。  
これにより、UI テストや他のコンポーネントとの連携確認にも役立てることができます。

## Postmanの機能紹介

ここでは、Postman の中でも実務で特に役立つ機能をいくつか簡単に紹介します。  
詳細な操作方法までは踏み込みませんが、実際の開発やチーム作業において  
どのように活用できるかのイメージを持ってもらえればと思います。

### テスト・コレクションなど業務向けの活用方法

Postman は単なる API クライアントではなく、  
テスト自動化やチームでの共有にも対応した強力なツールです。  
以下のような用途で活用されることが多くあります：

- **コレクション機能**  
  複数の API リクエストをグループ化して保存できます。  
  コレクション単位で共有・エクスポートもできるため、チーム開発に最適です

- **テストスクリプトの記述**  
  JavaScript を使って、リクエストのレスポンスに対する自動テストを書けます。  
  たとえば「ステータスコードが200か？」「特定のキーが含まれているか？」など

- **環境変数とテンプレート**  
  複数環境（開発・検証・本番など）を切り替えながら同じコレクションを使い回すための変数定義ができます

- **モニタリングとスケジュール実行**  
  定期的に API を呼び出して結果をモニタリングしたり、  
  エラー時に通知を送る仕組みを構築することも可能です

- **チームとの連携**  
  Postman にはワークスペースやバージョン管理機能もあり、  
  複数人での API 開発・検証作業をスムーズに進められます

このように、Postman は「APIを見る・触る」以上の機能を備えており、  
業務の効率化や品質向上にもつながるツールとして活用されています。

ここまでで Postman の基本操作を一通り体験できたかと思います。最後に、本記事のまとめとしてポイントを整理しておきます。


## まとめ

今回は、Postman を使って以下のような基本操作を体験しました：

- Web版 Postman の操作画面を確認
- 既存 API に対する GET リクエストの送信
- モック API の作成と簡単なレスポンス定義

Postman は直感的に操作できる UI を備えており、初めてでも比較的スムーズに試せるツールです。  
特に API 開発やテストに関わる方にとっては、手元で簡単に挙動確認ができる強力な助けになります。