アプリケーション開発の準備

これまでに学んだJavaScriptの基本構文は、実行環境を問わずに使えるものです。 しかしこの後に続くユースケースの章では、具体的な実行環境としてWebブラウザとNode.jsの2つを扱います。 また、ブラウザで実行するアプリケーションであっても、その開発にはツールとしてのNode.jsが欠かせません。 このセクションではユースケースの学習へ進むために必要なアプリケーション開発環境の準備をおこないます。

Node.jsのインストール

Node.jsはサーバーサイドJavaScript実行環境のひとつで、次のような特徴があります。

  • WebブラウザのChromeと同じV8 JavaScriptエンジンで動作する
  • オープンソースで開発されている
  • OSを問わずクロスプラットフォームで動作する

Node.jsはサーバーサイドで使うために開発されました。 しかし今ではコマンドラインツールやElectronなどのデスクトップアプリケーションにも利用されています。 そのため、Node.jsはサーバーサイドに限らずクライアントサイドのJavaScript実行環境としても幅広く使われています。

Node.jsは多くの他のプログラミング言語と同じように、実行環境をマシンにインストールすることで使用できます。 公式のダウンロードページから、開発用のマシンに合わせたインストーラをダウンロードして、インストールしましょう。

Node.jsにはLTS(Long-Term Support)版と最新版の2つのリリース版があります。 LTS(Long-Term Support)版は2年間のメンテナンスとサポートが宣言されたバージョンです。 具体的には、後方互換性を壊さない範囲でのアップデートと、継続的なセキュリティパッチの提供が行われます。 一方で、最新版はNode.jsの最新の機能を使用できますが、常に最新のバージョンしかメンテナンスされません。 ほとんどのユーザーは、LTS版を用いることが推奨されます。Node.jsでの開発が初めてであれば、迷わずにLTS版のインストーラをダウンロードしましょう。 この章では執筆時点の最新LTS版であるバージョン8.12系で動作するように開発します。

インストールが完了すると、コマンドラインでnodeコマンドが使用可能になっているはずです。 次のコマンドを実行して、インストールされたNode.jsのバージョンを確認しましょう。

$ node -v 
v8.12.0

また、Node.jsにはnpmというパッケージマネージャーが同梱されています。 Node.jsをインストールすると、nodeコマンドだけでなくnpmを扱うためのnpmコマンドも使えるようになっています。 次のコマンドを実行して、インストールされたnpmのバージョンを確認しましょう。

$ npm -v 
6.4.1

npmやnpmコマンドについての詳細は公式ドキュメントnpmのGitHubリポジトリを参照してください。 Node.jsのライブラリのほとんどはnpmを使ってインストールできます。 実際に、ユースケースの章ではnpmを使ってライブラリをインストールして利用します。

npxコマンドによるnpmパッケージの実行

Node.jsを使ったコマンドラインツールは数多く公開されており、npmでインストールすることによりコマンドとして実行できるようになります。 ところで、Node.jsのインストールにより、npxというコマンドも使えるようになっています。 npxコマンドを使うと、npmで公開されている実行可能なパッケージのインストールと実行がコマンドひとつで省略できます。 この後のユースケースでもそれらのツールを使うので、ここでツールの実行を試してみましょう。

ここでは例として@js-primer/hello-worldというサンプル用のパッケージを実行します。 npxコマンドでコマンドラインツールを実行するには、次のように npxコマンドにパッケージ名を渡して実行します。

$ npx @js-primer/hello-world
npx: 1個のパッケージを7.921秒でインストールしました。
Hello World!

このように、npxコマンドを使うことによりnpmで公開されているコマンドラインツールを簡単に実行できます。

[コラム] コマンドラインツールのインストールと実行

npmで公開されているコマンドラインツールを実行する方法はnpxコマンドだけではありません。 npm installコマンドを使ってパッケージをインストールし、インストールされたパッケージのコマンドを実行する方法があります。 通常のnpm installコマンドは実行したカレントディレクトリにパッケージをインストールしますが、--globalフラグを加えるとパッケージをグローバルインストールします。 グローバルインストールされたパッケージのコマンドは、nodeコマンドやnpmコマンドと同じように、任意の場所から実行できます。

次の例では@js-primer/hello-worldパッケージをグローバルインストールしています。 その後、パッケージに含まれているjs-primer-hello-worldコマンドを絶対パスの指定なしで呼び出しています。

$ npm install --global @js-primer/hello-world
$ js-primer-hello-world
Hello World!