JavaScriptの開発環境をつくる

ゼロから始めるJavaScript超入門。第二回目の今回は、JavaScriptを使って開発をする為の環境づくりについてのご紹介です。

JavaScriptだけではないのですが、プログラミングをする為には、開発をする為に最低限必要な”環境”をつくる必要があります。

結論から先にお話ししますと、プログラミングは、テキストエディタというアプリケーションをパソコンにインストールしてしまえば、誰でも簡単にプログラミングを始めることができます。

WindowsOSで言えば「メモ帳」、MacOSでは「テキストエディット」

にあたるわけですが、世の中には、プログラミングに最適化されたとっても便利なテキストエディアというものがあり、世のプログラマー達は、プログラマー以外の人々にはよくわからない”拘り”と”誇り”、そして”深い愛”をもって好みにマッチしたテキストエディタを探し出し、長年愛用し続けています。

もちろん、「メモ帳」や「テキストエディット」が良ければ、メモ帳・テキストエディットでも構いません。ただ、もっと便利なテキストエディタが世の中にあるというだけです。

因みに私は、WindowsOSの愛用者ですので、メモ帳を!と言いたいところですが、Microsoft社のVisual Studio Codeを使っています。

Visual Studio Code

Visual Studio Codeは、Microsoft社が開発したWindows、Linux、macOS用のソースコードエディタで高機能且つカスタマイズ性に優れたプログラミングに特化したエディタです。Visual Studio Codeは、↓のウェブページから無料でダウンロードして利用することができます。

https://code.visualstudio.com/

何度も言いますが、世の中には本当に色々なテキストエディタが存在するのですが、近い将来的にMicrosoftが提供するクラウドサービスである”Azure”での開発をしてみたいといった方であれば、Azureとの連携機能が組み込まれているVisual Studio Codeは後々便利に感じるときが多々あるかと思いますのでおススメです。

Visual Studio Codeの基本機能となりますが、Visual Studio Codeから直接Azureアプリをビルド・実行・デバッグができるのは嬉しい機能です。

もちろん、プログラミングに特化したエディタですので、GitHubとも連携しています。Visual Studio Codeの画面もシンプルでわかりやすいつくりになっているかと思いますので、テキストエディタでの開発に不慣れな人でもそんなに違和感なくプログラミングの世界に入っていくことができると思います。

Brackets

もうひとつプログラミングに特化したテキストエディタ「Brackets」をご紹介しておきます。

http://brackets.io/

Brackets(ブラケッツ) は、pdf や Photshop などのソフトウエアで有名な”Adobe Systems”が開発するオープンソースのソースコードエディタです。

Bracketsも無料で利用することができます。Bracketsは、32の言語に対応し、各種専用ビジュアルツールとプリプロセッサーをサポートしていると標榜するプログラミングに特化した高機能テキストエディタです。

JavaScriptをBracketsで書いていれば、エラーも教えてくれますし、ライブプレビューといったブラウザとリアルタイムで連携し、ブラウザ上で動作を確認しながらプログラミングすることができるといった機能もあります。

ブラウザで確認しながらプログラミングができると大きな手戻りの発生を未然に防ぐことができますので、とても便利で有難い機能です。

エディタばかりは触ってみないと自分にあうかどうかはわかりません(;^ω^)

他にも定番の「Vim」や「Emacs」などなど、様々なエディタが世の中にはありますので、見た目や使いやすさなどの点から好みにあうテキストエディタを選んでみてもいいでしょう。

結局のところ、色々なエディタを使ってみて、自分自身の感性や普段何気ないキーボードの操作の癖などの感覚的な理由から、使いやすいエディタが絞り込まれ、最終的に自分の好みのエディタに落ち着きますので、気が向いたら、新しいエディタをインストールし、触ってみることをお奨めします。

私も、「Vim」「Neovim」「Emacs」「TeraPad」「秀丸」「Notepad++」「Eclipse」「Visual Code」などなど、いくつかのテキストエディタを渡り歩き、「Visual Studio Code」に落ち着いています。

ゼロから始めるJavaScript、第三回目は、開発用のテキストエディタをパソコンにインストールした前提で、HTMLとCSSについて実際に記述してみます。