Visual Studio Code comes with a bunch of built-in tools that make coding life much easier, as well as a whole array of extensions that you can install according to your needs.
Extensions
VS Code seems to have a solution to just about every coding challenge, but here are the ones I use:
Live Server
Use Live Server to get live reloads in the browser of your local development server! This is great for not having to constantly hit the refresh button to view any changes made to your project. As soon as you save changes, the browser will be updated automatically.
Bracket Pair Colorizer
Do you lose track of where your closing brackets are? Bracket Pair Colorizer will show you where it is by connecting a line from the bracket where your cursor is on to the end point.
Prettier
Prettier is a nice code formatter you can use to keep your code looking consistent and, well, pretty! This is particularly handy for languages like JavaScript, where you need to add the ending semi-colon. Prettier takes that ask off of our hands.
VSCode Ruby
If you're learning to code in Ruby, VSCode Ruby provides elegant syntax highlighting as well as snippets.
JS JSX Snippets
This extension is fantastic when working in React. JS JSX Snippets will save you a ton of time by giving you keyboard shortcuts to create a skeletal React component, whether it's a class component or functional component.
EJS Language Support
I've only just started using a bit of EJS for some Node projects, but EJS Language Support is tremendously helpful to get better syntax highlighting, making your code more readable.
Keyboard Shortcuts
Aside from the general keyboard shortcuts like ctrl + s for saving a document, here are some VS Code keyboard shortcuts that I have come to use regularly:
toggle word wrap:
alt+zduplicate a line of code:
shift+alt+up/downmove a line of code up or down:
alt+up/downduplicate cursor:
holdshift+ clicktoggle commenting a line of code:
ctrl+/
Here is a complete list of VS Code keyboard shortcuts.
Happy Coding!
){kind=link}
Top comments (0)