November 6, 2015

Best editor for AWS CloudFormation template (JSON)

AWS CloudFormation template is a way to describe the AWS resources that can be created/updated/deleted and it’s in JSON format. Like many other programming languages most of the editors/IDE don’t have proper syntax highlighting for JSON.

For a long time I was using notepad++ and the built-in Javascript syntax highlighting which doesn’t provide much granular highlighting. I was looking for a much better editor and finally found Atom, the most powerful editor by GitHub. It provides the ability to customize almost everything in it. It also can be extended using huge list of packages and themes.

Default Dark One theme just highlights the key/value pair using two different colours as shown below.

Dark one theme Atom

I was looking for much better highlighting and that’s when I found Monokai Json Plus theme for Sublime text by Colibri. But Sublime Text is a licensed software and it costs $70 per user, whereas Atom is free & open source with full flexibility to control it.

Sublime Text theme uses plist based TextMate themes and Atom uses CSS/LESS based themes for syntax highlighting. Interestingly Atom comes with apm (Atom Package Manager) which has in-built capability to convert TextMate based themes to Atom supported format.

Using the following syntax, apm can be used to convert the TextMate theme to CSS based theme for Atom which can then be placed it in Atom’s package directory

apm init --theme ~/.atom/packages/monokai-json --convert ~/Downloads/Monokai JSON+.tmTheme

Once the package gets converted and deployed in appropriate package directory, it needs to be activated. This can be done by going to Packages > Settings View > Manage Themes and under Syntax Theme selecting Monokai Json from the drop down as shown below.

Activate Theme

Once the Monokai Json theme syntax highlighting has been enabled, we can see that it can highlight syntax with different colour codes up to 10 levels in the JSON file. It helps a lot especially while editing a huge JSON file.

Screenshot of Monakai Json

If you notice, there is a map at the top right which displays the map of the whole code. This is enabled by another package called minimap. It will be really helpful when we are navigating through a huge file to identify a specific word using search or going to specific location without scrolling too much.

There is also a thin line at the right before minimap which is the preferred line length that I have set. It comes handy when you follow specific formatting standard.

Few other additional packages that might be helpful in this scenario are Pretty JSON (help to format the JSON) & Linter Jsonlint (to Lint the JSON file if Monokai was not used).

© Prakash P 2015 - 2023

Powered by Hugo & Kiss.