Node.js 開発環境の構築

はじめに

Node.js を使って JavaScript 言語でWebアプリを開発してみたい！と思い立ちましたが、Node.js プラグインやらなにやらを npm コマンドを使ってパッケージ管理をしないといけない？とか Eclipse 環境を用意したいけれどメインのOSの環境を汚したくない！とかいろいろ考えた結果、下記の組み合わせで開発専用仮想ホストを構築するのが一番幸せになれそうと思いましたので、この構成にするための構築手順をまとめたいと思います。

　VirtualBox
　　＋ CentOS6
　　＋ OracleJDK8
　　＋ Eclipse4.4
　　＋ Nodeclipse
　　＋ npm
　　＋その他データベースサーバーとかキャッシュサーバーとか一式

ちなみに、メインのOS (VirtualBoxからみるとホストOS ) は Windows でも Mac でもなんでもいいと思います。このエントリーは VirtualBox 上の仮想ホスト1つの中だけで完結します。

大まかな手順は下記のとおりです。

VirtualBox に CentOS6 用の仮想ホストを追加する
仮想ホストに CentOS6 をインストールする
CentOS6 に VirtualBox Guest Additions をインストールする
CentOS6 に Node.js と npm をインストールする
CentOS6 に OracleJDK8 をインストールする
CentOS6 に Eclipse4.4 をインストールする
Eclipse4.4 に Nodeclipse プラグインをインストールする
最初のプロジェクトを立ち上げる

VirtualBox に CentOS6 用の仮想ホストを追加する

VirtualBox は事前にインストール済み、というところから始めます。もしまだメインのOSにインストールしていないなら、Oracle VM VirtualBox のダウンロードページからダウンロードしてインストールしてください。

今回は Node.js 開発が目的ですが、Gnome デスクトップ環境で Eclipse を IDE として使うよう計画していますので、仮想ホストに割り当てるリソースは最低でも下記くらいの能力は必要になるのかな、と思います。

64ビットCPU 2コア以上 ( ただし CPU使用率の上限はメインのOSの事も考えて 70% 程度でかまいません )
メモリーは 1024MB 以上
グラフィック用メモリーとして 32MB 程度
ストレージは 20GB 程度
ネットワークインターフェイスは NAT 構成で1つ

ちなみに私の環境は、メインのOSは MacOSX10.9.5、ハードウェアは MacBook Air 13 inch 2010 Late ( Core2 Duo 1.86GHz 2Cores, 2GB DDR2, 128GB SSD, + 64GB UHS-1 SDXC Card )と今となっては少々窮屈なマシンです。

余談ですが、SSDストレージの容量が128GBしかないため、今回は仮想ホスト用のストレージをSDカードに保存することにしました。転送速度が一番気になるところでしたが、一度あれこれインストールしてしまえば、一番のネックはネットワークになる事が判明しましたので、実はこれで結構快適です。SDカードは最大書き込み速度が 30MB/s のもの ( 64GB で約3800円 ) を選びました。

NAT のポートフォワード設定について、当面は下記の2つで十分だと思います。ホストローカル側のポートは、都合に合わせて読み替えてください。

ホストローカル 8022 → 仮想ホスト 22 ( CentOS6 へのシェル接続用 )
ホストローカル 3000 → 仮想ホスト 3000 ( Node.js Webアプリ接続用 )

仮想ホストに CentOS6 をインストールする

仮想ホストの構築を始めましょう！

インストーラーイメージをダウンロードする

さあ、CentOS6 をインストールしましょう！とその前に、CentOS6 のインストールイメージが必要です。理研サイトやIIJサイトなどから、「bin-DVD1.iso」で終わるファイルをダウンロードしてください。

OSインストール

ダウンロードした ISO ファイルを、仮想ホストの仮想光学ドライブに割り当ててから、仮想ホストを起動すると、CentOS6 のインストール画面が表示されるはずです。以降はウィザードに従ってインストールしていきますが、2点だけアドバイスします。

1点目は、ネットワーク設定です。デフォルトでは CentOS6 が起動してもネットワークインターフェイスは起動しないように設定されます。特別な理由がなければ、このタイミングで自動的に起動するようにしておきます。

2点目は、インストールするパッケージについてです。はじめのパッケージ構成の選択で「デスクトップ環境」を選択しますが、これには Office互換ソフトやJava、Webブラウザーなどもインストールされますので、除外します。それぞれ「Office」や「グラフィカルインターネット」が該当します。

Java は Eclipse で必要なんじゃないの？と思われるかもしれませんね。CentOS の Java は少しバージョンが古いので、あとで最新の Java をインストールするため、ここで除外しておきます。

