【あいでぃーいー】

IDE(統合開発環境) とは?

💡 開発者の「全部入り作業机」
📌 このページのポイント
IDE(統合開発環境)の主要機能 ファイル 📁 src/ 📄 main.js 📄 app.css 📁 test/ コードエディタ const msg = "Hello" function greet () {"{"} console.log(msg) ⚡ 補完候補 デバッガ ▶ 実行 ⏸ ブレークポイント 🔍 変数監視 📊 コールスタック $ npm run dev Server running on http://localhost:3000 ターミナル
IDEのイメージ
ひよこ ひよこ

メモ帳でコード書いたらダメなの?

ペンギン先生 ペンギン先生

動くけど辛い。IDEを使うとコードを打っている途中で補完候補が出る、タイプミスを赤線で教えてくれる、関数の定義元にジャンプできる、などがある。慣れると「なんで以前はあれで書いてたんだ」ってなる。

ひよこ ひよこ

VS CodeってIDEなの?エディタなの?

ペンギン先生 ペンギン先生

厳密にはエディタだけど、拡張機能を入れるとIDEに近い機能になる。IntelliJやPyCharmは最初からIDE機能が全部入っている「純粋なIDE」。VSCodeは軽量だけど拡張しやすい、という立ち位置。

ひよこ ひよこ

コード補完って何が便利なの?

ペンギン先生 ペンギン先生

関数名や変数名を数文字打つだけで候補一覧が出て、Enterで補完される。長い関数名をタイプミスせず書けるし、ライブラリのどんなメソッドがあるか一覧で確認もできる。学習コストが大きく下がる。

ひよこ ひよこ

IDEが重くて動作が遅いときどうすれば?

ペンギン先生 ペンギン先生

よくある原因は使ってない拡張機能が多すぎること、インデックスの構築中であること、プロジェクトのnode_modulesや.venvをIDEが全部スキャンしていること。node_modulesを除外設定に追加すると劇的に速くなることがある。

ペンギン
まとめ:ざっくりこれだけ覚えればOK!
IDEって出てきたら「プログラミングに必要な道具を全部まとめた開発ソフト」と思えばだいたいOK!
📖 おまけ:英語の意味
「Integrated Development Environment」 = 統合開発環境
💬 「Integrated(統合された)」が核心。バラバラだった開発ツールを1つにまとめた概念
← 用語集にもどる