すずきたかまさの沖縄移住生活

沖縄でYouTuberしたりネット活用のコンサルしたりホームページ制作の仕事をしている、すずきたかまさのブログです。沖縄移住してからの日々を記録中

CSS HTML SublimeText2

Zen-Coding(Emmet)で爆速コーディング

投稿日:

20121909 0

先日の「Sublime Text2のインストール方法」という記事にも書きましたが、Sublime Text2などZen-Codingの拡張機能が出ているエディタを利用している場合はコーディングにZen-CodingやEmmetを利用することで、コーディングの速度を上げることができるので、HTMLやCSSに慣れてきたらこれを導入することもいいことかもしれません。

この記事の中でも書きましたが…

「わざわざエディタを使わなくても・・・」という声もあるかもしれませんが、Sublime Text2+ZenCoding(emmet)でのコーディングは慣れてくるとだいぶ作業が楽になります(慣れるまでのハードルも高いが)。今ままで一本30分かかっていたHTMLが20分でできるようになれば…あいた10分でまた更にいろんなことができるし、スキルアップの勉強もできる!!いいことだとは思いませんか?

速度をあげることでコーディングの質もだんだんと一緒にあがっていくかと思いますよ。

そんな Zen-Codingにあたらしいバージョンである「Emmet」が登場しています。

→Emmet — the essential toolkit for web-developers

現在対応しているエディタは以下の通りです。

  • Eclipse/Aptana
  • Sublime Text 2
  • T

  • extMate 1.x
  • Coda 1.6 and 2.x
  • Espresso
  • Chocolat (available via “Install Mixin” dialog)
  • Komodo Edit/IDE (available via Tools > Add-ons dialog)
  • Notepad++
  • PSPad
  • textarea
  • CodeMirror2
  • Brackets

まだ正式版ではないので、いろんな不具合もあるかもしれませんが、機会があればためしてみるのもいいかもしれないですよ。







-CSS, HTML, SublimeText2
-,

執筆者:


コメントを残す

関連記事

Sublime Text2でJavaScriptするなら導入オススメのパッケージ

今週はJavaScriptの講義もやるってことで、Sublime Text2上でJavaScriptでの開発をするときにいれておくと役に立つパッケージを紹介します。 Sublime Linter 構文 …

no image

HTML 基礎講座

Dreamweaverで「ファイル」→「新規」で「ページタイプ『HTML』」を選択して新しいファイルをつくり、それをエディタ画面で開くと以下のようなコードが表示される。 このまま保存してブラウザで開い …

Dreamweaverのスニペットを使おう

そろそろ、何かの機会に混ぜて説明しようかと迷い中だけど、コーディングを速くするには!?という視点でのあれこれも話ししてみたいと思っています。 自分はCoda派なので、最近はもうずっとDreamweav …

twitter bootstrapについて簡単に説明

今日は脱線だったけどtwitter bootstrapについて説明しました。いや・・・twitter bootstrapではどんなcssなのかって説明でしたね(^^; サンプルコードを書いてる最中にい …

いろんな解き方があります

HTMLやCSSについても、「これが絶対に正しい」という書き方はありません。「動いていればいいや」的な書き方については「違うんじゃないの」と指摘もするけれども、サイトを表現するにはいろんな手法があって …