Open In App

Top 10 Extensions for ReactJS in VSCode

Improve
Improve
Like Article
Like
Save
Share
Report

To make your development quicker and life easier, install a number of the Visual Studio Extensions that square measure outlined below and create your development a lot of and a lot of power tools than the alternative.

Top 10 Extensions for ReactJs in VSCode are:

  • The Bracket Pair Colorizer extension. (Deprecated)
  • The change-case extension.
  • The Code Spell Checker extension.
  • The Duplicate Selection extension.
  • The EditorConfig for VS Code extension.
  • The VSCode React Refactor extension.
  • The npm Intellisense extension.
  • The ESLint extension.
  • The ES7 React/Redux/GraphQL/React-Native snippets extension.
  • The Prettier – Code formatted extension.

Bracket Pair Colorizer: This extension permits matching brackets to be known with colors. The user will outline the characters to match, and which colors to use. The main aim of this extension is to allow the matching brackets to be identified with colors. Bracket Pair Colorizer is deprecated as this functionality is now built-in to VS Code. So no need to install separately.

change-case: It is a wrapper around node-change-case for Visual Studio Code. The main job is to quickly modify the case of this choice or current word. It also works with multiple cursors.

Code Spell Checker: It is a basic spell checker that works well with the camelCase code. It basically assists in catching the common spelling errors whereas keeping the number of false positives low.

Duplicate Selection: This extension brings Sublime-like duplication of designated text, it duplicates it inline, and not during a printing operation, just like the default behavior of VSCode.

EditorConfig for VS Code: This extension brings the EditorConfig and .editorconfig support to our VSCode. This plugin aims to override user or workspace settings with settings that are found in .editorconfig files.

VSCode React Refactor: This simple extension provides the refactor code actions for React developers. IT extracts the JSX element to file or function. It also supports the TypeScript and TSX syntax. This extension works well with the classes, functions, and arrow functions.

npm Intellisense: This is a plugin that will auto-complete all the npm modules import statements. All imports for npm modules get automatically handled by this extension.

ESLint: It integrates the ESLint into your VS Code system. The ESLint statically analyzes your code in order to quickly find problems.

ES7 React/Redux/GraphQL/React-Native snippets: This extension helps in providing the JavaScript and React/Redux related snippets in ES7 with Babel plugin options for your VS Code.

Prettier – Code formatter: It is a code formatted. This VS Code package is used to format your JavaScript/matter/CSS exploitation is prettier. It basically parses your code and re-printing it with its own rules.


Last Updated : 06 Jan, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads