Skip to content

Instantly share code, notes, and snippets.

@fmoliveira

fmoliveira/VS Code Extensions.md

Last active June 12, 2020 09:35
Show Gist options
  • Save fmoliveira/73a9a6fd9e1d439c741cc49724bd4bcc to your computer and use it in GitHub Desktop.
Save fmoliveira/73a9a6fd9e1d439c741cc49724bd4bcc to your computer and use it in GitHub Desktop.
Download ZIP
Extensive Research on VS Code Marketplace for extensions that can make us more productive
Raw
VS Code Extensions.md
  • Researched on 05/20/2020
    • Total Extensions Seen
      • Featured: 12
      • Trending: 36
      • Most Popular: 1026
      • Total: 1074 extensions seen manually on the VS Code Marketplace
    • Pre-selected
      • 83 extensions + some themes and a few icon sets
      • Complete list removed from this file for brevity
    • Triaged
      • 28 extensions from the 83 above
      • Full list of triaged extensions available below, including some suggestions of themes and icon sets if you'd like
    • Hand-picked
      • 8 most useful extensions from the 28 triaged above
      • See this list in the next line
  • Hand-picked extensions
    • CodeStream.codestream: Discuss code just like commenting on a Google Doc
    • lostintangent.vsls-whiteboard: Adds a real-time collaborative whiteboard to Visual Studio Live Share sessions
    • kisstkondoros.vscode-codemetrics: Computes complexity in TypeScript/JavaScript and provide automatic feedback on where code needs to be refactored. Potentially saves code review time and can be customized to team preferences.
    • liamhammett.inline-parameters: Display annotations with names of inline parameters.
    • wayou.vscode-todo-highlight: Highlights TODOs, FIXMEs, and any customizable keywords annotations. Useful to highlight tech debt to call us out to solve them as soon as possible (we already have a handful of TODO comments in the code).
    • wix.vscode-import-cost: Display import sizes in the editor. Useful to make developers mindful when installing new third-party packages. Also good to check out Bundlephobia.com.
    • Prisma.vscode-graphql: Add syntax highlighting, validation against schema, autocomplete suggestions go to definition, snippets, and other useful goodies.
    • hediet.vscode-drawio: Integrates an offline version of Draw.io into VS Code. Great for improving documentations with diagrams.
  • Triaged Extensions
    • CSS/SCSS
      • kamikillerto.vscode-colorize: Displays colors in CSS and TS files.
      • jpoissonnier.vscode-styled-components: Syntax highlighting for styled-components.
    • Collaboration
      • CodeStream.codestream: Discuss code just like commenting on a Google Doc
      • lostintangent.vsls-whiteboard: Adds a real-time collaborative whiteboard to Visual Studio Live Share sessions
      • hbenl.vscode-test-explorer-liveshare: Use the Test Explorer in your Visual Studio Live Share sessions
    • Debugging
      • msjsdiag.debugger-for-chrome: Debug your JavaScript code in the Chrome browser, or any other target that supports the Chrome Debugger
      • firefox-devtools.vscode-firefox-debug: Debug your web application or browser extension in Firefox
    • GitHub
      • eamodio.gitlens: GitLens helps you to visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more.
      • mhutchie.git-graph: View a Git Graph of your repository, and perform Git actions from the graph.
    • Remote
      • ms-vscode-remote.remote-containers: Open any folder inside a container right from VS Code. Might be handy for debug sessions with Docker.
      • ms-vscode-remote.remote-ssh: Open any folder from a remote machine using SSH right from VS Code. Might be handy for debugging production.
    • Productivity
      • Shan.code-settings-sync: Synchronize Settings, Snippets, Themes, File Icons, Launch, Keybindings, Workspaces and Extensions to your own GitHub using a private gist. Easily restore your settings when configuring a new machine.
      • CoenraadS.bracket-pair-colorizer-2: Colorize matching brackets to make it easier to identify them.
      • alefragnani.Bookmarks: Mark lines and jump to them. Make it easier to navigate in the same file when you're working on several different points of one, so that you don't need to keep scrolling back and forth and remembering where you were.
      • mechatroner.rainbow-csv: Highlight CSV files in different colors for a better reading experience, and allow running queries in SQL-like language to explore big data files.
      • vincaslt.highlight-matching-tag: Highlights matching opening and closing tags in a way that's easier to visualize than what VS Code does natively.
      • kisstkondoros.vscode-codemetrics: Computes complexity in TypeScript/JavaScript and provide automatic feedback on where code needs to be refactored.
      • SirTori.indenticator: Highlights your current indent depth.
      • liamhammett.inline-parameters: Display annotations with names of inline parameters.
    • React Native
      • msjsdiag.vscode-react-native: Adds react-native debug targets to VS Code as well as react-native commands to the command palette.
    • Editing Extras
      • wayou.vscode-todo-highlight: Highlights TODOs, FIXMEs, and any customizable keywords annotations. Useful to highlight tech debt to call us out to solve them as soon as possible (we already have a handful of TODO comments in the code).
      • wix.vscode-import-cost: Display import sizes in the editor. Useful to make developers mindful when installing new third-party packages. Also good to check out Bundlephobia.com.
      • IBM.output-colorizer: Syntax highlighting for log files.
    • Database
      • formulahendry.vscode-mysql: Integrated database management tool for MySQL.
    • GraphQL
      • Prisma.vscode-graphql: Add syntax highlighting, validation against schema, autocomplete suggestions go to definition, snippets, and other useful goodies.
    • Testing
      • hbenl.vscode-test-explorer: Run your tests in the sidebar of VS Code.
    • Markdown
      • AlanWalk.markdown-toc: Adds and updates table of contents to Markdown files.
    • Diagramming
      • hediet.vscode-drawio: Integrates an offline version of Draw.io into VS Code. Great for improving documentations with diagrams.
  • Themes
    • sallar.vscode-duotone-dark
    • seansassenrath.vscode-theme-superonedark
    • RobbOwen.synthwave-vscode
    • Nimda.deepdark-material
    • SS.cyberpunk
    • sldobri.bunker
    • uloco.theme-bluloco-dark
    • gerane.Theme-Dracula
    • taniarascia.new-moon-vscode
    • comemteer.spacemacs
    • bernardodsanderson.theme-material-neutral
    • Sujan.code-blue
    • Yummygum.city-lights-icon-vsc
    • hedinne.popping-and-locking-vscode
    • GitHub.github-vscode-theme
  • Icon Sets
    • PKief.material-icon-theme: Adds prettier icons to many file types in VS Code.
    • vscode-icons-team.vscode-icons
    • file-icons.file-icons
    • davidbabel.vscode-simpler-icons
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment