Placeholder Image

Subtitles section Play video

  • Hello, everybody.

  • You may notice for my videos that I use almost no extensions for visual studio code while recording.

  • But this is not because I do not like extensions.

  • I actually love using extensions ball coding.

  • But when I record, I try to use a minimal number of extensions to make it easier for everyone to follow along.

  • When I'm not recording, though, I use a large number of useful extensions that have compiled over the last few years.

  • In this video, we'll be covering the 10 best extensions that used for visual studio code and why you should be using them.

  • Let's get started with the first extension V s code icons.

  • This extension does not actually change anything with how you code, but it does change your visual experience drastically.

  • V S code icons adds hundreds of file and folder icons to visual studio code, file explorer and editor tabs.

  • This makes it very easy to visualize the type of file at a glance.

  • It may not seem like a huge change, but when I tried to use Visual Studio Co.

  • Without this extension, it is all too apparent how much slower I am without the icons if you do not like the icons supplied by V S code icons, there are plenty of other icon extensions available that do the exact same thing.

  • So it is easy to find one that fits your personal taste, sticking with the theme of visual extensions.

  • The next extension is color highlight.

  • This is a very simple extraction.

  • The highlights color values with the color they represent.

  • This extension works with multiple color formats, switches, Hexi Decimal, RGB and H S O Visual studio code already does something similar for CSS files by default, but this extension makes it much easier to see exactly what color is being represented.

  • This extension also works in all file types, so you can easily see colors in your HT mo or Java script files as well.

  • If you do not like the way this extension highlights colors, it comes with many different presets for how to show the color, such as highlighting the background, changing the text color or using a border with get being the most popular version control system.

  • There are many extensions available to improve the get experience, but none are as useful is get wins get lenses an absolutely massive extension that has far too many features to fully explain in this video.

  • One of my favorite features is the ability to see the most recent commit message and the Associated Author inside the editor for the line you're currently editing.

  • This is extremely useful for determining why the code is designed as it is and gives you in the name of the person that made the commit.

  • So you know exactly who to look for when you have questions.

  • Another great feature is the file History explored this history Explorer shows all previous committed virgins of a file, which makes it easy to track down any changes that caused bugs.

  • Essentially get lens makes it so.

  • You never have to leave your editor to view visual information about your depository and does a phenomenal job at it.

  • A much smaller but still useful extension is the auto renamed tag extension.

  • This is a simple extension that automatically renames the opposite tag to the tag you're changing.

  • For example, if you're changing the opening age one tag to an H three tag, this extension will automatically change the closing tag two H three as well.

  • This is a great time saver Mind works even on HTML or XML that you have to find another file types, such as JavaScript files.

  • The next extension live server is one of my favorite extensions and is used in all of my videos.

  • Usually, when developing a Web page, you need to constantly refresh the browser to see your changes.

  • Both live server.

  • The browsers automatically updated whenever you save a file linked to that Web page this custom development time drastically.

  • Life's River also service files directly through the local host of your computer, which means that it could be used with server sign Language is like PHP and no Js.

  • Lastly, Lives forever allows you to view your sight on a mobile device.

  • If your mobile devices connected to the same network as your computer, the next extension code spell checker is an extension.

  • I wish I knew about earlier.

  • If any of you seen my introduction to HTML Siri's, you'll know that I cannot spell.

  • But if I had been using this extension, I would have immediately seen that I had misspelled coffee.

  • This extension underlines all misspelled words with a green squiggly line and gives you recommendations to fix the misspelling.

  • This extension also supports many different languages and even checks the individual words of Camel case names.

  • Lastly, all the misspellings for your entire project will show his info messages in the problem section of visual studio code.

  • As you can see, many of these extensions bring functionality into the editor, so you never have to leave the editor.

  • And the next extension D bugger for chrome is no exception.

  • This extension unless you debug your job.

  • A script crowed directly in visual studio code without having to use the chrome developer tools.

  • While this may seem like a minor extension, it is hugely useful because the visual studio code, the bugger, is extremely robust.

  • It also saves you from having to keep the chrome developer tools open to the bug.

  • Your Web page, because that is one more window that you need to keep track of the next extension.

  • Rainbow Brackets is one of the smallest extensions on this list, but it is amazing Time saver.

  • This extension simply color coordinates.

  • Matching brackets.

  • This makes it easy to see the different blocks of code in a file at a single glance.

  • The only downside of this extension is that there are no studies to change the color of the brackets.

  • So if you do not like the colors, you're out of luck.

  • The next extension is quite the mouthful Intel Assistance for CSS class names, but it is a really simple extension, this extension as intelligence, which is essentially auto complete for when you're typing CSS class names into HTML.

  • Thes class names are pulled not only from the current directory that you have opened in visual studio code, but also from style sheets that you linked to within your HTML.

  • Also, despite the name, this extension works in other file types than HTML, such as JavaScript and PHP.

  • This is a great time saver, since you no longer need to swap between your CSS and HTML files in order to ensure that you have the correct spelling and are using your classes correctly.

  • The last extension on this list is really more of a grouping of extensions, which are winding extensions, a linden extension at static air.

  • Check into your code toe warn you have potential errors before you compile a deploy.

  • They're Arlington extensions for nearly every language, from Java to Lula and everything in between the best part about these Linton extensions is they will underline the incorrect code with a red, squiggly or green squiggly, depending on the severity of the problem.

  • The problems will then also show up his heirs or warnings in the problems section of visual studio code.

  • Thes lynchers also sometimes give helpful hints as to what is wrong with the code and how to fix the problem.

  • I have personally saved countless hours of time tracking down bugs related to sin tax.

  • There's that winters have caught for me.

  • This extension has also helped me learn best practices for certain languages, since limiters sometimes will give you a warning when not using best practices.

  • These 10 extensions are my favorite extensions, but this is only the tip of the iceberg.

  • When it comes to extensions, let me know down in the comments below where your favorite extensions are and let me know if you want to see a similar video for other text editors, such as Adam or some blind.

  • Also, please don't forget to like and subscribe.

  • If you enjoyed.

Hello, everybody.

Subtitles and vocabulary

Operation of videos Adjust the video here to display the subtitles

B1 extension visual studio visual studio file html

10 Best Visual Studio Code Extensions

  • 0 0
    林宜悉 posted on 2020/03/30
Video vocabulary