VSCode extensions that you need [Webdevs]🚀🔧

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • Appwrite - The open-source backend cloud platform
  • Sonar - Write Clean JavaScript Code. Always.
  • InfluxDB - Collect and Analyze Billions of Data Points in Real Time
  • Onboard AI - Learn any GitHub repo in 59 seconds
  • Revelo Payroll - Free Global Payroll designed for tech teams
  • vscode-wrap-console-log

    Visual Studio Code extension for fast console.log:ing

    3. Wrap Console

  • vscode-docthis

    JSDoc generator extension for Visual Studio Code. (by oouo-diogo-perdigao)

    4. Document this

  • Appwrite

    Appwrite - The open-source backend cloud platform. The open-source backend cloud platform for developing Web, Mobile, and Flutter applications. You can set up your backend faster with real-time APIs for authentication, databases, file storage, cloud functions, and much more!

  • template-string-converter

    Autocorrect from quotes to backticks

    5. Template string converter

  • vscode-react-javascript-snippets

    Extension for React/Javascript snippets with search supporting ES7+ and babel features

    6. ES7 React/Redux/React-Native/JS snippets

  • vscode-drawio

    This unofficial extension integrates Draw.io (also known as diagrams.net) into VS Code.

    7. Draw.io integration

  • vscode-error-lens

    VSCode extension that enhances display of errors and warnings.

    8. Error lens

  • PathIntellisense

    Visual Studio Code plugin that autocompletes filenames

    9. Path Intellisense

  • Sonar

    Write Clean JavaScript Code. Always.. Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.

  • vscode-indent-rainbow

    Extension which shows indentation with a faint rainbow colored background to make them more readable

    10. Indent Rainbow

  • todo-tree

    Use ripgrep to find TODO tags and display the results in a tree view

    11. Todo tree

  • HTML-CSS-Class-Completion

    :chocolate_bar: Visual Studio Code extension that provides CSS class name completion for the HTML class attribute based on the CSS files in your workspace

    12. IntelliSense for CSS class names in HTML

  • vscode-styled-components

    Syntax highlighting for styled-components

    13. Styled components

  • vscode-emojisense

    Emoji Autocomplete Plugin For VSCode

    14. :emojisense:

  • vscode-spell-checker

    A simple source code spell checker for code

    15. Code Spell Checker

  • vscode-ext-color-highlight

    Extension adds colored border around css/web colors in the editor

    16. Color Highlight

  • vscode-auto-rename-tag

    Automatically rename paired HTML/XML tag

    17. Auto Rename Tag

  • vscode-sqltools

    Database management for VSCode

    18. SQL Tools

  • vscode

    Connect to MongoDB and Atlas and directly from your VS Code environment, navigate your databases and collections, inspect your schema and use playgrounds to prototype queries and aggregations. (by mongodb-js)

    19. MongoDB for VS Code

  • vscode-regex

    20. Regex Previewer

  • InfluxDB

    Collect and Analyze Billions of Data Points in Real Time. Manage all types of time series data in a single, purpose-built database. Run at any scale in any environment in the cloud, on-premises, or at the edge.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts