DEV Community

Cover image for 21 VS Code Extensions To Boost Your Productivity
Kiran Naragund
Kiran Naragund Subscriber

Posted on • Edited on

21 VS Code Extensions To Boost Your Productivity

Hello Devs👋

As developers, we spend most of our time in VS Code. In this post, I will be sharing some VS Code extensions that can help boost your productivity and save your valuable time.🕧

Lets get started🚀

Before that first lets take a look into these amazing ThemeSelection templates


ThemeSelection (Sponsored)

ThemeSelection platform offers a wide variety of premium and free admin dashboard templates and UI kits for various frameworks like Bootstrap, NextJS, React, Vue, Laravel, Django, and ASP.NET. Their templates are designed to help developers create the user interface for the admin side of web applications efficiently.

  • Materio Free MUI NextJS Admin Template

This admin dashboard template is built with MUI 5 (Material-UI) and Next.js. Furthermore, this NextJS Admin Dashboard template offers a clean, modern design and is perfect for building high-performance admin interfaces. It comes with an App router & SSR support.

It's Fully responsive, includes various UI components, and is easy to integrate with other libraries and frameworks.

Materio Free MUI NextJS Admin Template

⬇️ Download Now

  • Sneat – Vuetify Nuxtjs 3 Admin Template

This template is great choice for building admin interfaces with Vue.js and Nuxt.js. This Nuxt Admin Dashboard Template offers a responsive design, Vuetify integration for UI components, and features tailored for dashboard and admin panel development.

If you're exploring it for your projects, it could provide a solid foundation with its modern stack and UI components.

Sneat – Vuetify NuxtJS 3 Admin Template

⬇️ Download Now

Explore their Admin Templates, UI Kits, and Bundle deals!


qodo Gen

qodo

✨ qodo gen uses AI to Generate tests, Review test results, Fix bugs and errors for code written in various programming languages like Python, JavaScript, TypeScript and Java. It acts as your personal agent or assistant within your IDE.

🔹Link 👉 marketplace.visualstudio.com

Partial Diff

Partial Diff

✨ Partial Diff extension allows you to compare different text selections within the same file or across different files, making it easier to spot changes and differences.

🔹Link 👉 marketplace.visualstudio.com

Git Graph

Git Graph

✨ Git Graph extension provides you a visual representation of your Git repository, making it easier to understand and manage branches, commits, and merges also you can perform Git actions from the graph.

🔹Link 👉 marketplace.visualstudio.com

Path Intellisense

Path Intellisence

✨ Path Intellisense extension extends the default path completion in VS Code to include all available paths in your workspace, even if they are not yet imported.

🔹Link 👉 marketplace.visualstudio.com

Error Lense

Error Lense

✨ Error Lens extension enhances your error highlighting in your VS Code by showing error messages directly inline with your code.

🔹Link 👉 marketplace.visualstudio.com

SQLTools

SQLTools

✨ SQLTools is a lightweight SQL client for VS Code, it offers you database management, query execution, and results the visualization directly within the editor.

🔹Link 👉 marketplace.visualstudio.com

Markdown All in One

Markdown All in One

✨ Markdown All in One extension provides comprehensive support for Markdown editing, including shortcuts, table of contents generation, and more.

🔹Link 👉 marketplace.visualstudio.com

Turbo Console Log

Turbo Console Log

✨ Turbo Console Log extension automatically adds meaningful console.log statements to your code, which can be a huge time-saver during debugging.

🔹Link 👉 marketplace.visualstudio.com

Quokka.js

Quokka.js

✨ Quokka.js is a developer productivity tool for rapid JavaScript / TypeScript prototyping. Runtime values are updated and displayed in your IDE next to your code, as you type.

🔹Link 👉 marketplace.visualstudio.com

Project Manager

Project Manager

✨ Project Manager lets you easily switch between different projects in VS Code, make it a quick way to manage and navigate multiple projects.

🔹Link 👉 marketplace.visualstudio.com

Todo Tree

Todo Tree

✨ Todo Tree extension scans your code for comment tags like TODO and FIXME, and displays them in a tree view in the activity bar.

🔹Link 👉 marketplace.visualstudio.com

TabNine

TabNine

✨ TabNine is an AI-powered code completion extension that supports multiple programming language, it offers intelligent code suggestions, real-time code completions, chat, and code generation for you.

🔹Link 👉 marketplace.visualstudio.com

Better Comments

Better Comments

✨ Better Comments extension helps you create or write more human-friendly comments in your code. It allows you to categorize your annotations into alerts, queries, todos, and more with different colors.

🔹Link 👉 marketplace.visualstudio.com

Polacode

Polacode

