Front-End React Pack

Package that includes the most updated extensions for a React Front-End to start throwing code with higher quality and speed.

Extensions Included

VS Code ES7+ React/Redux/React-Native/JS snippets

JavaScript and React/Redux snippets in ES7+ with Babel plugin features for VS Code

Simple React Snippets

The essential collection of React Snippets and commands. example

React Native Tools

This VS Code extension provides a development environment for React Native projects. Using this extension, you can debug your code and quickly run react-native commands from the command palette.

ReacTree

ReacTree is a VS Code extension which visualizes the component hierarchy within a React application, enabling developers to quickly identify the relationships between components.

JavaScript (ES6) code snippets

This extension contains code snippets for JavaScript in ES6 syntax for Vs Code editor (supports both JavaScript and TypeScript).

JavaScript and TypeScript Nightly

VS Code extension that enables the nightly build of TypeScript (typescript@next) as VS Code's built-in TypeScript version used to power JavaScript and TypeScript IntelliSense.

Babel JavaScript

JavaScript syntax highlighting for ES201x, React JSX, Flow and GraphQL. I highly recommend using this syntax highlighting with a theme that supports it.

HTML Boilerplate

This extension provides the standard HTML boilerplate code used in all web applications.

HTML CSS Support

HTML id and class attribute completion for Visual Studio Code.

Sass

Indented Sass syntax highlighting, autocomplete & Formatter for VSCode

Live Sass Compiler

Compile Sass or Scss to CSS at realtime with live browser reload.

Styled Components

The styled-components extension adds highlighting and IntelliSense for styled-component template strings in JavaScript and TypeScript.

Live Server

Launch a local development server with live reload feature for static & dynamic pages.

Auto Rename Tag

Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.

ESLint

Integrate ESLint in VSCode and check js code format.

Prettier

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.

Error Lens

ErrorLens turbo-charges language diagnostic features by making diagnostics stand out more prominently, highlighting the entire line wherever a diagnostic is generated by the language and also prints the message inline.

Path Intellisense

Visual Studio Code plugin that autocompletes filenames.

Npm Intellisense

Visual Studio Code plugin that autocompletes npm modules in import statements.

Import Cost

This extension will display inline in the editor the size of the imported package. The extension utilizes webpack in order to detect the imported size.

SVG

A Powerful SVG Language Support Extension. Almost all the features you need to handle SVG.

Want to see your extension added here?

There will be a PR and I would check its extension