Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
開発効率を上げるSwaggerの話
Search
ykagano
April 06, 2018
Programming
0
1.4k
開発効率を上げるSwaggerの話
WEBエンジニア勉強会#06 発表資料
ykagano
April 06, 2018
Tweet
Share
More Decks by ykagano
See All by ykagano
Copilot Agentを普段使いしてわかった、バックエンド開発で使えるTips
ykagano
1
1.5k
プレイングマネージャーになったときの話
ykagano
2
1.4k
WEBエンジニアが知っておきたい決済の仕組み
ykagano
2
3.6k
プロジェクトにおけるリーダブルコードの考え方
ykagano
2
2.1k
GWにスマートスピーカーアプリを作ってみた
ykagano
1
1.2k
Other Decks in Programming
See All in Programming
The Modern View Layer Rails Deserves: A Vision For 2025 And Beyond @ RailsConf 2025, Philadelphia, PA
marcoroth
2
690
PicoRuby on Rails
makicamel
2
140
『自分のデータだけ見せたい!』を叶える──Laravel × Casbin で複雑権限をスッキリ解きほぐす 25 分
akitotsukahara
2
660
なんとなくわかった気になるブロックテーマ入門/contents.nagoya 2025 6.28
chiilog
1
280
Result型で“失敗”を型にするPHPコードの書き方
kajitack
5
1k
おやつのお供はお決まりですか?@WWDC25 Recap -Japan-\(region).swift
shingangan
0
140
[SRE NEXT] 複雑なシステムにおけるUser Journey SLOの導入
yakenji
0
130
フロントエンドのパフォーマンスチューニング
koukimiura
5
2k
猫と暮らす Google Nest Cam生活🐈 / WebRTC with Google Nest Cam
yutailang0119
0
170
状態遷移図を書こう / Sequence Chart vs State Diagram
orgachem
PRO
2
200
AI Agent 時代のソフトウェア開発を支える AWS Cloud Development Kit (CDK)
konokenj
6
770
チームのテスト力を総合的に鍛えて品質、スピード、レジリエンスを共立させる/Testing approach that improves quality, speed, and resilience
goyoki
5
1.1k
Featured
See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.5k
The Language of Interfaces
destraynor
158
25k
Why Our Code Smells
bkeepers
PRO
337
57k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.7k
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.4k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
970
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
Embracing the Ebb and Flow
colly
86
4.8k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
YesSQL, Process and Tooling at Scale
rocio
173
14k
How STYLIGHT went responsive
nonsquared
100
5.6k
Transcript
開発効率を上げる Swaggerの話 @ykagano
1 ▪⾦融系のエンジニアです • SIerの会社 : 電⼦マネーシステムの受託開発 • 電⼦マネーの会社 : Web/スマホアプリ開発・企画
• Web系の会社 : 決済関連のWeb開発 イマココ 加賀野 祐@ykagano
開発効率を上げる Swaggerの話 1. はじめに 2. まず動かしてみる 3. Swagger YAMLを⾒る 4.
APIモックを作る 5. さいごに 2
突然ですが開発に疲れてませんか? 3
Swaggerを使うとこれだけ楽になります 4 ・REST APIの仕様を⾒るのが楽 ・REST APIの実⾏ツールを作るのが楽 ・REST APIの仕様を書くのが楽 ・REST APIのモックを作るのが楽
ということを聞いて⾊々調べたので ここで発表します 5 内容が間違っていたらあとでこっそり教えてください
開発効率を上げる Swaggerの話 1. はじめに 2. まず動かしてみる 3. Swagger YAMLを⾒る 4.
APIモックを作る 5. さいごに 6
Swagger-Editorというオンラインツールを使います 7 まず動かしてみる http://editor.swagger.io/ ※httpsは標準のサンプルがクロスドメインで動かなかった
8 左のウィンドウにyaml形式でAPIの仕様を書くと 右のウィンドウに仕様書がリアルタイムで反映されます
書き上がったら「Generate Server」から ⽣成するサーバーアプリケーションを選択します ここではサクッと動かすため「nodejs-server」を選択します 9
ダウンロードしたzipを解凍して Terminalから解凍したフォルダ内に移動します 10 サーバーが起動しました
11 http://localhost:8080/docs をブラウザで開く 仕様書が⾒える
12 APIが叩ける
元々サンプルとして⽤意されている 13 http://petstore.swagger.io/v2/pet/1 をローカルサーバーから叩いています http://petstore.swagger.io/ を開くとサンプルAPIの仕様書が⾒れます
14 ・REST APIの仕様を⾒るのが楽 ✅ ・REST APIの実⾏ツールを作るのが楽 ✅ ・REST APIの仕様を書くのが楽 ・REST
APIのモックを作るのが楽 ここまでで2つクリア
開発効率を上げる Swaggerの話 1. はじめに 2. まず動かしてみる 3. Swagger YAMLを⾒る 4.
APIモックを作る 5. さいごに 15
16 1. メタデータとサーバー情報の記述 2. エンドポイントの記述 3. モデル定義の記述 サンプルを削ったので⾒ていきます yamlにはざっくりこの3点を書きます
17 1. メタデータとサーバー情報の記述
18 2. エンドポイントの記述
19 3. モデル定義の記述
20 ほら簡単でしょ?
21 ・REST APIの仕様を⾒るのが楽 ✅ ・REST APIの実⾏ツールを作るのが楽 ✅ ・REST APIの仕様を書くのが楽 ✅
・REST APIのモックを作るのが楽 ここまでで3つクリア
開発効率を上げる Swaggerの話 1. はじめに 2. まず動かしてみる 3. Swagger YAMLを⾒る 4.
APIモックを作る 5. さいごに 22
突然ですがオンラインツールだと セキュリティに不安がありませんか? 23
当たり前ですが オフライン版もあります 24 公式 https://swagger.io/swagger-editor/ ソース https://github.com/swagger-api/swagger-editor
Editorをインストールして起動します 25 // git cloneだと重かったので、配布URLからzipでwget $ wget https://codeload.github.com/swagger-api/swagger-editor/zip/master $ unzip
master $ cd swagger-editor-master $ npm install $ npm start あとはオンラインエディタと 使い⽅は同じです
26 ホスト名を書かなければlocalhostが APIサーバーになります
27 APIを叩くと常に同じレスポンスが返ります
28 レスポンスを変えるには yamlでexampleを指定するか seviceフォルダのjsを直接編集します
29 ・REST APIの仕様を⾒るのが楽 ✅ ・REST APIの実⾏ツールを作るのが楽 ✅ ・REST APIの仕様を書くのが楽 ✅
・REST APIのモックを作るのが楽 ✅ これで全部クリア
開発効率を上げる Swaggerの話 1. はじめに 2. まず動かしてみる 3. Swagger YAMLを⾒る 4.
APIモックを作る 5. さいごに 30
今⽇の話はあくまで基本的な使い⽅です REST APIのソースコードにアノテーションを記述して ・ソース=ドキュメント ・ソース=実⾏ツール にしたりもできる(らしい それでは 31
32