「Adobe Edge Code」で使える、コーディングを加速させる様々なプラグイン

「Adobe Edge Code CC」徹底入門（3）

　Edge Codeはエディタ自体がHTML5で構築されており、拡張機能もHTML5で作成されています。前回までで触れている通り、Edge CodeはBracketsのディストリビューションであることから、Bracketsの拡張機能はEdge Codeでもほぼそのまま利用可能です。「ほぼ」と書いたのは、Bracketsはバージョンアップの頻度が高く、最新のBrackets用の拡張機能が使えない場合もあるためです。

　Bracketsのプラグインのラインナップはとても充実しており、うまく組み合わせればパワフルなエディタを構築することができます。今回はフロントエンド開発に役立つであろうプラグインをピックアップして紹介します。気になった機能は試しにインストールしてみることをおすすめします。

拡張機能のインストール方法

　現在のEdge Code CC Preview 5では、拡張機能のインストールパネルが表示されません。拡張機能はオンラインの一覧からURLを取得してインストールすることもできますが、エディタ内からシームレスにインストールしたいので、パネルを表示させる方法をこちらを参考にして有効にしてください。

　有効にできない場合は、Brackets Extension RegistryからインストールしたいプラグインのURLを、［File］-［Extension Manager…］より入力してインストールしてください。

UI関連

Themes

• https://github.com/MiguelCastillo/Brackets-Themes

　CodeMirrorベースのテーマセットを使えるようになるプラグイン。インストールするとThemesというメニューが追加され、Sublime Textなどでおなじみの、Monokaiなどのテーマが選べるようになります。

brackets-code-folding

• https://github.com/thehogfather/brackets-code-folding

　Edge Codeにはデフォルトでコード折りたたみ機能がついていないため、このプラグインを入れておくと良いでしょう。js/json/css/html/less/xmlファイルに対応しています。

Markdown Preview

• https://github.com/gruehle/MarkdownPreview

　Markdownファイルをプレビューするパネルを表示してくれるプラグイン。インストールすると、右のメニューにボタンが追加され、Markdownファイルを開いている時のみ有効になります。

Vimderbar

• https://github.com/fontface/brackets-vimderbar

　Edge Codeをvim化してくれるプラグイン。挿入モード、ヴィジュアルモードの切り替えができ、基本のキーバインディングや:コマンドも使えるようになり、vimのような操作を可能にしてくれます。