20分で試せるNode.js入門

はじめに

Node.jsに以前から興味があり、ドットインストールで公開されている手続きを試してみました。

その際の環境構築方法や手順をまとめました。

読者対象者

Node.jsでとにかくHello Worldしたい入門者の方

この記事で何が学べるか

・簡易なローカルサーバの構築方法（インストールして起動するだけ）。

・Node.jsによるコーディング方法、動作確認方法。

① 動作環境

・Windows 8.1

・Google Chrome最新版

・テキストエディタ（Sublime Textなど。メモ帳でも何でもOK）

 

 

② 環境構築

● Node JSのインストール

Node.jsの公式サイトから、最新版をダウンロードしてインストールします。

 

● ローカルサーバ環境の構築

XAMPPのインストール

XAMPPの公式サイトから、最新版をダウンロードしてインストールします。

 

③ 動作確認

● コーディング

テキストエディタを開きます。

ドットインストールで紹介されている、Webサーバのサンプルコードを記述します。

以下、記述するサンプルコード「server.js」を掲載します。

 

 

記述後、「server.js」という名称にして、適当な場所へ保存します。

 

 

※ 注意点：

以上のサンプルコード内10行目におけるIPアドレス（192.168.33.72）は、

ご利用のPC環境によって異なります。

 

 

● XAMPPの起動

apacheサーバが自動的に起動します。

もし起動しない場合は、下画像の様に、アプリを右クリックして「管理者として実行」を選択します。

 

 

 

● Node.jsの起動

下図赤枠の「Node.js command prompt」を実行します。

後ほど作成するJavaScriptファイルの実行は、「Node.js command prompt」を利用。

※下図青枠の「Node.js」という実行ファイルは、今回利用しません。

 

 

● JavaScriptファイルの実行

作成した「server.js」を、Node.jsのコマンドプロンプトから実行します。

「server.js」を保存したディレクトリに移動し、以下のコマンドで実行します（下図）。

 

> node server.js

 

実行後、コマンドプロンプト上に、「server listening...」のテキストが表示されます。

● ブラウザでローカルサーバへアクセス

ブラウザを開き、検索バーに"IP Address : 1337"を入力します。

※注意点：IPアドレスは、ご利用のPC環境によって異なります。

 

● 実行結果の確認

以下の結果が表示されます。

 

 

 

● 【補足】 コード内の「1337」という数字はなに？

「1337」は、Node.js用に割り当てられるポート番号です。

ポート番号を確認するには、XAMPPのコントロールパネルから、「Netstat」ボタンを選択します。

 

Node.js用に、「1337」のポートが割り当てられている事を確認できます。 

 

● さいごに

とにかくNode.jsでHello Worldしたい入門者の方向けに記事を書きました。

色々と割愛した内容もありますが、ご参考いただけると幸いです。

 

 

● 参考サイト

・Node.js公式サイト

・XAMPP公式サイト

・ドットインストール

・XAMPPにおいてApacheが起動しない際の対処方法