mirror of
https://github.com/koodiklinikka/resources.git
synced 2026-01-26 11:24:01 +00:00
docs: improve VS Code extensions list
- Improve VS Code extensions list - Improve Markdown syntax - Fix heading hierarchy (level 3 --> level 2) - Improve list readability
This commit is contained in:
Daniel Schildt
@@ -1,117 +1,146 @@
|
||||
---
|
||||
description: >-
|
||||
Koodiklinikalla käytiin keväällä 2022 suuri VS Code -extension -keskustelu.
|
||||
Koodiklinikalla käytiin keväällä 2022 suuri VS Code extensions -keskustelu.
|
||||
Tässä koosteena klinikkalaisten vinkit parhaaseen kokemukseen. Kiitos Petrille
|
||||
keskustelun avaamisesta!
|
||||
---
|
||||
|
||||
# VS Code -extensionit
|
||||
|
||||
### Koodin tyylittely ja muokkaus
|
||||
## Koodin tyylittely ja muokkaus
|
||||
|
||||
[Auto Rename Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag) - "Automatically rename paired HTML/XML tag, same as Visual Studio IDE does."
|
||||
### Code refactoring
|
||||
|
||||
[autoDocstring](https://marketplace.visualstudio.com/items?itemName=njpwerner.autodocstring) - "Visual Studio Code extension to quickly generate docstrings for python functions."
|
||||
- [Auto Rename Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag)
|
||||
- "Automatically rename paired HTML/XML tag, same as Visual Studio IDE does."
|
||||
- [change-case](https://marketplace.visualstudio.com/items?itemName=wmaurer.change-case)
|
||||
- "Quickly change the case (camelCase, CONSTANT\_CASE, snake\_case, etc) of the current selection or current word"
|
||||
- [Sort lines](https://marketplace.visualstudio.com/items?itemName=Tyriar.sort-lines)
|
||||
- "Sort lines of text in Visual Studio Code."
|
||||
|
||||
[Beautify](https://marketplace.visualstudio.com/items?itemName=HookyQR.beautify) - "Beautify `javascript`, `JSON`, `CSS`, `Sass`, and `HTML` in Visual Studio Code."
|
||||
### Code formatting
|
||||
|
||||
[Better Comments](https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments) - "The Better Comments extension will help you create more human-friendly comments in your code."
|
||||
- [Beautify](https://marketplace.visualstudio.com/items?itemName=HookyQR.beautify)
|
||||
- "Beautify `javascript`, `JSON`, `CSS`, `Sass`, and `HTML` in Visual Studio Code."
|
||||
- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
|
||||
- "Integrates ESLint JavaScript into VS Code."
|
||||
- [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
|
||||
- "Prettier is an opinionated code formatter."
|
||||
|
||||
[change-case](https://marketplace.visualstudio.com/items?itemName=wmaurer.change-case) - "Quickly change the case (camelCase, CONSTANT\_CASE, snake\_case, etc) of the current selection or current word"
|
||||
### Code linting
|
||||
|
||||
[Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - "A basic spell checker that works well with camelCase code."
|
||||
- [ShellCheck](https://marketplace.visualstudio.com/items?itemName=timonwong.shellcheck)
|
||||
- "Integrates ShellCheck into VS Code, a linter for Shell scripts."
|
||||
- [markdownlint](https://marketplace.visualstudio.com/items?itemName=DavidAnson.vscode-markdownlint)
|
||||
- checking Markdown structure
|
||||
|
||||
[ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) - "Integrates ESLint JavaScript into VS Code."
|
||||
### Code highlighting
|
||||
|
||||
[Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - "Prettier is an opinionated code formatter." 
|
||||
- [Trailing Spaces](https://marketplace.visualstudio.com/items?itemName=shardulm94.trailing-spaces)
|
||||
- "Highlight trailing spaces and delete them in a flash!"
|
||||
- [Better Comments](https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments)
|
||||
- "The Better Comments extension will help you create more human-friendly comments in your code."
|
||||
|
||||
[ShellCheck](https://marketplace.visualstudio.com/items?itemName=timonwong.shellcheck) - "Integrates ShellCheck into VS Code, a linter for Shell scripts."
|
||||
### Code comments generation
|
||||
|
||||
[Sort lines](https://marketplace.visualstudio.com/items?itemName=Tyriar.sort-lines) - "Sort lines of text in Visual Studio Code."
|
||||
- [Document This](https://marketplace.visualstudio.com/items?itemName=oouo-diogo-perdigao.docthis)
|
||||
- "Automatically generates detailed JSDoc comments in TypeScript and JavaScript files."
|
||||
- [autoDocstring](https://marketplace.visualstudio.com/items?itemName=njpwerner.autodocstring)
|
||||
- "Visual Studio Code extension to quickly generate docstrings for python functions."
|
||||
|
||||
[Trailing Spaces](https://marketplace.visualstudio.com/items?itemName=shardulm94.trailing-spaces) - "Highlight trailing spaces and delete them in a flash!"
|
||||
### Spell checkers
|
||||
|
||||
### Autocomplete
|
||||
- [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker)
|
||||
- "A basic spell checker that works well with camelCase code."
|
||||
- [Spell Right](https://marketplace.visualstudio.com/items?itemName=ban.spellright)
|
||||
- "Multilingual, Offline and Lightweight Spellchecker for Visual Studio Code"
|
||||
- Integration with a spell checker of the operating system
|
||||
|
||||
[GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - "GitHub Copilot is an AI pair programmer which suggests line completions and entire function bodies as you type."
|
||||
## Autocomplete
|
||||
|
||||
[Kite](https://marketplace.visualstudio.com/items?itemName=kiteco.kite) - "Kite is an AI-powered programming assistant that helps you write code faster inside Visual Studio Code." 
|
||||
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot)
|
||||
- "GitHub Copilot is an AI pair programmer which suggests line completions and entire function bodies as you type."
|
||||
- [Kite](https://marketplace.visualstudio.com/items?itemName=kiteco.kite)
|
||||
- "Kite is an AI-powered programming assistant that helps you write code faster inside Visual Studio Code."
|
||||
- [Path Intellisense](https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense)
|
||||
- "Visual Studio Code plugin that autocompletes filenames"
|
||||
- [Tailwind CSS IntelliSense](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss)
|
||||
- "Intelligent Tailwind CSS tooling for VS Code"
|
||||
- [Markdown All in One](https://marketplace.visualstudio.com/items?itemName=yzhang.markdown-all-in-one)
|
||||
- "All you need for Markdown (keyboard shortcuts, table of contents, auto preview and more)."
|
||||
|
||||
[Path Intellisense](https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense) - "Visual Studio Code plugin that autocompletes filenames"
|
||||
## Git
|
||||
|
||||
[Tailwind CSS IntelliSense](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss) - "Intelligent Tailwind CSS tooling for VS Code"
|
||||
- [Git History](https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory)
|
||||
- "View git log, file history, compare branches or commits"
|
||||
- [Git Graph](https://marketplace.visualstudio.com/items?itemName=mhutchie.git-graph)
|
||||
- "View a Git Graph of your repository, and perform Git actions from the graph."
|
||||
- [GitLens](https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens)
|
||||
- "GitLens supercharges Git inside VS Code and unlocks untapped knowledge within each repository"
|
||||
|
||||
[Markdown All in One](https://marketplace.visualstudio.com/items?itemName=yzhang.markdown-all-in-one) - "All you need for Markdown (keyboard shortcuts, table of contents, auto preview and more)."
|
||||
## Tyylilliset / visuaaliset laajennokset
|
||||
|
||||
### Git
|
||||
- [Bookmarks](https://marketplace.visualstudio.com/items?itemName=alefragnani.Bookmarks)
|
||||
- "Mark lines and jump to them."
|
||||
- [cursory-glance](https://marketplace.visualstudio.com/items?itemName=tuomassalo.cursory-glance)
|
||||
- "VSCode extension that highlights the cursors when there are more than of them."
|
||||
- [file-icons](https://marketplace.visualstudio.com/items?itemName=file-icons.file-icons)
|
||||
- "File-specific icons in VSCode for improved visual grepping." (_sidenote: set_ "workbench.tree.indent": 22 _for nicer look_)
|
||||
- [Gremlins tracker for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=nhoizey.gremlins)
|
||||
- "This Visual Studio Code extension reveals some characters that can be harmful because they are invisible or looking like legitimate ones."
|
||||
- [indent-rainbow](https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow)
|
||||
- "A simple extension to make indentation more readable."
|
||||
- [Inline Parameters for VSCode](https://marketplace.visualstudio.com/items?itemName=liamhammett.inline-parameters)
|
||||
- "An extension for Visual Studio Code that adds inline parameter annotations when calling a function."
|
||||
- [One Dark Pro](https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme)
|
||||
- "Atom‘s iconic One Dark theme for Visual Studio Code"
|
||||
- [Rainbow Brackets](https://marketplace.visualstudio.com/items?itemName=2gua.rainbow-brackets)
|
||||
- "Provide rainbow colors for the round brackets, the square brackets and the squiggly brackets."
|
||||
- [Render Line Endings](https://marketplace.visualstudio.com/items?itemName=medo64.render-crlf)
|
||||
- "Displays the line ending symbol and optionally extra whitespace when 'Render whitespace' is turned on."
|
||||
- [TODO Highlight v2](https://marketplace.visualstudio.com/items?itemName=jgclark.vscode-todo-highlight)
|
||||
- "Highlight TODO:, FIXME: and any other annotations you wish within your code in VSCode."
|
||||
- [Todo Tree](https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree)
|
||||
- "This extension quickly searches (using ripgrep) your workspace for comment tags like TODO and FIXME, and displays them in a tree view in the activity bar."
|
||||
- [WorkspaceSort](https://marketplace.visualstudio.com/items?itemName=iciclesoft.workspacesort)
|
||||
- "WorkspaceSort adds the ability to sort workspace-folders in the same way as files and inner-folders are sorted."
|
||||
|
||||
[Git History](https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory) - "View git log, file history, compare branches or commits"
|
||||
## Muiden työkalujen laajennokset
|
||||
|
||||
[Git Graph](https://marketplace.visualstudio.com/items?itemName=mhutchie.git-graph) - "View a Git Graph of your repository, and perform Git actions from the graph."
|
||||
|
||||
[GitLens](https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens) - "GitLens supercharges Git inside VS Code and unlocks untapped knowledge within each repository" 
|
||||
|
||||
### Tyylilliset / visuaaliset laajennokset
|
||||
|
||||
[Bookmarks](https://marketplace.visualstudio.com/items?itemName=alefragnani.Bookmarks) - "Mark lines and jump to them."
|
||||
|
||||
[cursory-glance](https://marketplace.visualstudio.com/items?itemName=tuomassalo.cursory-glance) - "VSCode extension that highlights the cursors when there are more than of them."
|
||||
|
||||
[file-icons](https://marketplace.visualstudio.com/items?itemName=file-icons.file-icons) - "File-specific icons in VSCode for improved visual grepping." (_sidenote: set_ "workbench.tree.indent": 22 _for nicer look_)
|
||||
|
||||
[Gremlins tracker for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=nhoizey.gremlins) - "This Visual Studio Code extension reveals some characters that can be harmful because they are invisible or looking like legitimate ones."
|
||||
|
||||
[indent-rainbow](https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow) - "A simple extension to make indentation more readable."
|
||||
|
||||
[Inline Parameters for VSCode](https://marketplace.visualstudio.com/items?itemName=liamhammett.inline-parameters) - "An extension for Visual Studio Code that adds inline parameter annotations when calling a function."
|
||||
|
||||
[One Dark Pro](https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme) - "Atom‘s iconic One Dark theme for Visual Studio Code"
|
||||
|
||||
[Rainbow Brackets](https://marketplace.visualstudio.com/items?itemName=2gua.rainbow-brackets) - "Provide rainbow colors for the round brackets, the square brackets and the squiggly brackets."
|
||||
|
||||
[Render Line Endings](https://marketplace.visualstudio.com/items?itemName=medo64.render-crlf) - "Displays the line ending symbol and optionally extra whitespace when 'Render whitespace' is turned on."
|
||||
|
||||
[TODO Highlight v2](https://marketplace.visualstudio.com/items?itemName=jgclark.vscode-todo-highlight) - "Highlight TODO:, FIXME: and any other annotations you wish within your code in VSCode." 
|
||||
|
||||
[Todo Tree](https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree) - "This extension quickly searches (using ripgrep) your workspace for comment tags like TODO and FIXME, and displays them in a tree view in the activity bar."
|
||||
|
||||
[WorkspaceSort](https://marketplace.visualstudio.com/items?itemName=iciclesoft.workspacesort) - "WorkspaceSort adds the ability to sort workspace-folders in the same way as files and inner-folders are sorted."
|
||||
|
||||
### Muiden työkalujen laajennokset
|
||||
|
||||
[AWS Toolkit](https://docs.aws.amazon.com/toolkit-for-vscode/latest/userguide/welcome.html) - "This extension makes it easier for developers to develop, debug locally, and deploy serverless applications that use Amazon Web Services (AWS)."
|
||||
|
||||
[Code::Stats](https://marketplace.visualstudio.com/items?itemName=riussi.code-stats-vscode) - "This is a Visual Studio Code extension to send updates to https://codestats.net"
|
||||
|
||||
[Docker](https://code.visualstudio.com/docs/containers/overview) - "The Docker extension makes it easy to build, manage, and deploy containerized applications in Visual Studio Code."
|
||||
|
||||
[Debugger for Firefox](https://marketplace.visualstudio.com/items?itemName=firefox-devtools.vscode-firefox-debug) - "Debug your JavaScript code running in Firefox from VS Code."
|
||||
|
||||
[HashiCorp Terraform](https://marketplace.visualstudio.com/items?itemName=HashiCorp.terraform) - "Syntax highlighting and autocompletion for Terraform"
|
||||
|
||||
[Remote - Containers](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers) - "The Remote - Containers extension lets you use a Docker container as a full-featured development environment." 
|
||||
|
||||
[SQLite](https://marketplace.visualstudio.com/items?itemName=alexcvzz.vscode-sqlite) - "VSCode extension to explore and query SQLite databases."
|
||||
|
||||
[tfsec](https://marketplace.visualstudio.com/items?itemName=tfsec.tfsec) - "This VS Code extension is for tfsec. A static analysis security scanner for your Terraform code that discovers problems with your infrastructure before hackers do."
|
||||
|
||||
[WakaTime](https://wakatime.com/vs-code) - "The open source plugin for productivity metrics, goals, leaderboards, and automatic time tracking."
|
||||
|
||||
### Muut
|
||||
|
||||
[editorconfig](https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig) - "This plugin attempts to override user/workspace settings with settings found in .editorconfig files."
|
||||
|
||||
[Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) - "Launch a development local Server with live reload feature for static & dynamic pages"
|
||||
|
||||
[Quit Control](https://marketplace.visualstudio.com/items?itemName=artdiniz.quitcontrol-vscode) - "This extension will make all "quitish" keyboard shortcuts prompt you if you really want to close everything if they were going to do so."
|
||||
|
||||
[Quokka.js](https://marketplace.visualstudio.com/items?itemName=WallabyJs.quokka-vscode) - "Quokka.js is a developer productivity tool for rapid JavaScript / TypeScript prototyping. Runtime values are updated and displayed in your IDE next to your code, as you type."
|
||||
|
||||
[Thunder Client](https://marketplace.visualstudio.com/items?itemName=rangav.vscode-thunder-client) - "Thunder Client is a lightweight Rest API Client Extension for Visual Studio Code, hand-crafted by Ranga Vadhineni with simple and clean design."
|
||||
|
||||
[vscodevim](https://marketplace.visualstudio.com/items?itemName=vscodevim.vim) - "Vim emulation for Visual Studio Code"
|
||||
|
||||
[Webhint](https://marketplace.visualstudio.com/items?itemName=webhint.vscode-webhint) - "Use `webhint` to improve your website during development." 
|
||||
- [AWS Toolkit](https://docs.aws.amazon.com/toolkit-for-vscode/latest/userguide/welcome.html)
|
||||
- "This extension makes it easier for developers to develop, debug locally, and deploy serverless applications that use Amazon Web Services (AWS)."
|
||||
- [Code::Stats](https://marketplace.visualstudio.com/items?itemName=riussi.code-stats-vscode)
|
||||
- "This is a Visual Studio Code extension to send updates to https://codestats.net"
|
||||
- [Docker](https://code.visualstudio.com/docs/containers/overview)
|
||||
- "The Docker extension makes it easy to build, manage, and deploy containerized applications in Visual Studio Code."
|
||||
- [Debugger for Firefox](https://marketplace.visualstudio.com/items?itemName=firefox-devtools.vscode-firefox-debug)
|
||||
- "Debug your JavaScript code running in Firefox from VS Code."
|
||||
- [HashiCorp Terraform](https://marketplace.visualstudio.com/items?itemName=HashiCorp.terraform)
|
||||
- "Syntax highlighting and autocompletion for Terraform"
|
||||
- [Remote - Containers](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers)
|
||||
- "The Remote - Containers extension lets you use a Docker container as a full-featured development environment."
|
||||
- [SQLite](https://marketplace.visualstudio.com/items?itemName=alexcvzz.vscode-sqlite)
|
||||
- "VSCode extension to explore and query SQLite databases."
|
||||
- [tfsec](https://marketplace.visualstudio.com/items?itemName=tfsec.tfsec)
|
||||
- "This VS Code extension is for tfsec. A static analysis security scanner for your Terraform code that discovers problems with your infrastructure before hackers do."
|
||||
- [WakaTime](https://wakatime.com/vs-code)
|
||||
- "The open source plugin for productivity metrics, goals, leaderboards, and automatic time tracking."
|
||||
|
||||
## Muut
|
||||
|
||||
- [EditorConfig for VS Code](https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig)
|
||||
- "This plugin attempts to override user/workspace settings with settings found in .editorconfig files."
|
||||
- Useful for storing basic text formatting settings as a part of the repository to avoid mismatch between computers/developers.
|
||||
- [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer)
|
||||
- "Launch a development local Server with live reload feature for static & dynamic pages"
|
||||
- [Quit Control](https://marketplace.visualstudio.com/items?itemName=artdiniz.quitcontrol-vscode)
|
||||
- "This extension will make all "quitish" keyboard shortcuts prompt you if you really want to close everything if they were going to do so."
|
||||
- [Quokka.js](https://marketplace.visualstudio.com/items?itemName=WallabyJs.quokka-vscode)
|
||||
- "Quokka.js is a developer productivity tool for rapid JavaScript / TypeScript prototyping. Runtime values are updated and displayed in your IDE next to your code, as you type."
|
||||
- [Thunder Client](https://marketplace.visualstudio.com/items?itemName=rangav.vscode-thunder-client)
|
||||
- "Thunder Client is a lightweight Rest API Client Extension for Visual Studio Code, hand-crafted by Ranga Vadhineni with simple and clean design."
|
||||
- [vscodevim](https://marketplace.visualstudio.com/items?itemName=vscodevim.vim)
|
||||
- "Vim emulation for Visual Studio Code"
|
||||
- [Webhint](https://marketplace.visualstudio.com/items?itemName=webhint.vscode-webhint)
|
||||
- "Use `webhint` to improve your website during development."
|
||||
|
||||
|
||||
Reference in New Issue
Block a user