How to Setup Visual Studio Code for Web Development | HTML, CSS, and JavaScript

Ready to streamline your web development workflow? In this guide, I'll show you
how to set up Visual Studio Code (VS Code) for web development, transforming it into a powerful and feature-rich code editor tailored to your needs.
Join me as I walk you through the essential steps to optimize your VS Code environment.
Enjoy the Video!
00:12 Download VS Code
00:28 Install Live Server
00:42 Install JavaScript Snippet
02:53 Install Bootstrap
01:00 Create a Project
01:39 Outro
Download VS Code
code.visualstu...
***Career Resources***
To get more of our best content on IT careers and IT certifications, go to
Be sure to leave any questions or comments below!
See More Videos and Subscribe: / @skillsbuildtraining
Website:
Facebook: / skillsbuildtraining
Twitter: / skillsbuildt

[@moonboi3948]

Thanks for the helpful tutorial, short and to the point. At the end of the video took me a while to see where to start the live server, it's the button next to the bell at the bottom right.

[@SkillsBuildTraining]

Glad it helped!

[@HenryIke-kp2og]

Please can you start a full project thank you

[@Brrrrbrrrr11]

This is the best tutorial ever, so simple and easy to follow . Thank you very much I’m picking up back coding, it is a great skill to have. Thank you🙏🏾 God bless

[@davidturay9896]

Facts!

[@SkillsBuildTraining]

Glad it helped!

[@LoneIcon]

i like a tutorial that goes straight to the point

[@SkillsBuildTraining]

Thanks!

[@marcio2799]

Why's installing html so easy compare to the C

[@SkillsBuildTraining]

Thanks for your comment.

[@ugabuga8791]

C can be really easy to install/use if you just use Visual Studio Community instead of VSCode. Everything comes pre-setup pretty much.

[@Samiksha7892-]

Because using html is also easier than using css 😂😂

[@ChristPoco]

With 12 GB space the environment 😂​@@ugabuga8791

[@deadlyorchard]

Because one isn’t a programming language

[@Diversegordon_123]

I knew what to do almost in no time, It is so detailed and precise, Thanks a lot.

[@SkillsBuildTraining]

Glad it was helpful!

[@mobeenbadshah5586]

Thanks for this short and straight to the point tutorial.

[@SkillsBuildTraining]

You're welcome!

[@officiallovelyworld7951]

Love you bro from India because you make a wonderful video without wasting anything that's why I am comment here👍👍👍

[@SkillsBuildTraining]

Thanks!

[@jermesastudio]

Thank you for this tutorial. It has been very helpful for my commercial projects.

[@SkillsBuildTraining]

Glad it was helpful!

[@justforfun5368]

brothers this video is nice I like videos like this because are you showing us every important thing without losing our time thank you, brother ❤ from Bangladesh

[@tagore4d]

Thanks so much for the video. super quick and easy to follow. very useful for fast track and short term users like me!

[@SkillsBuildTraining]

Glad it was helpful!

[@ss8n]

on point , never thought it would be simple! thank you and may god bless you

[@SkillsBuildTraining]

Glad it helped!

[@nratj5]

I Wish the same

[@MunnyLerner]

Well done, that was easy to follow and everything just werked!! Thanks!

[@SkillsBuildTraining]

You're welcome!

[@SlazhhDGame]

yooooo this is really helpful to me it's works i'm waiting for it for so long, Thank you so much

[@SkillsBuildTraining]

You're welcome!

[@Kitty_Cosmic]

This is very helpful thank you kindly

[@SkillsBuildTraining]

You're very welcome!

[@liluwux7]

BEST TUTORIAL EVER 👏🏻✨

[@SkillsBuildTraining]

Thank you!

[@shobuj_pata]

Alright Thank You for saving time brother!

[@SkillsBuildTraining]

Happy to help!

[@BetterItNowTamil]

Time and life saving bro. Really helpful. Subscribed for this video.

[@Sniiperr]

I don't understand why but Emmet will not show suggestions for me, I am running MacOS Sonoma on Apple Silicon. Everything else works fine but I do not get suggestions

[@kuroumi.purple]

why not? you should get, coz Im also using the same version of Mac

[@mirnahatem3135]

thank you sooo muchhh i am greatful for you

[@SkillsBuildTraining]

You're welcome 😊

[@manhwa_monster]

Thanks 😊

[@SkillsBuildTraining]

You're welcome!

[@Deepak-qo9kk]

I recently started learning web development applications like HTML, CSS, JS. So is MSYS2 important for me. I am using Vs code.

[@shaiithenaai]

So we shouldn't click either ' Add "Open with code" action to Windows Explorer file/directory ' ?

[@miasbratz]

Thank you, you're amazing❤

[@SkillsBuildTraining]

You're welcome 😊

[@yoonminforeverr]

Really thanks so much.

[@SkillsBuildTraining]

You're welcome!

[@inshaakbar6402]

Thnku so much sir too much helpful

