My visual studio code settings with some cool 2019 extensions

Here is a list of some cool 2019 Visual Studio Code extensions that I personally love.

I also shared my editor settings, they can help you write faster and cleaner code.

If you know other awesome extensions let me know. Enjoy!

JavaScript Extensions

Babel ES6/ES7

Adds JS Babel es6/es7 syntax coloring

css2react

Convert the current selection between CSS and React’s inline style
syntax.

ES7 React/Redux/GraphQL/React-Native snippets

Simple extensions for React, Redux and Graphql in JS/TS with ES7 syntax

ESLint

Integrates ESLint JavaScript into VS Code.

Import Cost

Display import/require package size in the editor

React Pure To Class

Convert pure react components to class components

Prettier – Code formatter

VS Code plugin for prettier/prettier

HTML Extensions

Highlight Matching Tag

Highlights matching closing or opening tag

Live Server

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

Utilities Extensions

Bookmarks

Mark lines and jump to them

Bracket Pair Colorizer

A customizable extension for colorizing matching brackets

Code Runner

Run code snippet or code file for multiple languages

File Utils

A convenient way of creating, duplicating, moving, renaming and deleting
files and directories.

GitLens — Git supercharged

A convenient way of creating, duplicating, moving, renaming and deleting
files and directories.

indent-rainbow

Makes indentation easier to read

WakaTime

Metrics, insights, and time tracking automatically generated from your
programming activity.

VSCode Great Icons

A big pack of icons (100+) for your files.

Version Lens

Shows the latest version for each package using code lens

jumpy

Jumpy provides fast cursor movement, inspired by Atom’s package of the
same name.

{
      // show snippet suggestions on top of others
      "editor.snippetSuggestions": "top",
      // disable format on paste
      "editor.formatOnPaste": false,
      // awesome free monospaced font https://github.com/tonsky/FiraCode
      "editor.fontFamily": "Fira Code",
      "terminal.integrated.fontFamily": "Fira Code",
      // semicolon at the end of the line 
      "prettier.semi": false,
      // enable html emmet inside javascript files 
      "emmet.includeLanguages": {
        "javascript": "html"
      },
      "editor.formatOnSave": true,
      "editor.fontLigatures": true,
      // hide minimap
      "editor.minimap.enabled": false,
      "explorer.openEditors.visible": 5,
      "editor.cursorWidth": 3,
      "editor.quickSuggestionsDelay": 0,
      "workbench.statusBar.feedback.visible": false,
      "breadcrumbs.enabled": true
    }