Criando um HTML muito mais rápido com VS Code
- #HTML
Queria compartilhar com vocês uma dica que me ajudou demais a acelerar a produção de códigos html no VS Code. Descobri por meio do Código Fonte TV, nesse vídeo aqui.
Basicamente, o VS Code permite usar abreviações para criar as tags. Por exemplo, se eu digitar "!" e pressionar ENTER, veja a mágica:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
~MINDBLOW~
Outras possibilidades
Se eu digitar simplesmente ".nomedaclasse" e pressionar ENTER aparece:
<div class="nomedaclasse"></div>
Se eu quiser criar uma Section com a classe "container" e 4 divs abarcadas, sendo que cada div possui uma imagem e um link, basta escrever:
"section.container>div*4>img+a:link" e pressionar TAB:
<section class="container">
<div><img src="" alt=""><a href="http://"></a></div>
<div><img src="" alt=""><a href="http://"></a></div>
<div><img src="" alt=""><a href="http://"></a></div>
<div><img src="" alt=""><a href="http://"></a></div>
</section>
Ps.: Se você apenas copiar e colar não vai funcionar provavelmente, funciona quando você está digitando.
Legal, né? Recomendo verem o vídeo (se ainda não viram) que tem outras dicas nesse sentido. Que outros atalhos você conhece que te ajudam bastante na produção dos códigos?
Até a próxima!