Writing HTML faster

Everyone that knows me, knows that I am constantly trying to reduce the coding time, well now I found a cool plugin called Emmet which allows me to write a quick CSS like syntax and by pressing TAB, it will automatically generate the HTML that correspond to it

So by writing the following: #header>h1.header_1{Main page}+ul#MyList>(li.myItem>a{item $})*10
Will produce:
<div id="header">
<h1 class="header_1">Main page</h1>
<ul id="MyList">
<li class="myItem"><a href="">item 1</a></li>
<li class="myItem"><a href="">item 2</a></li>
<li class="myItem"><a href="">item 3</a></li>
<li class="myItem"><a href="">item 4</a></li>
<li class="myItem"><a href="">item 5</a></li>
<li class="myItem"><a href="">item 6</a></li>
<li class="myItem"><a href="">item 7</a></li>
<li class="myItem"><a href="">item 8</a></li>
<li class="myItem"><a href="">item 9</a></li>
<li class="myItem"><a href="">item 10</a></li>
</ul>
</div>

The syntax is easy to learn and require few minutes, and it return the invest during the first day

This plugin exist for majority of the editor including brackets (which I currently use)
Writing HTML faster Writing HTML faster Reviewed by Ran Davidovitz on 4:50 PM Rating: 5

No comments:

Powered by Blogger.