Dobrando a sua produtividade com Emmet!

Saiba como o Emmet vai fazer a sua produtividade dobrar deixando a codificação muito mais divertida

Olá leitores mais inteligentes da internet, hoje é segunda-feira, dia, aqui no blog de dicas de produtividade para quem trabalha com desenvolvimento, e como diria o pessoal de call-center: “Vamos estar Dobrando a sua produtividade” com essa dica de hoje, alias o post de hoje é o artigo de número 400! aqui no blog, mas vamos conheçer um pouco mais sobre o Emmet.

Se você não tem paciência para ler o texto, assista o Screencast no final do post

O que é o Emmet?

Pra quem nunca ouviu falar da Emmet esse o novo nome/marca da biblioteca mais famosa biblioteca de html/css “improvement”, ou seja ela torna o ato de programar escrever Html/CSS extremamente mais produtivo com base em uma série de atalhos e pequenos  truques que facilitam a vida do desenvolvedor.

Quem criou o Emmet?

A biblioteca Emmet foi criada e é atualmente mantida por Sergey Chikuyonok desenvolvedor russo que possui além desse uma série de outros projetos open-source que você pode acompanhar em seu Github

Por que o Emmet vai dobrar a sua produtividade

Simples, você vai digitar menos, a mecânica do plugin é muito simples, basta digitar o atalho e apertar o Tab e a mágica acontece, veja o exemplo:

Você digita:

div#container>ul>li*3

Aperta TAB e o editor transforma em:

Produtividade com Emmet
Produtividade com Emmet

E quando falamos de CSS, basta que você decore alguns atalhos que irão fazer mágica com sua produtividade, veja a lista abaixo, e não esqueça de sempre ativar o atalho com a tecla table-layout:

m50 = margin: 50px;
w30 = width: 30px;
tl = text-align: left;
fs = font-style: ;

E a lista é gigantesca, e você pode conferir aqui na documentação do projeto

Como instalar o Emmet no SublimeText?

O Sublime é o meu editor preferido dentre outras coisas pela facilidade em se installar plugins, e neste caso não é diferente, basta abrir o gerenciador de pacotes (CMD+SHIFT+P e procure Package Manager) Selecione instalar novo pacote, procure por Emmet e aperte Enter, reinicie o sublime e pronto.

Onde baixar o Emmet? 

No site oficial do projeto você encontra plugin do Emmet para as plataformas mais usadas do mercado como SublimeText, TextMate, Coda, Eclipse, Notepad++ dentre outras (http://emmet.io/download/)

É isso pessoal, até amanhã!

Assista no Screencast abaixo como utilizar o Emmet no Sublime

 

Leave a Reply

Your email address will not be published. Required fields are marked *