I am working on multiple frontend projects since last 2-3 years (mostly on VueJS) and during this period I've tried multiple VS Code extensions to improve my speed and productivity. Today I am happy to share some of my daily used extensions with you guys.
1. GitLens — Git supercharged
I hope this one is one of the most popular VS Code Extensions. It shows me multiple git statuses like, changed lines, who has changed particular line and when.
2. Git History
This extensions shows (obviously) git history beautifully. Along with that, it's quite helpful to navigate in previous versions of the files with a few clicks.
3. GitHub Pull Requests
This one's my favorite. This one helps me to create PR without visiting GitHub! Also, it adds GitHub in the sidebar along with Extensions, where we can see multiple things related to PRs, like, Waiting For My Review, Assigned To Me and more.
4. Change-case
As a developer, we deal with variables the most. This extension helps me to convert the PascalCase to kebab-case or snake_case to camelCase with a single click.
5. Lorem ipsum
This one's pretty useful when we're beginning to work on new projects or I am doing an event. We need Lorem Ipsum right?
6. vscode-random
In designing the UI, when it comes to adding name, email, date, country and more, I prefer them to look as natural as possible, Lorem Ipsum doesn't work there. During that time this extension comes to rescue. It allows us to place random name, email, uuid and more.
7. Code Spell Checker
I installed this extension few months back. This one helps me to correct the grammatical mistakes content of the website/app I am working in the code itself without Googling. And sometimes useful to correct variable names if I misspell them.
8. DotENV
I usually work on multiple projects and I need to deploy them to Netlify or Zeit. I manage multiple .envs and this one is quite useful to highlight .env files.
9. ESLint
Yep, it's for checking the linting of the code while working and fix it if necessary.
10. Prettier - Code formatter
This one's useful to reformat my code based on my Prettier config. Also I usually keep editor.formatOnSave: true, this Prettier formats the code automatically.
11. Prettify JSON
So, I used to google every time when I needed to format .json files and then found this <3. This one's pretty useful, just press cmd + P or Ctrl + P and Prettify JSON.
12. Path Intellisense
This extension allows me to customize the path auto-completion while working on the code. It also allows to add aliases like @ which we can point to the root directory of the project and configure the same in our webpack.config.js. I am mostly working on NuxtJS, so this help me to auto-complete using my aliases.
13. SCSS IntelliSense
Many times I am working on SCSS, and you know we've tons of variables to deal with. This one makes it really easy to auto-complete, navigate and even preview color variables. Saving a ton of time for me.
So that's it! Show some ❤️ if you liked reading the post and feel free to tell me which one's your favorite extension.
Top comments (1)
I found one really cool vscode theme named Jellyfish-x-retro 🚀🚀
Do checkout: marketplace.visualstudio.com/items...