Go to Qiita Advent Calendar 2024 Top
LoginSignup
3
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

@hmiyakoshi0803

[API] VSCodeでAPI Specを書く環境を整える

Posted at

はじめに

  • API開発を行うにあたりAPI Specを作成しようと思い立つ
  • 巷にはSwagger Editorなどもあるが、WEBで作成->Export->ソース管理の手間が面倒に感じた
  • どうせならサーバーサイドプログラムと合わせて同じGitレポジトリで管理したい
  • それならば、VSCodeで一緒に開発したい（<-今ココ）

VSCode Extentionのインストール

  • Cmd + Shift + xでEXTENTIONSを開く
  • Swagger ViewerとOpenAPI (Swagger) Editorをインストールする

[Swagger Viewer]
image.png

[Swagger Editor]
スクリーンショット 2020-03-23 10.51.36.png

VSCodeでAPI Specを作成

  • Cmd + Shit + Pでコマンドパレットを開き、new openapiと入力する
  • Suggestionが出るので、OASのバージョンとフォーマット（json or yaml）を選択
    スクリーンショット 2020-03-23 10.53.18.png

Preview参照

  • Cmd + Shift + Pでコマンドパレットを開き、Preview Swaggerと入力
    image.png

  • 編集がリアルタイムに表示されるViewerが開く
    image.png

参考

3
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
3
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?