構成図ってどうやって作るん？？？
技術系の記事によく出てくるこういう図↓ の作り方がよくわからず、少しネットの海をさまよったので、メモ程度に残しておきます。
図の引用元
なんてツール？
diagrams.net (旧draw.io)を使って書きます。
このツールは、Web上などで↓のようなデザインを書くことができ、データはローカル上、クラウド上(Google Drive,GitHubなど)に保持することができます。
diagrams.net (旧draw.io)は、VSCodeに拡張機能があり、VSCode上でも編集することができます。
私は、「Draw.io Integration」という拡張機能を入れて、使っています。
AWS,Azureの構成図の書き方
VSCodeで書きます。
ファイルの形式を.drawioとし、ファイルを作ります。
編集画面の左下に「その他の図形」とあるのでクリックします。
ポップアップが出てくるので、AWS,Azure好きなものを選び、適用しましょう。
すると、左の図形メニューにいっぱいAWS,Azureっぽいパーツが出てくるので、これを利用して書きましょう。
画像として保存する
編集画面の左上のファイルメニューから、「Export」をすることができます。
svg,pngが選べるので、好きなもので保存しましょう。
おしまい
おしまい！構成図これで書こう！