Express を使用して Node.js Web アプリケーションをビルドし、Azure Cloud Services にデプロイするBuild and deploy a Node.js web application using Express on an Azure Cloud Services

node.js には、コア ランタイムの最小限の機能セットが含まれます。Node.js includes a minimal set of functionality in the core runtime. 多くの場合、開発者は Node.js アプリケーションを開発するときに、サード パーティ モジュールを使用して追加機能を指定します。Developers often use 3rd party modules to provide additional functionality when developing a Node.js application. このチュートリアルでは、Express モジュールを使って新しいアプリケーションを作成します。Express モジュールは、Node.js Web アプリケーションを作成するための MVC フレームワークを提供します。In this tutorial you will create a new application using the Express module, which provides an MVC framework for creating Node.js web applications.

完成したアプリケーションのスクリーンショットは次のようになります。A screenshot of the completed application is below:

"Welcome to Express in Azure" と表示している Web ブラウザー

クラウド サービス プロジェクトの作成Create a Cloud Service Project

注意

このセクションを適切に実行するには、正常に動作している Node.js のインストールと、ご利用のプラットフォーム用の Azure SDK for Node.js が必要です。To successfully complete this section, you must have a working installation of Node.js and the Azure SDK for Node.js for your platform.

"expressapp" という名前の新しいクラウド サービス プロジェクトを作成するには、次の手順を実行します。Perform the following steps to create a new cloud service project named 'expressapp':

  1. [スタート] メニューまたはスタート画面で、Windows PowerShell を検索します。From the Start Menu or Start Screen, search for Windows PowerShell. 最後に、 [Windows PowerShell] を右クリックし、 [管理者として実行] を選択します。Finally, right-click Windows PowerShell and select Run As Administrator.

    Azure PowerShell アイコン

  2. c:\node ディレクトリに移動し、次のコマンドを入力して expressapp という名前の新しいソリューションと WebRole1 という名前の Web ロールを作成します。Change directories to the c:\node directory and then enter the following commands to create a new solution named expressapp and a web role named WebRole1:

     PS C:\node> New-AzureServiceProject expressapp
     PS C:\Node\expressapp> Add-AzureNodeWebRole
     PS C:\Node\expressapp> Set-AzureServiceProjectRole WebRole1 Node 0.10.21
    

    注意

    既定では、Add-AzureNodeWebRole は以前のバージョンの Node.js を使用します。By default, Add-AzureNodeWebRole uses an older version of Node.js. 上記の Set-AzureServiceProjectRole ステートメントは v0.10.21 の Node.js を使用するよう Azure に指示します。The Set-AzureServiceProjectRole statement above instructs Azure to use v0.10.21 of Node. パラメーターには大文字と小文字の区別があることに注意してください。Note the parameters are case-sensitive. Node.js の正しいバージョンが選択されていることを検証できます。このためには、WebRole1\package.jsonengines プロパティを確認します。You can verify the correct version of Node.js has been selected by checking the engines property in WebRole1\package.json.

Express のインストールInstall Express

  1. 次のコマンドを発行して Express ジェネレーターをインストールします。Install the Express generator by issuing the following command:

     PS C:\node\expressapp> npm install express-generator -g
    

    この npm コマンドにより次のような結果が出力されます。The output of the npm command should look similar to the result below.

    Windows PowerShell での npm install express コマンドの出力の表示

  2. WebRole1 ディレクトリに移動し、express コマンドを使用して新しいアプリケーションを生成します。Change directories to the WebRole1 directory and use the express command to generate a new application:

     PS C:\node\expressapp\WebRole1> express
    

    前のアプリケーションを上書きするかどうかを確認するメッセージが表示されます。You will be prompted to overwrite your earlier application. y」または「yes」と入力して続行します。Enter y or yes to continue. Express によって、app.js ファイルと、アプリケーションを構築するためのフォルダー構造が生成されます。Express will generate the app.js file and a folder structure for building your application.

    express コマンドの出力

  3. package.json ファイルに定義された依存関係をインストールするには、次のコマンドを入力します。To install additional dependencies defined in the package.json file, enter the following command:

    PS C:\node\expressapp\WebRole1> npm install
    

    npm install コマンドの出力

  4. 次のコマンドを使用して、bin/www ファイルを server.js にコピーします。Use the following command to copy the bin/www file to server.js. これは、クラウド サービスがこのアプリケーションのエントリ ポイントを見つけられるようにするためです。This is so the cloud service can find the entry point for this application.

    PS C:\node\expressapp\WebRole1> copy bin/www server.js
    

    このコマンドが完了すると、WebRole1 ディレクトリ内に server.js ファイルが作成されています。After this command completes, you should have a server.js file in the WebRole1 directory.

  5. server.js を変更して、次の行から '.' 文字を 1 つ削除します。Modify the server.js to remove one of the '.' characters from the following line.

    var app = require('../app');
    

    この変更を行うと、行は次のようになります。After making this modification, the line should appear as follows.

    var app = require('./app');
    

    ファイル (以前の bin/www) を必要なアプリケーション ファイルと同じディレクトリに移動しているため、この変更が必要です。This change is required since we moved the file (formerly bin/www,) to the same directory as the app file being required. この変更を行った後、 server.js ファイルを保存します。After making this change, save the server.js file.

  6. 次のコマンドを使用して、アプリケーションを Microsoft Azure エミュレーターで実行します。Use the following command to run the application in the Azure emulator:

    PS C:\node\expressapp\WebRole1> Start-AzureEmulator -launch
    

    Welcome to Express メッセージを含む Web ページ

ビューの変更Modifying the View

次に、"Welcome to Express in Azure" というメッセージが表示されるようにビューを変更します。Now modify the view to display the message "Welcome to Express in Azure".

  1. 次のコマンドを入力して、index.jade ファイルを開きます。Enter the following command to open the index.jade file:

    PS C:\node\expressapp\WebRole1> notepad views/index.jade
    

    index.jade ファイルの内容

    Jade は Express アプリケーションで使用される既定のビュー エンジンです。Jade is the default view engine used by Express applications. Jade ビュー エンジンの詳細については、http://jade-lang.com を参照してください。For more information on the Jade view engine, see http://jade-lang.com.

  2. テキストの最後の行に in Azureを追加します。Modify the last line of text by appending in Azure.

    index.jade ファイル。最後の行には "p Welcome to #{title} in Azure" と記載されている

  3. ファイルを保存して、メモ帳を終了します。Save the file and exit Notepad.

  4. ブラウザーの表示を最新情報に更新すると、変更を確認できます。Refresh your browser and you will see your changes.

    ブラウザー ウィンドウで "Welcome to Express in Azure" と表示されたページ

アプリケーションのテストが終了したら、 Stop-AzureEmulator コマンドレットを使用してエミュレーターを停止します。After testing the application, use the Stop-AzureEmulator cmdlet to stop the emulator.

Azure にアプリケーションをデプロイするPublishing the Application to Azure

Azure PowerShell ウィンドウで、 Publish-AzureServiceProject コマンドレットを使用してアプリケーションをクラウド サービスにデプロイします。In the Azure PowerShell window, use the Publish-AzureServiceProject cmdlet to deploy the application to a cloud service

PS C:\node\expressapp\WebRole1> Publish-AzureServiceProject -ServiceName myexpressapp -Location "East US" -Launch

デプロイ操作が完了すると、ブラウザーが開き、Web ページが表示されます。Once the deployment operation completes, your browser will open and display the web page.

Express ページを表示している Web ブラウザー。

次の手順Next steps

詳細については、 Node.js デベロッパー センターを参照してください。For more information, see the Node.js Developer Center.