コードエディター
メモ: この記事のコンテンツは現在不完全です。申し訳ありません!私たちは MDN ウェブ開発の学習の章の改善に努めており、間もなく、 ("TODO") とマークされた場所も完了する予定です。
以前、この道筋を読み進めている方は、コードエディターをインストールするよう指示しました。この記事では、コードエディターについてさらに詳しく見ていき、それがユーザーに何をもたらすかについての考えを提供します。
前提条件: | コンピューターのオペレーティングシステムに慣れていること。 |
---|---|
学習成果: |
|
どのようなコードエディターが利用できるか
Microsoft Word のようなバイナリファイルエディターは、コードの編集には適していません。必要なのは、プレーンテキストをきれいに処理し、出力できるものです。
OS の既定のプレーンテキストエディター、例えば macOS のテキストエディットや Windows のメモ帳も利用できますが、限界もあります。
本格的なコードエディター、例えば Visual Studio Code (マルチプラットフォーム、無料)、Sublime Text(マルチプラットフォーム、無料ではない)、Notepad++(Windows、無料)などを使った方が良いでしょう。 Visual Studio Code は、私たちが最もよく使用しているエディターなので、お勧めします。他のコードエディターを使用したい場合は、それでも構いません。 Visual Studio Code とまったく同じように動作するわけではありませんが、多くの基本機能は似ているでしょう。
統合開発環境 (IDE) である Visual Studio(Windows、無料ではない)、NetBeans(マルチプラットフォーム、無料)、WebStorm(マルチプラットフォーム、無料ではない)は、単純なコードエディターよりも多くの機能を持っていますが、学習の段階では、必要以上に複雑になりがちです。
基本的なコードエディターの機能
- コードファイルを開き、編集すること。
- 構文の強調表示。
- 自動インデントやその他の簡単な構文修正。
- コードの補完やヘルプ。
- 検索と置換は、正規表現を使用できることが多く、機能性をより高めることができます(例えば、特定の文字列の先頭と末尾を残し、その間の文字列を置き換えるなど)。
- バージョン管理システムとの連携ができることが多い(バージョン管理モジュールを参照)。
拡張機能でコードエディターを強化
- コード補完、強調表示、文法チェック、デバッグなどの言語固有の拡張機能。これは、JavaScript、Python、Go などの特定の言語、または TypeScript や JSX などの言語やフレームワークの抽象化に利用できます。
- GitHub/バージョン管理拡張機能(既定で提供されていない場合)。
- テーマと配色の拡張。
- コードスニペットや雛形生成ツールなどの生産性向上機能。
- GitHub Copilot のような AI によるコード提案ツール。 AI ツールは便利ですが、推論能力は持っておらず、誤解を招くような回答や、単に間違った回答を指定することがよくあるので注意が必要です。 AI による回答が正しいと想定するのではなく、他にもソースがある場合は、それらで検査/検証を行うべきです。