All rights reserved by Postman Inc 開発生産性大幅アップ！ Postman VS Code 拡張機能 草薙 昭彦 テクノロジーエバンジェリスト #PostmanMeetup

テクノロジーエバンジェリスト Postman 株式会社 草薙 昭彦 @postman_japan @nagix

どんなシーンで API コールの確認をしてる？ ● サーバー側の API の実装コードを書きながら「ちゃんと思った通りのレスポンスが返って いるかな〜」 ● クライアント側の API を呼び出すコードを書きながら「この API ってどんなレスポンスを返 してくるかな〜」 ● API のテストが失敗している時「どのパラメーターで呼び出した時に失敗するんだ・・？」 API をコールする時は、コードや設定ファイルの編集をしながらというシーンは多い @postman_japan

エディターが日常作業の中心 ● コードの編集だけでなく、コードレポジトリーとの連携、ターミナルからのコマンド実行、タス クの自動化など、 ● 多くの拡張機能を使ってカスタマイズや連携ができる Visual Studio Code (VS Code) はとても人気がありますね！ ● API コールのためだけに、わざわざウィンドウを切り替えたり設定を同期したりしたくない 😫 @postman_japan

VS Code で API リクエストの確認を行うには ● REST Client 拡張機能 ● Thunder Client 拡張機能 ● Postman 拡張機能 @postman_japan

VS Code で API リクエストの確認を行うには 機能拡張名 REST Client Thunder Client Postman 提供者 Huachao Mao Thunder Client Postman 無料プラン あり あり あり 有料機能 なし コラボレーション・連 携・上限撤廃ほか コラボレーション・連 携・上限撤廃ほか ビュー なし あり あり インターフェース 拡張機能のみ 拡張機能、CLI 拡張機能、CLI、デス クトップ、Web 最終更新日 2022年8月19日 2023年9月5日 2023年8月30日 @postman_japan 2023年9月6日現在

これまで VS Code の機能 Postman の機能 ● ワークスペース ● コレクション ● 環境 ● API ビルダー ● モック ● モニター ● Flows ● APIネットワーク ● セキュリティ・ガバナンス ● テキストエディタ ● コード補完 ● リファクタリング ● デバッグ ● Git 連携 ● タスクランナー ● 機能拡張 簡単なAPIチェックを 行うときは・・ コードの実装 API のテスト・管理 切り替え @postman_japan

Postman VS Code 拡張機能を使うと VS Code の機能 　 　 Postman の機能 ● API ビルダー ● モック ● モニター ● Flows ● APIネットワーク ● セキュリティ・ガバナンス ● コレクションランナー ● パフォーマンステスト ● CI/CD 連携 ● テキストエディタ ● コード補完 ● リファクタリング ● デバッグ ● Git 連携 ● タスクランナー ● 機能拡張 コードの実装＋ API のテスト API ライフサイクル管理 ● ワークスペース ● コレクション ● 環境 ● 履歴 @postman_japan

VS Code Postman 拡張機能のユニークなポイント ● Postman コレクションや環境・履歴を Postman アプリと共有できる ○ 使い慣れた Postman の UI がほぼそのまま利用できる ○ 簡単な API レスポンスの確認は VS Code のみで、開発ワークフローや API ライフ サイクルの管理は Postman アプリで、という使い分け ○ 環境や変数を使った作業の効率化 ○ チームでのコラボレーション ● かゆいところに手が届く連携 ○ cURL をペーストしてリクエストを作成 ○ リクエストから様々な言語でコードスニペットを自動生成 @postman_japan

サポートしているプロトコル 今後も増える予定！ @postman_japan

Postman VS Code 拡張機能のインストール https://marketplace.visualstudio.com/items?itemName=Postman.postman-for-vscode ● 上記マーケットプレースの Postman 拡張機能のページで「Install」 ● またはアクティビティバーの機能拡張アイコンをクリック、「 Postman」を検索して一番上の 項目を選択、「Install」 @postman_japan

Postman VS Code 拡張機能のインストール ● 2023年9月6日現在、ベータ版 ● Postman の Free、Basic、Professional プランのユーザーが利用可能 @postman_japan

HTTP ● 認証 ● クッキーの編集・表示 ● リクエスト前・リクエスト後の テストスクリプトの編集・実行 ● レスポンスの分析 ● レスポンスサンプル保存 ● History に送信履歴が残る ● コレクションの作成・閲覧・保 存 @postman_japan

WebSocket ● History に送信履歴が残る （Disconnect が必要！） ● コレクションへの保存は未対 応 @postman_japan

gRPC ● History に送信履歴が残る ● コレクションへの保存は未対 応 @postman_japan

エディタの分割が便利 HTTP リクエスト gRPC リクエスト ソースコード ターミナル コレクション ・環境・履歴 @postman_japan

ダウンロードして無料でスタート！ https://www.postman.com/downloads/ デスクトップアプリ ● Windows ● Mac ● Linux Web アプリ ● アカウント登録で同 じ機能をブラウザで も利用できる @postman_japan

ありがとうございました @postman_japan