Web開発コードエディター Brackets Sprint 23

窓の杜で紹介されていたAdobeの「Brackets」というソフトが気になったので、ダウンロードしてみました。HTMLやCSS、JavaScriptといったWeb向けの言語を編集できるコードエディターです。

今まで使用していたMicrosoft Expression Webというソフトが開発終了してしまい、お手頃なコードエディターを探していて、今回これを見つけました。Adobe Dreamweaverもあるんですが、なにぶんお高いのでw

これだけは欲しいと思っていた機能が、入力補完(いわゆるインテリセンス的なあれ)とHTML5/CSS3対応です。この2点をカバーできていたので、とりあえず導入してみました。

Brackets Sprint 23

開発画面です。左側にディレクトリのツリー、右側にエディターが配置されています。本ソフトの特徴として、HTMLタグやid、classから、それを実装しているCSS部分をインラインで参照できることがあげられます。これは案外助かります。画面やタブ移動がなくなりますので。

Brackets Sprint 23

ちなみに色を参照すると、カラーパレットが表示されます。もちろん透明度も設定可能。

Brackets Sprint 23

そして最大の特徴が、ライブプレビュー機能。Google Chromeと連動して、プレビューをリアルタイムに表示できます。画面は本ブログのタイトル背景を黒色に変更したプレビューです。また現在編集している部分がChrome上でハイライト表示されます。

この機能のおかげで、PHPの編集結果を確認するために、いちいちアップロードする必要がなくなりそうです。

あと驚いたのが、Brackets自身がHTML+CSS+JavaScriptで記述されているということ。ファイルのオープン・保存といったHTMLではカバーできない一部の機能はバイナリですが、これはとても興味深いですよね。

使い勝手としては上々なので、これから使っていこうと思います。

オープンソースのWebアプリ開発向けコードエディター「Brackets」Sprint 23が公開

https://forest.watch.impress.co.jp/docs/news/595970.html

Brackets

http://brackets.io/
投稿日:
カテゴリー: ICT

作成者: きたけん

神戸出身&在住。大学では環境を学び、今はまちづくりに携わる。思い立ったらすぐに飛び出してしまう。