http://emmet.io/

About a year ago I retooled. It was time to get my work environment set up to make writing applications and websites as efficiently as possible. I had a lot of home-brewed solutions to repetitive tasks (most were server-side snippits) but I knew that there was surely some great tools out there. After trying out a few IDEs, Aptana, SublimeText and a few others I chose PhpoStorm by JetBrains. This is a powerful tool for all kinds of open source php development. It pairs very well with Git and WordPress. The only thing I do not like about it so far is the fact that you cannot sort by the modified date in the project window. Maybe someone other knows this one?

PhpStorm has Emmet integrated as a plugin. Emmet makes it so you can write dynamic snippits. It is inspired by CSS selectors. If I type ul>li*8 and hit the tab button I get

<ul> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> <p>

Is that cool or what!

So let me do a little bootstrap set up

div.container>div.row>div.col-md-3*4

which makes

<div class="container"> <div class="row"> <div class="col-md-3"></div> <div class="col-md-3"></div> <div class="col-md-3"></div> <div class="col-md-3"></div> </p></div> </div> <p>

And a table for Bootstrap that is 6 rows with 10 columns…

table.table>tr*6>td*10

<br /> <table class="table"> <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> </table> <p>

That would be a big “BAAAAAAAM!” Actually, it looks better than above as the results are properly tabbed. No longer do you type some codea and cut and paste code fragments. Fun stuff!