Webブラウザーはインストールしないの？と思われるかもしれませんね。WebブラウザーはCentOS6 のものではなく、メインのOSのものを使うつもりですので、この段階では不要としています。CentOS6 上で確認してもいいのですが、動作確認としては実環境に近い方がいいという考えです。

無事に CentOS6 がインストールされたでしょうか？インストール直後は画面解像度が低いままですが、次の章までの辛抱です。

ファイアーウォールを無効にする

NATの外側からポートフォワードで接続できるように、CentOS6 のファイアーウォールを無効にします。今回は開発のための構築なので、ファイアーウォールは無効にしても問題ないはずです。

「システム」→「管理」→「ファイアーウォール」をクリックします。
「ファイアーウォールの設定」ウィンドウが表示されますが、root のパスワードを聞かれますので入力してください。
画面上部のメニューアイコンから、「無効」ボタンをクリックしてから、「適用」ボタンをクリックしてください。

これで CentOS6 は外部からの接続を遮断しないようになります。

root でログインしなくても済むようにする

毎回 root のパスワードを入力するのは手間です。いまログインしているユーザー ( your-username とします ) から root でしか実行できないコマンドを実行できるようにする、sudo というコマンドがあります。CentOS6 では sudo コマンドを使うために少し準備が必要です。以降の手順でも sudo コマンドを使いたいところがありますので、今のうちに設定しておきましょう。

sudo コマンドを使いたいユーザーを、既存の wheel というグループに加えます。次に、sudo コマンドを使えるグループとして、wheel グループを許可します。これらの手順は root ユーザーで実行する必要があります。

$ su -
# usermod -G wheel your-username
# visudo

( 108行目付近、「NOPASSWD」のある行、行頭の # をはずして保存 )
%wheel  ALL=(ALL)       NOPASSWD: ALL

# logout
$

# から始まる行は root ユーザーで実行してください。
$ から始まる行は your-username ユーザー(一般ユーザー) のときのプロンプトです。

この段階では、your-username ユーザーはまだ wheel グループに入ったと認識されていません。一度ログアウトしてから、再度ログインしてください。そして、確認のため id コマンドを実行してみます。

$ id
uid=500(your-username) gid=500(your-username) 所属グループ=500(your-username),10(wheel) context=unconfined_u:unconfined_r:unconfined_t:s0-s0:c0.c1023

所属グループとして「10(wheel)」があれば成功です。この調子で早速 sudo コマンドを使ってパッケージを最新の状態にしておきましょう。

$ sudo yum update

CentOS6 に VirtualBox Guest Additions をインストールする

CentOS6 とメインの OS とで、テキストやファイルのコピー&ペーストできるようにしたり、CentOS6 の画面解像度を上げたりできるように、VirtualBox Guest Additions をインストールします。このソフトウェアは CentOS6 にとって仮想ハードウェアドライバーのようなものですが、CentOS6 のコア ( kernel ) のバージョンに合ったものをインストールする必要があります。

少し下準備が必要ですのでつきあってください。といっても、VirtualBox Guest Additions が自動的にビルドされるようにコンパイラーとヘッダーファイルをインストールするだけです。

$ sudo yum install gcc kernel-devel

インストールできたら、VirtualBox のメニューから、「Devices」→「Guest Additions CD image」をクリックします。CentOS6 の画面に、実行してよいかどうかのポップアップが表示されますので、実行してください。

これもインストールが終わったら一度ログアウトして、再度ログインしてください。ここまでの手順で、CentOS6 のインストールは完了です。

CentOS6 に Node.js と npm をインストールする

CentOS6 に nodejs と npm をインストールするを参照してください。

この段階で Node.js の開発を始められなくもありませんが、引き続き IDE をインストールして快適な環境にしましょう。

CentOS6 に OracleJDK8 をインストールする

Java SE Download から、最新の JDK をダウンロードします。今回は「linux x64」の RPM ファイルをダウンロードしましょう。メインのOSでダウンロードします。ファイルはCentOS6 にコピー&ペーストで転送しても構いませんし、ssh ( sftp や scp ) で転送しても構いません。転送先はホームディレクトリーとします。

転送できたら、CentOS6 で下記コマンドを実行してインストールします。

$ sudo yum install jdk-8u20-linux-x64.rpm

CentOS6 に Eclipse4.4 をインストールする

Eclipse Download のページから、「Eclipse IDE for Java Developers – Linux 64bit」を選んでダウンロードします。これも、メインのOSでダウンロードします。

これは RPM ファイルではなく、tar.gz ファイルになっています。インストールというより、単に解凍して配置、という手順なります。

私の場合、ホームディレクトリーの下に、下記のようになるよう配置しました。

/home/your-username/ ←これはホームディレクトリー。「~/」とも書ける。
   bin/
     eclipse          ←これは ~/opt/eclipse/eclipse へのシンボリックリンク
   opt/
     eclipse/         ←これは解凍して出てくる eclipse フォルダー
       eclipse        ←これは Eclipse 本体のプログラム
   workspace/         ←これは Eclipse 用のワークスペースディレクトリー

ホームディレクトリーに tar.gz ファイルを転送してから、上記の構成になるようにコマンドを実行していきます。

$ cd ~/
$ mkdir -p ~/{bin,opt,workspace}
$ tar fxz eclipse-standard-luna-R-linux-gtk-x86_64.tar.gz -C ~/opt/
$ ln -s ${HOME}/opt/eclipse/eclipse ${HOME}/bin/eclipse

この段階で、eclipse はパスが通ります ( ~/bin/ はデフォルトでパスが通ります ) ので、シェルで下記のように実行すれは Eclipse が起動するようになります。が、どうせならショートカットとして Eclipse のアイコンを画面上部のパネルへ追加しておいてもいいでしょう。

$ eclipse

アンインストールしたくなったときはこの解凍したディレクトリーと、workspace フォルダーを削除するだけでいいはずです。

Eclipse4.4 に Nodeclipse プラグインをインストールする

ここまでくればもうあと少しです。Eclipse で Node.js Webアプリのひな形 (新規プロジェクト) を作成したり、テストやデバッグのために Webアプリとして起動できるようにするために、Nodeclipse プラグインをインストールします。Eclipse を起動して、プラグインをインストールしましょう。Nodeclipse インストール手順の B) UPDATE SITE を参考にします。