✨ Polacode is a stylish code screenshot tool that allows you to create beautiful screenshots of your code directly from VS Code.

🔹Link 👉 marketplace.visualstudio.com

REST Client

REST Client

✨ REST Client allows you to send HTTP requests and view the response directly within VS Code, making it easier to test and debug APIs.

🔹Link 👉 marketplace.visualstudio.com

HTML CSS Support

HTML CSS Support

✨ HTML CSS Support provides CSS class and id name completion for the HTML class attribute based on the CSS files in your workspace.

🔹Link 👉 marketplace.visualstudio.com

GitLens

GitLens

✨ GitLens extension supercharges the built-in Git capabilities of VS Code. It helps you visualize code authorship, seamlessly navigate and explore Git repositories, and gain insights into your code.

🔹Link 👉 marketplace.visualstudio.com

WakaTime

WakaTime

✨ WakaTime extension provides automatic time tracking for your coding activities. It gives you insights into your coding habits and helps you manage your time more effectively.

🔹Link 👉 marketplace.visualstudio.com

Bookmarks

Bookmarks

✨ Bookmarks extension helps you to navigate in your code, moving between important positions easily and quickly. No more need to search for code. It also supports a set of selection commands, which allows you to select bookmarked lines and regions between bookmarked lines. It's really useful for log file analysis.

🔹Link 👉 marketplace.visualstudio.com

PlantUML

PlantUML

✨ PlantUML extension allows you to create UML diagrams from plain text descriptions, making it easy to visualize and document your system design.

🔹Link 👉 marketplace.visualstudio.com

Trailing Spaces

Trailing Spaces

✨ Trailing Spaces extension highlights and removes trailing whitespace in your code automatically, it helps to keep your code clean and consistent.

🔹Link 👉 marketplace.visualstudio.com

That's it for this post. Thank you for reading💖

Let me know which one you use the most or any other helpful extension in the comments👇

Find Me on 👉 X GitHub

Top comments (42)

Collapse
 
powersagitar profile image
powersagitar

Btw trailing spaces is now built in

Collapse
 
powersagitar profile image
powersagitar

There's an option to display white spaces and another to trim trailing ones

Collapse
 
dev_kiran profile image
Kiran Naragund

Oh!
Thanks for sharing :)

Collapse
 
xi_sharky_ix profile image
shArky

For those looking for the settings key: editor.renderWhitespace.

Collapse
 
dev_kiran profile image
Kiran Naragund

Thanks for sharing

Collapse
 
powersagitar profile image
powersagitar

Thank you and yes, the setting for trimming trailing white spaces is files.trimTrailingWhitespace.

Collapse
 
anhphan2024 profile image
anhphan

great collection bro !

Collapse
 
dev_kiran profile image
Kiran Naragund

Thank you :)

Collapse
 
johnmusings profile image
John • Edited

Awesome extensions dude!

Collapse
 
dev_kiran profile image
Kiran Naragund

Thank you :)

Collapse
 
aloisseckar profile image
Alois Sečkár

Gonna give a try to Codiumate. Looks promissing

Collapse
 
dev_kiran profile image
Kiran Naragund

Glad to hear that :)
Codiumate is definitely worth a try..

Collapse
 
owusua22 profile image
Sarah Nkansah

Thank u

Collapse
 
dev_kiran profile image
Kiran Naragund

You're welcome!

Collapse
 
yashwanth_rgowda profile image
Yashwanth R Gowda

Nice post!
Haven’t used codiumate but its in my bucket list.

Collapse
 
dev_kiran profile image
Kiran Naragund

Thanks :)
Codiumate is a great extension. Please check it out.

Collapse
 
prajwalys2001 profile image
Prajwal

Great Collection.

Collapse
 
dev_kiran profile image
Kiran Naragund

Thanks :)

Collapse
 
codienick profile image
CodewithNick

I use tabnine and it's extremely helpful

Collapse
 
dev_kiran profile image
Kiran Naragund

Yes, I also use tabnine its awesome.

Collapse
 
hantsy profile image
Hantsy Bai

But the free plan is very limited. Till now I think Github Copilet is the King.

Thread Thread
 
dev_kiran profile image
Kiran Naragund

Yes, GitHub Copilot is also good.

Collapse
 
codecruncher86 profile image
Chris Newton

Great list! Thanks for sharing!

Collapse
 
dev_kiran profile image
Kiran Naragund

You're welcome
Thanks for reading

Collapse
 
craiginscotland profile image
craig mcinne

cant live without REST Client. Especially the variables makes it indispensable.

Collapse
 
dev_kiran profile image
Kiran Naragund

😦🙏

Some comments may only be visible to logged-in visitors. Sign in to view all comments.