Nona Blog

Isn’t it about time you levelled up your VS code extensions?

Don’t you just hate it when you come across an extension that would have saved you hours of time? WELL, I HATE IT!

Since moving up from being a complete noob to the programming arts, I have come across a few really useful VS Code extensions that will most definitely appeal to you if you haven’t used them yet. These are ordered in what I feel have been the most useful in making my life easier:

1. Prettier

P for Prettify your life

This might be the best extension I have ever used. Prettier essentially takes all your code and makes it look pretty (hence the name I guess 🙂 ). It’s an opinionated formatter that formats your code according to your specifications.

Think trailing commas, or semi-colons at the end of the code. Do you want them? Yes! Set it up in prettier so that it always adds them. No! Set up prettier to make sure they NEVER appear. You can do this and more…

gif from fullstackengine.com

Here’s a short 2-minute video to help you along your prettier journey.

2. ES Lint

If you’re like me when you started off you will most likely have no idea what the fack linting is. So let’s start with a bit of history:

The term “lint” was derived from the name of the undesirable bits of fiber and fluff found in sheep’s wool. 

Wikipedia

In programming:

Linting is the process of running a program that will analyse code for potential errors.

StackOverflow

See the similarities between wool linting and programming linting 🙂 ?

Essentially ES Lint is similar to Prettier in the sense that it formats your code to certain style guidelines (it’s very useful to use both together). However, it can also spot certain syntax errors which can be quite handy and reminds you to add things which are easy to forget. It can also help with optimizing code.

3. Indenticator

I know what you’re thinking? WHAT A DOPE ASS NAME! (okay maybe that was just me)

So small, yet SOOOOOOOOOOOOOOOOOOOOOOOO useful.

4. Rainbow Brackets

Imagine you knew which brackets belonged together on the first look…

5. GitLens

Let’s explain this one with a non-binary story #PC4TheWin.

Person X just joined a project. He goes to a random file in the project. She can instantly see all authors who have contributed to that file. He can see the author and information regarding the PR for each line of code in the file. She can then open that PR (pull request) in GitHub or open a comparison tab in VS Code to compare the changes that were made by that PR. He can then … (there’s so much, I don’t even know all of it yet)

Honestly, if you use Git this is a GitMust.

That’s a wrap for today folks. I sincerely hope you’ve learned about at least one new useful extension to add to you VS coding repertoire that will save you time.

P.S. Some honourable mentions which are also pretty cool (especially for frontend):

  1. Live Server
  2. Auto Close Tag
  3. Auto Rename Tag
  4. VS Code Great Icons

Dom Bauer

Dom Bauer

Junior Developer - Nona

Add comment