メニューから「Help」→「Install New Software」をクリックします。
「Work with:」のテキストボックスに、「http://www.nodeclipse.org/updates/」を入力して「Add」ボタンをクリックします。
「Name:」のテキストボックスには、適当に「Nodeclipse」とでも入力して、「OK」ボタンをクリックします。

　一覧に、「Pending」と表示されますが、しばらく待つと利用できるパッケージが表示されます。この中から次のパッケージをインストールします。

1st Nodeclipse Core (nodeclipse-1)
- Enide Node.js
- JSHint Eclipse Integration
- Nodeclipse Core and Node.js
Enide Tools Collection
- GFM Viewer feature
- Markdown Editor
- Nodeclipse Plugins List Feature
- StartExplorer Feature

次に進む前に、「Contact all update sites during install to find required software」のチェックボックスをはずしておきましょう。あとはウィザードに従って進めてください。

最初のプロジェクトを立ち上げる

ようやく Node.js Webアプリの開発環境が整いました。早速、初めてのプロジェクトを新規作成して、ホストOSのブラウザーで表示してみましょう！

Eclipse のメニューから、「File」→「New Express Project」をクリックしてください。
「Project name:」は何でも構いませんが、今回は「Hello Nodeclipse」などとしましょう。
私は ejs テンプレートエンジンが大好きなので、「Template Engine:」はもちろん ejs を選択します。
私は標準的なCSSしかよく知りませんので「Stylesheet Engile:」は「CSS」のままにしておきます。
準備が整いましたので、「Finish」ボタンをクリックしてひな形が作成されるのを待ちます。

さぁ、いよいよ Eclipse で Node.js Webアプリを起動するときです。

Eclipse のメニューから、「Window」→「Open Perspective」→「Other」をクリックします。
リストから「Node」を選択して、「OK」ボタンをクリックします。
画面左側に、プロジェクトを構成するファイルの一覧がツリー形式で表示されますので、プロジェクトディレクトリーの直下にある「app.js」を右クリックしてください。
「Run As」→「1 Node Application」をクリックしてください。

画面下部のエリアにある「コンソール」タブの中を見てください。

Eclipse は npm コマンドを使ってこのプロジェクトに必要な Node.js モジュールを集め始めます。最終的に「Express server listening on port 3000」というメッセージが表示されたでしょうか？これが表示されれば、無事 Node.js Webアプリが Eclipse 上で起動しています。

メインのOS のブラウザーを起動して、下記URLにアクセスしてください。

http://localhost:3000/

「Welcome to Express」が表示されていれば、無事環境が構築できています！

おわりに

次回のエントリーは、この環境で Heroku 向けに git リポジトリと連携したプロジェクトを作成したいと思います。ありがとうございました。