Why Visual Studio Code is My Preferred Code Editor as a React Developer

Kelzang Ugyen Dorji
2 min readJan 3, 2024

--

VS Code and Extensions

Visual Studio Code

It is an open-source, lightweight but powerful source code editor which is available multiple platform such as Windows, macOS and Linux. It has built-in support for JavaScript, TypeScript and Node.js and has a rich ecosystem of extensions for other languages and runtimes (such as C++, C#, Java, Python, PHP, Go, .NET).

VS Code Screen Shot(src: https://code.visualstudio.com/assets/home/home-screenshot-win.png)

Download Link: https://code.visualstudio.com/

As a React Developer, following Extensions help speed up task:

1. Auto Rename Tag

It automatically renames paired HTML/XML tag.

2. ES7 React/Redux/GraphQL/React-Native snippets.

It provides you JavaScript and React/Redux snippets in ES7 with Babel plugin features for VS Code.

3. Html to JSX

It converts html text to JSX string.

4. Inline fold

It mimics VS Code’s folding experience for inline code and is especially useful when working with frameworks like Tailwind CSS which use lots of utility classes that often disfigure code visual structure.

5. JavaScript (ES6) code snippets

It contains code snippets for JavaScript in ES6 syntax for VS Code editor (supports both JavaScript and TypeScript).

6. Prettier — Code formatter

It is an opinionated code formatter that 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.

7. Tailwind CSS IntelliSense

It provides users with advanced features such as autocomplete, syntax highlighting, and linting.

--

--