VS Code hints

Hints.md

Some useful hints for developing react apps

Extensions and IDE

Most developers I know prefer to use Visual Studio Code, but some preffer Jetbrains Webstorm, which is also a good option.

For VSCode, some useful extensions are:

• auto close tag formulahendry.auto-close-tag
• auto import - ES6 & TS moppitz.vscode-extension-auto-import
• bracket pair colorizer coenraads.bracket-pair-colorizer
• ESLint - linting dbaeumer.vscode-eslint
• Prettier - prettier
• GitLens - very good GIT integration, shows inline history eamodio.gitlens
• Markdown Preview Enhanced shd101wyy.markdown-preview-enhanced
• Reactjs code snippets - emmet style shortcuts for creating react components xabikos.reactsnippets

IDE configuration

You want a font like D2Coding or something with ligatures, enable those in VSCode by adding the folowing to your user settings.json.

  "editor.fontLigatures": true,
  "editor.autoIndent": true,

Good fonts that support ligatures:

• Cascadia Code
• Operator Mono
• D2Coding ligature

Enable auto formating and make your cursor blink too:

 "editor.formatOnType": true,
 "editor.cursorBlinking": "expand",