自分用にVS Codeの拡張機能のメモ
FastAPIを勉強中です。
開発・言語サポート
-
Japanese Language Pack for VS Code
日本語化 -
Code Spell Checker
英語のスペルチェッカー。変数名などのスペルミスを防ぐ。 -
Error Lens
エラーや警告をコードの横に直接テキストで表示してくれる。
エディタ快適化・補助ツール
-
indent-rainbow
インデント毎に色分けしてくれる。 -
Bracket Pair Colorization Toggler
対応するカッコを色分け。
→ VSCode標準で対応されている
VSCodeの設定でブラケットペアのガイドを有効にすると、
対応するかっこを結ぶ縦方向の線が表示されてさらに見やすく👏
Editor > Guides: Bracket Pairs を active または true
-
vscode-icons / Material Icon Theme
ファイルのアイコンをわかりやすく表示。 -
TabOut カッコやクォーテーションの内側の文字を書き終えたらタブキーでカッコの外側にカーソルを移動。地味に便利。
-
ZenKaku
全角のスペースをわかりやすく表示。
→ VS Codeの設定で対応可能
Editor > Unicode Highlight: Non Basic ASCIIをtrue -
Markdown Preview Enhanced
-
Code Runner
-
Path Intellisense
ファイルやフォルダのパスの入力サポート
AIアシスタント
- GitHub Copilot Chat(GitHub Copilot - Your autonomous AI peer programmer)
Python / FastAPI開発関連
- Python(Python extension for Visual Studio Code)
インストールすると自動で下記もインストールされる- Pylance(コード補完と静的解析など)
- Python Environments(Pythonの仮想環境の切り替えと管理)
- Python Debugger(デバッガー)
- Ruff(Ruff extension for Visual Studio Code)
-
Black formatter→ Ruffで代用可能なため不要 - autoDocstring - Python Docstring Generator
データベース関連
- SQLite Viewer
→ Database Client か SQLTools に変更予定
Webフロントエンド関連
- Live Server
ボタン一つでローカルサーバーを起動し、保存と同時にブラウザを自動リロードしてくれる。 - ESLint
JavaScript/TypeScriptの構文・品質チェック（Linter）。 - Prettier
Code formatter ソースコードの整形。 - ES7+ React/Redux/React-Native snippets
Reactなどの定型コード（スニペット）を一瞬で入力できる。 - Microsoft Edge Tools for VS Code
VS Code内でEdgeのデベロッパーツール（要素の検証など）を開いてデバッグできる。
Git関連
- GitHub Pull Requests
- GitLens
インフラ・コンテナ関連
- WSL(Visual Studio Code WSL)
- Docker
- Code Dev Containers