If you are a developer, you know that your editor can either speed up your workflow or slow you down. For me, Visual Studio Code has been a game-changer, a free powerful code editor by Microsoft. But what really makes it powerful are the extensions that customize it for your workflow.
Over the years, I have tried and tested countless extensions and narrowed down the ones that actually add value to my daily development tasks for WordPress themes and plugins.
In this post, I’ll share the 10 VS Code extensions I use regularly, why I use them, and how they can help you code faster, debug easier, and stay organized in your projects.
1. REST Client VS Code Extension
REST Client allows you to send HTTP request and view the response in Visual Studio Code directly.
- Send/Cancel/Rerun HTTP request in editor and view response in a separate pane with syntax highlight.
- Send GraphQL query and author GraphQL variables in editor.
2. Remote SSH VS Code Extension
The Remote - SSH extension lets you use any remote machine with a SSH server as your development environment. This can greatly simplify development and troubleshooting in a wide variety of situations.
3. ES7 React Redux GraphQL VS Code Extension
This extension provides you JavaScript and React/Redux snippets in ES7 with Babel plugin features for VS Code.
- Supported languages (file extensions)
- JavaScript (.js)
- JavaScript React (.jsx)
- TypeScript (.ts)
- TypeScript React (.tsx)
4. Prettier Code Formatter VS Code Extension
Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.
5. Peacock VS Code Extension
Subtly change the color of your Visual Studio Code workspace. Ideal when you have multiple VS Code instances, use VS Live Share, or use VS Code's Remote features, and you want to quickly identify your editor.
6. Markdown Preview Enhanced VS Code Extension
Markdown Preview Enhanced is an extension that provides you with many useful functionalities such as automatic scroll sync, math typesetting, mermaid, PlantUML, pandoc, PDF export, code chunk, presentation writer, etc.
7. Live Sass Compiler VS Code Extension
A VSCode Extension that help you to compile/transpile your SASS/SCSS files to CSS at real-time.
- Live SASS & SCSS compile.
- Customizable file location of exported CSS.
- Customizable exported CSS style (expanded, compressed).
- Customizable extension name (.css or .min.css).
- Quick status bar control.
- Exclude specific folders by settings.
✅ Read More: Setup live SASS compiler for visual studio code
8. GitHub CoPilot VS Code Extension
GitHub Copilot is an AI peer programming tool that helps you write code faster and smarter.
GitHub Copilot adapts to your unique needs allowing you to select the best model for your project, customize chat responses with custom instructions, and utilize agent mode for AI-powered, seamlessly integrated peer programming sessions.
9. Better Comments VS Code Extension
The Better Comments extension will help you create more human-friendly comments in your code.
With this extension, you will be able to categorise your annotations into:
- Queries
- Alerts
- Highlights
- TODOs
- Commented out code can also be styled to make it clear the code shouldn't be there
- Any other comment styles you'd like can be specified in the settings
10. Auto Rename Tag VS Code Extension
Automatically rename paired HTML/XML tag. When you rename one HTML/XML tag, automatically rename the paired HTML/XML tag.
These 10 VS Code extensions have become essential in my daily workflow, helping me stay productive, write cleaner code, and catch errors faster. If you haven’t tried some of these yet, I highly recommend adding them to your setup and seeing how they fit your workflow.
Do you have a favorite extension that you can’t live without? Drop a comment below or share your recommendations with me—I’d love to test them out!
