Hot Proton

Leave a comment

Rapid Coding with Emmet

What is Emmet?
Emmet previously Zen-coding is a super fast way of coding. There is a bit of learning curve but once you get a hang of it then you will never write code the old way. So lets get started with exploring whats this new way of writing code the rapid way or the emmet way.

Install Guides for various editors
Sublime Text 2
TextMate 1.x
Coda 1.6 and 2.x
Chocolat (available via the “Install Mixin” dialog)

Now if you have finished installing emmet for your favourite code editor lets get started !!!!

Type This

div#header>h1.logo>a{site Name}

Expands to This

<div id="header">
<h1 class="logo"><a>site Name</a></h1>

Emmet in Action

Read More
Emmet — the essential toolkit for web-developers
Emmet Abbreviations Syntax

Emmet Tutorials with loads of samples
High-Speed Coding — Goodbye, Zen Coding. Hello, Emmet! | Smashing Coding
Faster Workflow: Mastering Emmet, Part 1
Faster Workflow: Mastering Emmet, Part 2
Faster Workflow: Mastering Emmet, Part 3
Faster Workflow: Mastering Emmet, Part 4

Emmet Cheat Sheet
Emmet Cheat Sheet
Cheat Sheet – Emmet-Cheat-Sheet.pdf