在宅ワーク知恵袋

Cloud9でEmmetを使う方法


uzXKuQq

今日は30度越え、蒸し暑い石垣です。

さて、みなさんはどのエディターを使ってますか?
僕はローカル環境ではSublimeを使用しています。
Sublimeに限らずですが、一番便利なのがEmmet。
ショートカットでゴリゴリ書いていけるEmmetに慣れてしまうと、逆に使えないのが苦痛レベル。

最近はwordpressやRailsの開発にCloud9を使用していて、このCloud9のショートカットとSublimeのショートカットの違いにイライラして、なんとかならないかなぁと検索してみたら、実はありました。(もっと早くやっておけばよかった。。。)

Sublime? Emmet? Cloud9?

Sublimeだ?
恋に落ちるエディタ「Sublime Text 3」を導入したら恋に落ちました!

Emmetだ?
HTML/CSSを爆速コーディング Emmet入門 第1回 Emmetを薦める理由

Cloud9だ?
クラウド最強エディタ「Cloud9」が、WordPressもブラウザのみでインスト・開発・公開が出来て無料!

それぞれについては参考リンクだけで割愛します。

今回の本題、Cloud9でEmmetを使う方法は英語の記事が多く、しかもインストールに触れてないのも多いので、ちょっと苦労しましたが、やってみると簡単だったので、手順を紹介します。

では手順

a1

設定からPluginManagerを有効にするだけ。
これだけでEmmetは動く。(インストールされている)

通常Sublimeではcontrol+eで展開しますが、Cloud9ではcontrol+alt+eなので、この設定だけ変えてあげます。

a2

a3

簡単解決!

テーマをMonokaiにすればSublimeとなんら変わりなく使えます。
ぜひお試しを。

<追記>

a1

Window > Presets > Sublime Mode

Sublime Modeに切り替えるとショートカットもSublimeと同じになります。


この記事を書いた人:IBC

ITブートキャンプ運営事務局です。 随時ブログを更新していきます。