Merge pull request #27 from geolonia/add-pluginpages

開発に役立つGoogleChome/VScode拡張機能　のページ追加

docs/table-of-contents.md

@@ -73,6 +73,7 @@
 - [開発用PC&データ取扱ルール](/組織別/開発/pc-security-guidelines.html)
 - [プロジェクト運用方針](/組織別/開発/project-management-policy.html)
 - [リーディングリスト](/組織別/開発/readinglist.html)
+- [推奨拡張機能・ツール](/組織別/開発/recommend-plugin.html)
 - 運用・設定ガイド
     - [DNS ドメイン登録方法](/組織別/開発/運用・設定ガイド/domain-registration.html)
     - [配信用タイルセットのアップロード](/組織別/開発/運用・設定ガイド/upload-tileset.html)

docs/組織別/開発/recommend-plugin.md

@@ -0,0 +1,89 @@
+# 推奨拡張機能・ツール
+
+開発生産性を向上させるための推奨拡張機能とツールをまとめています。
+## Chrome拡張機能
+
+### インストール手順
+
+Chrome拡張機能のインストールは以下の手順で行います：
+
+1. Chrome Web Storeにアクセスします
+2. 該当の拡張機能を検索します
+3. 「Chromeに追加」をクリックします
+
+### 拡張機能
+
+| 用途 | 推奨拡張機能 | 活用方法 |
+|------|--------------|----------|
+| **フロントエンド開発** | React Developer Tools | Reactアプリケーションの開発・デバッグ時に使用します |
+| **パフォーマンス最適化** | Lighthouse | サイトの品質評価やパフォーマンス改善時に使用します |
+| **技術調査** | Wappalyzer | 参考サイトの使用技術を調査する際に使用します |
+
+## VS Code 拡張機能
+
+### インストール手順
+
+拡張機能のインストールは以下の手順で行います：
+
+1. VS Codeを開きます
+2. `Ctrl+Shift+X`（Mac: `Cmd+Shift+X`）を押して拡張機能パネルを開きます
+3. 上記の拡張機能IDを検索します
+4. 「Install」をクリックしてインストールします
+
+### 拡張機能一覧
+
+| カテゴリ | 拡張機能 | 主な用途 |
+|---------|----------|----------|
+| **API開発** | OpenAPI (Swagger) Editor | APIの設計・開発をサポート |
+|  | Swagger Viewer | APIドキュメントのプレビュー |
+|  | Swagger Tools | Swaggerファイルの管理 |
+| **コード品質管理** | Prettier | コードフォーマットの自動化 |
+|  | EditorConfig | コーディングスタイルの統一 |
+|  | Trailing Spaces | 不要な空白の検出・削除 |
+|  | Better Comments | コメントの視認性向上 |
+|  | indent-rainbow | インデントの可視化 |
+| **図表作成** | Draw.io Integration | 汎用的な図表作成 |
+|  | PlantUML | UML図の作成 |
+|  | Markdown Mermaid | Markdownでの図表表現 |
+| **開発環境** | Docker | コンテナ環境の管理 |
+|  | Remote Containers | コンテナでの開発環境 |
+|  | Live Server | 開発用ローカルサーバー |
+|  | Path Intellisense | ファイルパスの入力補完 |
+| **AI支援** | GitHub Copilot | AIによるコード補完 |
+|  | GitHub Copilot Chat | AIとの対話型開発支援 |
+| **バージョン管理** | Git History | Gitの履歴管理・可視化 |
+
+
+## GoogleChrome 拡張機能
+
+### インストール手順
+
+拡張機能のインストールは以下の手順で行います：
+
+1. VS Codeを開きます
+2. `Ctrl+Shift+X`（Mac: `Cmd+Shift+X`）を押して拡張機能パネルを開きます
+3. 上記の拡張機能IDを検索します
+4. 「Install」をクリックしてインストールします
+
+### 拡張機能一覧
+
+| カテゴリ | 拡張機能 | 主な用途 |
+|---------|----------|----------|
+| **API開発** | OpenAPI (Swagger) Editor | APIの設計・開発をサポート |
+|  | Swagger Viewer | APIドキュメントのプレビュー |
+|  | Swagger Tools | Swaggerファイルの管理 |
+| **コード品質管理** | Prettier | コードフォーマットの自動化 |
+|  | EditorConfig | コーディングスタイルの統一 |
+|  | Trailing Spaces | 不要な空白の検出・削除 |
+|  | Better Comments | コメントの視認性向上 |
+|  | indent-rainbow | インデントの可視化 |
+| **図表作成** | Draw.io Integration | 汎用的な図表作成 |
+|  | PlantUML | UML図の作成 |
+|  | Markdown Mermaid | Markdownでの図表表現 |
+| **開発環境** | Docker | コンテナ環境の管理 |
+|  | Remote Containers | コンテナでの開発環境 |
+|  | Live Server | 開発用ローカルサーバー |
+|  | Path Intellisense | ファイルパスの入力補完 |
+| **AI支援** | GitHub Copilot | AIによるコード補完 |
+|  | GitHub Copilot Chat | AIとの対話型開発支援 |
+| **バージョン管理** | Git History | Gitの履歴管理・可視化 |