JavaScriptのテキストエディタの選び方を現役エンジニアが解説【初心者向け】

初心者向けにJavaScriptのテキストエディタの選び方について現役エンジニアが解説しています。高機能なテキストエディタを使うと、入力補完(コードの補完)や入力補完やテキストの置換、テーマの変更(外観の変更)などが出来ます。VSCodeやAtom、SublimeやCloud9などを解説します。

TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,000以上あります。

JavaScriptのテキストエディタの選び方について、TechAcademyのメンター(現役エンジニア)が実際のコードを使って初心者向けに解説します。

 

JavaScriptについてそもそもよく分からないという方は、JavaScriptとは何なのか解説した記事をまずご覧ください。

 

なお本記事は、TechAcademyのオンラインブートキャンプ、JavaScript/jQuery講座の内容をもとにしています。

 

田島悠介

今回は、JavaScriptに関する内容だね!

大石ゆかり

どういう内容でしょうか?

田島悠介

JavaScriptのテキストエディタの選び方について詳しく説明していくね!

大石ゆかり

お願いします!

 

テキストエディタの選び方のポイント

HTMLやJavaScriptなどのソースコードを入力するときに便利なのがテキストエディタです。

単にソースコードを入力するだけならパソコンに添付されているメモ帳などのソフトも使えますが、テキストエディタには多くのメリットがあります。

  • 入力補完:キーワードを入力している途中で候補を表示してくれる機能です。長い関数名などを間違いなく簡単に入力できます。
  • 自動フォーマット:ソースコードの一部分または全体をフォーマットする機能です。
  • 検索/置換:正規表現などを使った強力な検索や置換が可能です。
  • 各種ツールとの連携:簡易Webサーバーを組み込んでJavaScriptのプログラムを実行したり、バージョン管理などのソフトと連携することで開発作業効率を向上します。
  • テーマの設定:最近エンジニアの間で流行している「ダークテーマ」など、見た目を自分好みに変更できます。

テキストエディタは多くの種類があります。JavaScriptのテキストエディタを選ぶ際は以下のような点がポイントになるでしょう。

  • 多くの開発者が利用している
  • 開発が継続して行われている
  • ESLintなどの構文チェックツールを組み込むことができる

 

JavaScriptのコーディングにおすすめのテキストエディタ

この記事では、JavaScriptのコーディングにおすすめのテキストエディタを3つ紹介します。どれも無料で利用できます。

 

Visual Studio Code(VSCode)

マイクロソフト社を中心としたコミュニティで開発が進められているオープンソースのテキストエディタです。筆者も愛用しています。統合開発環境の Visual Studio とは別物なので注意しましょう。

WindowsやMacOS、Linuxで動作します。VSCodeの魅力は軽快な動作と豊富な拡張機能です。コーディングからテスト、バージョン管理まで、開発に関する一連の作業をVSCodeの中で行なえます。ほとんどのプログラミング言語で選んで間違いなしのテキストエディタと言えるでしょう。

>> Visual Studio Code

 

Atom

AtomはGithubが開発したオープンソースのテキストエディタです。こちらもWindowsやMacOS、Linuxで動作します。Atom は見た目のシンプルさとカスタマイズの容易さ、拡張性の高さからVSCodeと並んで人気のテキストエディタです。

以前はVSCodeと比較してやや動作がもったりしていましたが、最近では開発が進んでそのようなことも無くなりました。こちらも選んで間違いの無いテキストエディタです。

>> Atom

 

その他、開発者の間で良く使われているテキストエディタをいくつかご紹介します。

 

サクラエディタ

エンジニアのパソコンにはほぼ100%の確率でインストールされていると思われるエディタです。古くからテキストエディタのデファクトスタンダードであり、使いやすさや小回りの良さは今も色あせません。

VSCodeやAtomを使っていても、ちょっとした編集はサクラエディタで行うというエンジニアも多いのではないでしょうか。

>> サクラエディタ

 

Sublime Text

熱心なファンが多いエディタです。無償版と有償版があります。プラグインパッケージを組み合わせることで、自分好みのエディタに仕上げることができます。一度好みの環境が出来てしまうと手放せない理由も分かりますね。有償版と無償版があります。

>> Sublime Text

 

Cloud9

最後にちょっと変わったテキストエディタをご紹介しましょう。

Cloud9はソースコードの記述から実行までを行えるクラウド環境です。AWSで提供されているサービスの他、オープンソースでのリポジトリも提供されています。ローカル環境の設定を行う必要が無いことから、教育やテストなどにも利用されています。

>> AWS Cloud9

 

[PR] JavaScript・jQueryで挫折しない学習方法を動画で公開中

筆者プロフィール

太田和樹(おおたかずき)

ITベンチャー企業のPM兼エンジニア

普段は主に、Web系アプリケーション開発のプロジェクトマネージャーとプログラミング講師を行っている。守備範囲はフロントエンド、モバイル、サーバサイド、データサイエンティストと幅広い。その幅広い知見を生かして、複数の領域を組み合わせた新しい提案をするのが得意。

開発実績:画像認識技術を活用した駐車場混雑状況把握(実証実験)、音声認識を活用したヘルプデスク支援システム、Pepperを遠隔操作するアプリの開発、大規模基幹系システムの開発・導入マネジメント。

地方在住。仕事のほとんどをリモートオフィスで行う。通勤で消耗する代わりに趣味のDIYや家庭菜園、家族との時間を楽しんでいる。

 

大石ゆかり

内容分かりやすくて良かったです!

田島悠介

ゆかりちゃんも分からないことがあったら質問してね!

大石ゆかり

分かりました。ありがとうございます!

 

TechAcademyでは、初心者でも最短4週間で、JavaScript・jQueryを使ったWebサービス公開を習得できる、オンラインブートキャンプを開催しています。

また、現役エンジニアから学べる無料体験も実施しているので、ぜひ参加してみてください。