My Favorite HTML Code Writing Extensions on Visual Studio Code

My Favorite HTML Code Writing Extensions on Visual Studio Code

For those of you that don’t use Visual Code Studio, you are about to find out why its my go to, and if you think your code editor is better, please comment what you use and why you love it. Also, stick around for a lovely treat at the end!

Here are the top 5 extensions I use most!

  1. Auto Close Tag

If you are anything like me, every key stroke is precious and can save tons of time when you’ve got loads of scrolls worth of code! That's why this extension is MONEY! Plus, whose got time to backspace you fat fingering the closing tag with“<?” C’mon I know I’m not the only one!

auto close tag extension

It does exactly what you think it does, you start typing di hit tab and boom you’ve got

11 keystrokes shrunk down to 3! Thats what I call a time-saver!

2. Auto Rename Tag

So there have been numerious times where I mistakenly put the incorrect header type or used a div instead of a nav… This comes in clutch and saves you time and clicks.

Auto Rename Tag Extension

All you have to do is correct the opening tag and the closing tag will AUTO RENAME! Pretty cool!

3. Prettier

Who doesnt like to customize the different looks of your code? This is THE ONE! All kinds of different dark features because who wants to get their eyes melted off staring at black on white?

Prettier Extension

4. HTML Boilerplate

This one is handy and a time saver as well. All you have to do is type “ht” in an index.html file and like 5 different prewritten html options will pop up. I like the boilerplate. Its got everything you need right there in the head

HTML Boilerplate Extension

5. Live Server

The most SUPER clutch thing that I absolutely love, is LIVE SERVER. My 1st class I ever took went the overly hard route to be able to launch a live server and it was through github using repositories and their webpage feature and gitbash if I remember correctly and it was cool to know without a doubt, but this makes life SO MUCH EASIER!

Live Server Extension

All you gotta do is click on your index file, then click on the bottom bar of the window where it says “Go Live”

I hope this helps someone! Happy coding!

World Famous Coding Dad Joke #204:

Question: How does a web developer order his coffee?

Answer:

I take my coffee #000000

I told you it was a treat! :)