[@SkillsBuildTraining]

Most welcome!

[@cerak4971]

Thank you!

[@SkillsBuildTraining]

You're welcome!

[@kerasway3830]

How do you see the website (white background) ?

[@voltgk]

very use full videos keep it up broooo

[@SkillsBuildTraining]

Thank you so much 😀

[@bunnyking3670]

Thank you so much 😊😊😊 bro❤

[@SkillsBuildTraining]

Welcome 😊

[@VyCorr]

Thank you
It works 🎉❤

[@SkillsBuildTraining]

You're welcome 😊

[@RDPLAYSYT]

@@SkillsBuildTraining How i get the website link that we make not the live server i want to share the website how can i ?

[@ritikachouhan1746]

My vs code not support or defined html lang

[@niteshnayak940]

Thank you❤

[@SkillsBuildTraining]

You're welcome!

[@lakshyasingh2184]

Thanks for help❤

[@SkillsBuildTraining]

You're welcome!

[@NeerajRaj-wt1ep]

My css animation or transition is not working in vs code
Can you help me and give me a solution

[@user-jr2pb1bl5w]

Do you have to pay for VS studio?

[@testtube1842]

Why doesn't Vscode have a drag and drop editor? Like Dreamweaver you can click on an element in the visual window and it will highlight the code in the code window.

[@deadlyorchard]

VsCode is a text editor. It’s meant to help you write code for any programming language. What you’re looking for is a whole GUI specific to building static HTML pages. At that point, you’ve basically got the same program as the wix/weebly site editor without the networking code. Might as well just use their tool instead of building one out of

[@hemanthr5852]

Thank you Brother 🤍

[@SkillsBuildTraining]

You're welcome!

[@PurpsBrickster]

whenever i start to type, it doesnt add anything (I know how to code html) even with refreshing

[@zackmunna007]

Wow thanks 🙏🏼 sir

[@SkillsBuildTraining]

Most welcome!

[@chuck-sr3zt]

do I not need of downloading any extensions like CSS?

[@HX_Cosmic]

Uhh problem , it dosent put htlm for me.

[@Asma-lj9oo]

Why when instal live server deosn t work !?

[@NeerajRaj-wt1ep]

Css Transition and animation is not show on live server and any other browser

[@chirag1454]

Thanks :)

[@SkillsBuildTraining]

You're welcome!

[@farhat-20]

Code language not supported or defined ..... Ye error aa rha hai mere me plz koi btao

[@MdSyed-y4d]

ThankS 😎

[@SkillsBuildTraining]

You're welcome!

[@ogoungabright6180]

Some of us watching this video are newbies. Try and teach us instead of just talking and clicking. I don't understand what you are clicking

[@SkillsBuildTraining]

Thanks for your comment.

[@webdesigntutz]

@@SkillsBuildTraining do u need to install node js?

[@gauravgaggar6716]

@@webdesigntutz did u figure out yet ? even i don knot if we have to install node js separately

[@RodieOsc]

Gracias !

[@SkillsBuildTraining]

You're welcome!

[@JevinDK-wm9dg]

Thank you.

[@SkillsBuildTraining]

You're welcome!

[@professorXPM]

NICE!!!!

[@SkillsBuildTraining]

Thank you! Cheers!

[@aphelmusonda5253]

Thank you so much ❤❤❤❤

[@harls5729]

Where fo you download the html?

[@tithil7455]

Wow 🎉 nice very helpful

[@SkillsBuildTraining]

Thanks!

[@fredaabena5379]

Thank you

[@SkillsBuildTraining]

You're welcome!

[@kensuarez641]

Does it require internet connection so you can code?

[@deadlyorchard]

It doesn’t.

[@Lets-rise-009]

This could be very helpful if you could remake this video by slowing the process a little bit and making it longer

[@SkillsBuildTraining]

Noted!

[@g1sart843]

Sir where is memt how can I use i am not getting that

[@SkillsBuildTraining]

Run through the steps again, you might have missed a step.

[@g1sart843]

@@SkillsBuildTraining okay sir

[@nabilaitomar]

it's not working i don't know why

[@SkillsBuildTraining]

What error are you getting?

[@faresbouaalam]

provide content without music It is not permissible to listen to music or spread it because it brings ongoing bad deeds

[@SkillsBuildTraining]

Noted!

[@AyushSinhx]

thanks

[@SkillsBuildTraining]

You're welcome!

[@omegajd]

How to enable memt

[@BadReality-t1k]

Nice

[@SkillsBuildTraining]

Thanks!

[@cbbcbb6803]

Next, for Linux

[@jankibrahmbhatt2680]

Very fast...

[@SkillsBuildTraining]

Thanks!

[@merajmahir9380]

make your tutorial slower

[@MustafaPlaysOg]

0.75*

[@bojanbulic8807]

to fast

[@raya7390]

Markdown extension problem is coming

[@diamondiLy97]

thanks

[@SkillsBuildTraining]

You're welcome!