Espressoを使うときに入れておくと便利なSugar+Themesまとめ

今はEspressoを主に利用してコードを書いて、会社ではTransmit、家ではForkliftを使ってゴリゴリしています。

デフォルトのままでもそこそこ使えるのですが、対応していないコードや、jQueryのコードをシンタックスしてくれるものがあったりなどなど、いろいろ入れると便利に使えます。

そこで勝手ながらまとめました！

Sugar

SugarはEspressに加えるプラグインで、第三者の人が自由に作り配布することができるプラグイン機構です。

Espressoを使う理由になったのが、このネーミングセンス良すぎてってのと、コーヒー好きだったのでという理由です。

ちなみに砂糖を入れるときの効果音は「ｼｭｶﾞｰ」です。

Sugarのインストール方法

Sugarのインストールは、以下に紹介するURLからダウンロードして展開したディレクトリを「sugar名.sugar」の形式に書き換えてあげて、ユーザーの「library（隠しフォルダ）」→「Application Support」→「Espresso」→「Sugars」に入れてあげるだけでインストールが完了します。

※Sugarを有効にするには再起動が必要です。

導入必須

Zen-Coding

言わずと知れたHTMLコーディングを爆速にしてくれるプラグインです。

CSS3セレクタに近い書き方でHTMLタグをどんどん展開できます。

これが入って無いということは助走つけたガンジーでも殴るレベルです。

Web開発系

HTML5.sugar

HTML5のシンタックスとタグサジェストをしてくれるSugarです。

CSS3.sugar

CSS3のシンタックスとコードサジェストをしてくれるSugarです。

jQuery.sugar

jQueryのコードシンタックスやコードサジェスト等が行われます。

意外と打つのが面倒な関数（ajaxCompleteやserializeArrayなど）も楽に打てます。

Smarty.sugar

PHPテンプレートエンジンで言わずと知れたSmartyのシンタックスとハイライトをコードサジェストを行ってくれます。

その他便利なSugar

markdown.sugar

Markdown記法のシンタックスなどを行ってくれるSugarです。

GithubなどのREADMEなどを書くときに便利です。

regex.sugar

デフォルトの検索に正規表現を用いた検索を追加してくれるSugarです。

検索ワードを直接検索でもいいですが、近隣の何かを覚えていた場合に正規表現を使って検索するとかとか。

ini.sugar

ini形式のファイルをシンタックスしてくれるSugarです。

ZendFrameworkのリソース定義ファイルがiniなので入れてました。

Themes

テーマのインストールは、Sugarと同様のパスにSugarsディレクトリと同階層に「Themes」というディレクトリを用意し、そこにバンバン突っ込んでいくだけでOKです。

※これまたEspressoの再起動が必要です。

vibrant-ink

黒背景に紫とオレンジがベースのカラーリング。

Obsidian

全体的にグリーンで構成されたカラーリング。

黒曜石という意味らしい。

WindWheel

黒背景で紫っぽい青がベースのカラーリング。

自分はこれを使ってます。

他のテーマでも良かったのですが、数値に背景色が入っていなかったのがこれだけだったのでこれにしました。

Monokaffee

明るめの配色でとても見やすいカラーリング。

Twilight

TextMateでおなじみな見やすくて綺麗でまとまったカラーリング。

おまけ

いちいち拾ってきてディレクトリ名変更したり...なんてめんどくさすぎるので、簡単なシェルを書きました。

後はMacのターミナル.appを起動して、シェルを実行すれば全部「.sugar」拡張子の付いた状態にしてくれます（はず）。

また、当記事で紹介したテーマもgithubからクローンしてくるようにしています。

ダウンロード後、esspresso_installer.shのパーミッションを実行可能（0755など）にし、後は実行します。

まともなエラーチェックなどは行っていませんが、多分動くはずです。

実行後は、Esspressoというディレクトリの中に「Sugars」、「Themes」の2つが出来上がりますので、後は上で説明したディレクトリの中にそのまま放りこめばOKです。