#RevTWIL: Visual Studio (VS) Code Extensions

At Revelry, we believe in sharing and learning from one another (beliefs that are rooted in our Core Values). Among the many things we do to encourage internal knowledge exchange is to have a different team member present at each week’s Engineering Meeting. These presentations don’t have to be lengthy, formal, or complicated; in fact, many are brief, but also powerful in that they teach our Revelers something new, inspire conversation, and encourage collaboration.

In the spirit of sharing, we share our This Week I Learned presentations (aka RevTWILs") here. We hope you find them helpful.

THIS WEEK: Front-end software developer Ross Garfield shares some of his favorite VS code extensions:

Productivity

GitLens - Visualize author contributions with git blame
GitHub Copilot - GitHub’s GPT-3 powered pairing partner (write unit tests, turn comments into functional code)
Better Comments - Categorize and differentiate annotations
Color Highlight - Preview colors via hex code highlighting
Live Share - Pair virtually, remote control access to codebase
Clipboard Manager - Store history of copied/cut items (Try Maccy - mac app)

Shortcuts

Open in Github… - Open current file in browser
Project Manager - Easily switch between repos
Auto Close Tag & Auto Rename Tag - Quickly manage html tags
Auto Add Brackets in String Interpolation - (Aptly named)

Formatting / Legibility

Prettier - “Opinionated” code formatter
indent-rainbow - Make indentations more readable
Error Lens - ID bugs more quickly with error highlighting
Code Spell Checker - ID typos faster
DotENV - Syntax highlighting for your .env

Elixir / Phoenix

ElixirLS - Code completion, debugging, formatting, etc.
Phoenix Framework - Syntax highlighting support for HEEx
Elixir Templates Formatter - Formats EEx files with htmlbeautifier
Elixir Mix Formatter - Mix format's elixir!

React / JavaScript / TypeScript

VS Code ES7 - React/Redux/React-Native/JS snippets
vscode-styled-components - Syntax highlighting