dotfiles/vs-code-extensions-i-use.md

Here are a list of all the extensions I use. This is an ever-changing setup, so if you saw me use something in a video or screenshot, it might be in this list!

| ×××××× |  |
| --- | --- |
| <a href="https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag"><img width="100" src="https://open-vsx.org/vscode/asset/formulahendry/auto-rename-tag/0.1.10/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Auto Rename Tag"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag">Auto Rename Tag</a></h3>Auto rename paired HTML/XML tag |
| <a href="https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments"><img width="100" src="https://open-vsx.org/vscode/asset/aaron-bond/better-comments/3.0.2/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Better Comments"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments">Better Comments</a></h3>Improve your code commenting by annotating with alert, informational, TODOs, and more! |
| <a href="https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker"><img width="100" src="https://open-vsx.org/vscode/asset/streetsidesoftware/code-spell-checker/3.0.1/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Code Spell Checker"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker">Code Spell Checker</a></h3>Spelling checker for source code |
| <a href="https://marketplace.visualstudio.com/items?itemName=codeium.codeium"><img width="100" src="https://open-vsx.org/vscode/asset/Codeium/codeium/1.4.20/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Codeium: AI Coding Autocomplete and Chat for Python, Javascript, Typescript, Java, Go, and more"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=codeium.codeium">Codeium: AI Coding Autocomplete and Chat for Python, Javascript, Typescript, Java, Go, and more</a></h3>The modern coding superpower: free AI code acceleration plugin for your favorite languages. Type less. Code more. Ship faster. |
| <a href="https://marketplace.visualstudio.com/items?itemName=kamikillerto.vscode-colorize"><img width="100" src="https://open-vsx.org/vscode/asset/kamikillerto/vscode-colorize/0.11.1/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="colorize"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=kamikillerto.vscode-colorize">colorize</a></h3>A vscode extension to help visualize css colors in files. |
| <a href="https://marketplace.visualstudio.com/items?itemName=vivaxy.vscode-conventional-commits"><img width="100" src="https://open-vsx.org/vscode/asset/vivaxy/vscode-conventional-commits/1.25.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Conventional Commits"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=vivaxy.vscode-conventional-commits">Conventional Commits</a></h3>💬Conventional Commits for VSCode. |
| <a href="https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-docker"><img width="100" src="https://open-vsx.org/vscode/asset/ms-azuretools/vscode-docker/1.28.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Docker"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-docker">Docker</a></h3>Makes it easy to create, manage, and debug containerized applications. |
| <a href="https://marketplace.visualstudio.com/items?itemName=mikestead.dotenv"><img width="100" src="https://open-vsx.org/vscode/asset/mikestead/dotenv/1.0.1/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="DotENV"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=mikestead.dotenv">DotENV</a></h3>Support for dotenv file syntax |
| <a href="https://marketplace.visualstudio.com/items?itemName=inu1255.easy-snippet"><img width="100" src="https://cdn.vsassets.io/v/M213_20221206.3/_content/Header/default_icon_128.png" alt="Easy Snippet"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=inu1255.easy-snippet">Easy Snippet</a></h3>Turn your selection into a snippet |
| <a href="https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint"><img width="100" src="https://open-vsx.org/vscode/asset/dbaeumer/vscode-eslint/2.4.2/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="ESLint"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint">ESLint</a></h3>Integrates ESLint JavaScript into VS Code. |
| <a href="https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory"><img width="100" src="https://open-vsx.org/vscode/asset/donjayamanne/githistory/0.6.20/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Git History"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory">Git History</a></h3>View git log, file history, compare branches or commits |
| <a href="https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost"><img width="100" src="https://open-vsx.org/vscode/asset/wix/vscode-import-cost/3.3.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Import Cost"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost">Import Cost</a></h3>Display import/require package size in the editor |
| <a href="https://marketplace.visualstudio.com/items?itemName=leveluptutorials.theme-levelup"><img width="100" src="https://cdn.vsassets.io/v/M213_20221206.3/_content/Header/default_icon_128.png" alt="Level Up Theme Official"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=leveluptutorials.theme-levelup">Level Up Theme Official</a></h3>➕ Official theme of Level Up Tutorials ➕ |
| <a href="https://marketplace.visualstudio.com/items?itemName=pkief.material-icon-theme"><img width="100" src="https://open-vsx.org/vscode/asset/PKief/material-icon-theme/4.32.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Material Icon Theme"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=pkief.material-icon-theme">Material Icon Theme</a></h3>Material Design Icons for Visual Studio Code |
| <a href="https://marketplace.visualstudio.com/items?itemName=unifiedjs.vscode-mdx"><img width="100" src="https://open-vsx.org/vscode/asset/unifiedjs/vscode-mdx/1.5.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="MDX"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=unifiedjs.vscode-mdx">MDX</a></h3>Language support for MDX |
| <a href="https://marketplace.visualstudio.com/items?itemName=christian-kohler.npm-intellisense"><img width="100" src="https://open-vsx.org/vscode/asset/christian-kohler/npm-intellisense/1.4.5/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="npm Intellisense"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=christian-kohler.npm-intellisense">npm Intellisense</a></h3>Visual Studio Code plugin that autocompletes npm modules in import statements |
| <a href="https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense"><img width="100" src="https://open-vsx.org/vscode/asset/christian-kohler/path-intellisense/2.8.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Path Intellisense"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense">Path Intellisense</a></h3>Visual Studio Code plugin that autocompletes filenames |
| <a href="https://marketplace.visualstudio.com/items?itemName=vunguyentuan.vscode-postcss"><img width="100" src="https://open-vsx.org/vscode/asset/vunguyentuan/vscode-postcss/2.0.2/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="PostCSS Intellisense and Highlighting"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=vunguyentuan.vscode-postcss">PostCSS Intellisense and Highlighting</a></h3>Syntax highlighting and intellisense for PostCSS |
| <a href="https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode"><img width="100" src="https://open-vsx.org/vscode/asset/esbenp/prettier-vscode/10.1.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Prettier - Code formatter"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode">Prettier - Code formatter</a></h3>Code formatter using prettier |
| <a href="https://marketplace.visualstudio.com/items?itemName=yoavbls.pretty-ts-errors"><img width="100" src="https://open-vsx.org/vscode/asset/yoavbls/pretty-ts-errors/0.2.8/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Pretty TypeScript Errors"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=yoavbls.pretty-ts-errors">Pretty TypeScript Errors</a></h3>Make TypeScript errors prettier and more human-readable in VSCode |
| <a href="https://marketplace.visualstudio.com/items?itemName=prisma.prisma"><img width="100" src="https://open-vsx.org/vscode/asset/Prisma/prisma/5.6.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Prisma"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=prisma.prisma">Prisma</a></h3>Adds syntax highlighting, formatting, auto-completion, jump-to-definition and linting for .prisma files. |
| <a href="https://marketplace.visualstudio.com/items?itemName=fivethree.vscode-svelte-snippets"><img width="100" src="https://open-vsx.org/vscode/asset/fivethree/vscode-svelte-snippets/0.5.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Svelte 3 Snippets"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=fivethree.vscode-svelte-snippets">Svelte 3 Snippets</a></h3>Svelte 3 Snippets for VS Code |
| <a href="https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode"><img width="100" src="https://open-vsx.org/vscode/asset/svelte/svelte-vscode/108.1.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Svelte for VS Code"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode">Svelte for VS Code</a></h3>Svelte language support for VS Code |
| <a href="https://marketplace.visualstudio.com/items?itemName=bewinxed.svelte-matey"><img width="100" src="https://cdn.vsassets.io/v/M213_20221206.3/_content/Header/default_icon_128.png" alt="svelte-matey"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=bewinxed.svelte-matey">svelte-matey</a></h3>Effortless Sveltekit Navigation & Tools! |
| <a href="https://marketplace.visualstudio.com/items?itemName=robbowen.synthwave-vscode"><img width="100" src="https://open-vsx.org/vscode/asset/RobbOwen/synthwave-vscode/0.1.15/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="SynthWave '84"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=robbowen.synthwave-vscode">SynthWave '84</a></h3>A Synthwave-inspired colour theme to satisfy your neon dreams |
| <a href="https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss"><img width="100" src="https://open-vsx.org/vscode/asset/bradlc/vscode-tailwindcss/0.10.2/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Tailwind CSS IntelliSense"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss">Tailwind CSS IntelliSense</a></h3>Intelligent Tailwind CSS tooling for VS Code |
| <a href="https://marketplace.visualstudio.com/items?itemName=meganrogge.template-string-converter"><img width="100" src="https://open-vsx.org/vscode/asset/meganrogge/template-string-converter/0.5.9/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Template String Converter"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=meganrogge.template-string-converter">Template String Converter</a></h3>Converts a string to a template string when ${ is typed |
| <a href="https://marketplace.visualstudio.com/items?itemName=rangav.vscode-thunder-client"><img width="100" src="https://open-vsx.org/vscode/asset/rangav/vscode-thunder-client/2.16.2/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Thunder Client"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=rangav.vscode-thunder-client">Thunder Client</a></h3>Lightweight Rest API Client for VS Code |
| <a href="https://marketplace.visualstudio.com/items?itemName=gruntfuggly.todo-tree"><img width="100" src="https://open-vsx.org/vscode/asset/Gruntfuggly/todo-tree/0.0.215/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="Todo Tree"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=gruntfuggly.todo-tree">Todo Tree</a></h3>Show TODO, FIXME, etc. comment tags in a tree view |
| <a href="https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons"><img width="100" src="https://open-vsx.org/vscode/asset/vscode-icons-team/vscode-icons/12.6.0/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="vscode-icons"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons">vscode-icons</a></h3>Icons for Visual Studio Code |
| <a href="https://marketplace.visualstudio.com/items?itemName=styled-components.vscode-styled-components"><img width="100" src="https://open-vsx.org/vscode/asset/styled-components/vscode-styled-components/1.7.8/Microsoft.VisualStudio.Services.Icons.Default?targetPlatform=universal" alt="vscode-styled-components"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=styled-components.vscode-styled-components">vscode-styled-components</a></h3>Syntax highlighting for styled-components |
| <a href="https://marketplace.visualstudio.com/items?itemName=wooodhead.vscode-wrap-console-log-simple"><img width="100" src="https://cdn.vsassets.io/v/M213_20221206.3/_content/Header/default_icon_128.png" alt="Wrap Console Log Simple"> | <h3><a href="https://marketplace.visualstudio.com/items?itemName=wooodhead.vscode-wrap-console-log-simple">Wrap Console Log Simple</a></h3>Wrap to console.log(or any function name) by word or selection |