9
10

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.

CFnをYAMLで快適に書く環境をVSCodeで作成する

Last updated at Posted at 2020-05-13

#はじめに

これからのクラウドエンジニアはAWSができるだけではだめで、
CloudFormation(以下CFn)を使いこなしInfrastructure as Codeを常に意識しなくてはいけないのではないか!!!
と思い立ったのでCFnをYAML形式で書き始めました。

仕事でVSCodeを使っているので(個人的に)快適な環境を構築したのでメモとして残させていただきます。
これからCFnを書き始める方々の一助になれば幸いです。

#CloudFormationってなんやねん

AWS内の構成管理をCodeで行えるという代物です。
全てをCFnで行えるわけではありませんが、多くのサービスは網羅されているようです。

同じ構成のVPCをたくさん作る必要がある
といった場合にも活躍すると思われます。

詳しくは下記を参考に...
AWS公式

#なぜYAMLで書くのか

CFnはYAML/JSON形式に対応しています。
しかし、JSON形式は{ }がかなり多くなってわかりにくいですし、
何よりもコメントアウトが残せないのがつらいです。
自分一人で書く分には問題ないのですが、
チームで書く場合や引き継ぐ場合に無駄なコストが発生するので私はYAML推しです。

#環境構築

動作環境

  • Windows10
  • 64ビット

VSCodeのインストール

公式サイトまたは下記からダウンロードできます。

VSCodeダウンロード

拡張のインストール

1.CloudFormation

VSCodeの言語モードをYAMLに変更してstratと入力するだけでCFnの骨組みをざっくりと作成してくれるという便利な拡張です。
image.png
インストールして有効化するだけでOKです。

2.cfn-lint

CFnのエラー等を教えてくれる便利ツールです。
入力ミス等はだいたいこれで撃退できます

pipを使ってインストールします。

ターミナル
pip install cfn-lint

※Pythonのインストールは下記を参考にしてください。
Pythonインストール(Win10)編

settings.jsonにフルパスを追加します。
VSCodeのトップ画面でCtrl + ,右上の**Open Settings(JSON)**を選択します。
image.png
settings.jsonに下記を追加して保存します。

settings.json
{
## cfn-lint.exe へのフルパス
## (ユーザー名は適宜変更して、コメント分は削除してください)
"cfnLint.path": "C:\\Users\\ユーザー名\\AppData\\Local\\Programs\\Python\\Python38-32\\Scripts\\cfn-lint.exe"
}

3.YAML

YAML構文自体のチェックを行ってくれます。
CFn特有のタグはエラーとして認識されてしまうので下記をsettings.jsonに追加します。

settings.json
{
    "yaml.customTags": [
        "!Ref",
        "!Sub scalar",
        "!Sub sequence",
        "!Join sequence",
        "!FindInMap sequence",
        "!GetAtt scalar",
        "!GetAtt sequence",
        "!Base64 mapping",
        "!GetAZs",
        "!Select scalar",
        "!Select sequence",
        "!Split sequence",
        "!ImportValue",
        "!Condition",
        "!Equals sequence",
        "!And",
        "!If",
        "!Not",
        "!Or",
        "!And sequence",
        "!If sequence",
        "!Not sequence",
        "!Equals",
        "!Or sequence",
        "!FindInMap",
        "!Base64",
        "!Join",
        "!Cidr",
        "!Sub",
        "!GetAtt",
        "!ImportValue sequence",
        "!Select",
        "!Split"
    ]
}

4.indent-rainbow

インデントがカラフルになって見やすいです。
拡張をインストールして有効化するだけです。この辺りはお好み次第です。
image.png

5.Indenticator

インデントの深さを強調してくれます。
こちらもインストールして有効化するだけです。お好みでどうぞ。
image.png

6.Japanese Language Pack for Visual Studio Code

これはおまけですが日本語化ができます。
image.png

動作の様子

CFn-sample.gif

まとめ

以上、CFnを書く環境構築を行ってきました。
私もまだ入門者なので他にもおすすめ等ございましたらご教授ください。
ここまで読んでいただきありがとうございました。

9
10
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
9
10

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?