Are you a Zen Coder?
Zen coding is a huge time-saver for those who like to drop some serious code snippets by typing out simple abbreviations. If you’re using an editor that has some basic autocomplete, think of a Zen Coding as a plugin that will take autocomplete to a whole new level.
For those of you that are already jamming with Zen Coding, let me introduce you to a new approach to Zen Coding, called, Emmet:
Emmet
[tentblogger-youtube sxW-V24MTXI]
Here’s how it basically works.
When you key p.mag it will output:
<p class=”mag”></p>
Or if you key (.mag>h1)+(.yes>h2) it will output:
<div class=”mag”>
<h1></h1>
</div>
<div class=”yes”>
<h2></h2>
</div>
These are some of the basics, but Emmet includes much more, like CSS abbreviations, extra operators, vendor prefixes, gradients and more. Smashing Magazine did a full write-up and review of it which includes more examples.
Supported editors include:
- Sublime Text 2
- TextMate 1.x
- Eclipse/Aptana
- Coda 1.6 and 2.x
- Espresso
- Chocolat
- Komodo Edit/IDE
- Notepad++
- PSPad
- <textarea>
- CodeMirror2/3
- Brackets
- More
Do you use Emmet or Zen Coding?
I have not tried Zen Coding before, but I may give it a crack with Emmet!
Learn more on the Emmet website.
Jonathan Ober says
Eric, I have been using Coda since the beginning to do my HTML, CSS and php code. I operate in WordPress a lot and use coda snippets for work that I do often, I.e. overwriting functions, child themes, etc. should I switch to Emmet or is it a supplement to Coda and Espresso workflow?
Eric Dye says
It’s supplemental. In fact, they have a plugin/add-on for both Coda and Espresso–two apps that I adore. 😀