新しいブログに引っ越しました

tomotomoSnippetは新しいブログに移動しました
https://develtips.com/

2014-07-06

フリーのエディタAdobe Bracketsで ZenCoding

2014/07/06 11:31
BracketsはMac専用じゃないよ。Windowsでも使えるよとご指摘を受けましたのでタイトル修正しましたm(_ _)m

最近、週末に子ども達にプログラミングやHTMLコードを教える道場「CoderDojo西宮」という勉強会でメンターをしています。
CoderDojoでは、HTML+CSSの作成に無料のオープンソースエディタBracketsを利用しています。今日、初めてBracketsをインストールしてみて、便利そうでしたので紹介します。
今回のテーマはBracketsでZenCodingする。です。

まずはBracketsのインストール

Brackets - The Free, Open Source Code Editor for the Web


ライブプレビューが高機能

GoogleChromeと一緒に使う機能ですが、ライブプレビュー機能がかなりの高性能です。

画面、右上の雷(ボルト?)マークをクリックすると編集中のコードが瞬時にChrome上に再現されます。Dreamweaverのようななんちゃってライブプレビューじゃなくて、実際にブラウザでどう見えるかのプレビューなのでとても分かりやすい。

ZenCoding拡張機能(Emmet)のインストール

人気のエントリー