Slide 1

Slide 1 text

All rights reserved by Postman Inc AI アシスタント Postbot で API テストを効率化 草薙 昭彦 テクノロジーエバンジェリスト #PostmanMeetup

Slide 2

Slide 2 text

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

Slide 3

Slide 3 text

Postbot とは 生成 AI (Generative AI) ● 簡単に利用できる API のおかげで、ここ1年ほどの間で非常に多くの注目を集めてい る ● AI にはたくさんのユニークな使い道があり、 Postman の開発チームでもしばらくの 間、その活用方法が検討されてきた Postbot ● Postman ワークスペースにおける AI コンパニオン ● API のデバッグと理解、テストの迅速な記述、大量のデータの意味を理解する手助け をしてくれる @postman_japan

Slide 4

Slide 4 text

Postbot の主な使い方 ● Postman の使い方を聞く ● テストの生成を支援 ● コレクションのテストをまとめて生成 ● レスポンスを可視化 ● ドキュメントを生成 @postman_japan

Slide 5

Slide 5 text

Postman の使い方を聞く フッターの「Postbot」をクリック @postman_japan

Slide 6

Slide 6 text

Postman の使い方を聞く 「How to check the request size?」というプロンプトを入力してみる @postman_japan

Slide 7

Slide 7 text

テストの生成を支援 API リクエストの「テスト」タブを選択、 Postbot ボタンをクリック @postman_japan

Slide 8

Slide 8 text

テストの生成を支援 「送信」ボタンを押してレスポンスを取得 @postman_japan なぜプロンプトの前にレスポンスの取得が必要なの❓ プロンプトの文章に加えて、リクエストとレスポンスの両方 のデータを入力情報として、テストスクリプトを生成するた め

Slide 9

Slide 9 text

テストの生成を支援 「Add tests to this request」というサンプルのプロンプトをクリック @postman_japan

Slide 10

Slide 10 text

テストの生成を支援 生成されたテストスクリプトを確認 @postman_japan

Slide 11

Slide 11 text

テストの生成を支援 レスポンスの「テスト結果」タブを確認 @postman_japan

Slide 12

Slide 12 text

テストの生成を支援 プロンプトを工夫してテストを追加してみましょう @postman_japan

Slide 13

Slide 13 text

テストの生成を支援 「pm.test("<テストの説明>", 」まで入力すると、説明を元にコードを補完してくれる @postman_japan NEW

Slide 14

Slide 14 text

コレクションのテストをまとめて生成 コレクション一覧から対象のコレクションを右クリックし、「テストを生成」を選択 @postman_japan

Slide 15

Slide 15 text

コレクションのテストをまとめて生成 右上の「Generate Tests」ボタンを押すと、AI がコレクション全体のテストを一括生成 @postman_japan

Slide 16

Slide 16 text

コレクションのテストをまとめて生成 テストスクリプトとテスト結果を確認 @postman_japan

Slide 17

Slide 17 text

レスポンスを可視化 リクエストの「送信」ボタンを押してレスポンスを取得後、 「Visualize response...」というサンプルのプロンプトをクリック @postman_japan

Slide 18

Slide 18 text

レスポンスを可視化 レスポンスの「ボディ」欄の「可視化」の項目を確認 @postman_japan

Slide 19

Slide 19 text

レスポンスを可視化 「Visualize response...」に続けて「as line chart」というプロンプトを追加 @postman_japan

Slide 20

Slide 20 text

レスポンスを可視化 レスポンスの「Body」欄の「Visualize」の項目を確認 @postman_japan

Slide 21

Slide 21 text

ドキュメントを生成 リクエストを選んで、フッターの「 Postbot」をクリック @postman_japan

Slide 22

Slide 22 text

ドキュメントを生成 「Add documentation」というサンプルのプロンプトをクリック @postman_japan

Slide 23

Slide 23 text

ドキュメントを生成 右サイドバーのドキュメントアイコンをクリックして、生成された説明を確認 @postman_japan

Slide 24

Slide 24 text

日本語は使えるの? @postman_japan

Slide 25

Slide 25 text

テストの追加 (1) 「レスポンスの配列の長さが10より大きいことを確認するテストを追加」 pm.test("Response array length is greater than 10", function () { var jsonData = pm.response.json(); pm.expect(jsonData).to.be.an('array').that.has.length.above(10); }); @postman_japan

Slide 26

Slide 26 text

テストの追加 (2) 「レスポンスの配列の長さが10より大きいことを確認するテストを追加。説明は日本語で」 pm.test("レスポンスの配列の長さが10より大きいことを確認する", function () { var jsonData = pm.response.json(); pm.expect(jsonData).to.be.an('array').that.has.length.above(10); }); @postman_japan

Slide 27

Slide 27 text

グラフの表示 「結果を折れ線グラフに。最高気温と最低気温を表示。華氏を摂氏に変換。日本語で表示」 @postman_japan

Slide 28

Slide 28 text

アルバムの一覧表示 「アルバムの一覧を3列のグリッドレイアウトで可視化。表示を日本語で。アルバムアート、ト ラック名、アーティスト名、リンクを含める」 @postman_japan

Slide 29

Slide 29 text

ドキュメントの生成 「Add documentation in Japanese」 @postman_japan

Slide 30

Slide 30 text

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

Slide 31

Slide 31 text

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