Membuat dan menerapkan aplikasi web Node.js menggunakan Express di Azure Cloud Services (klasik)

Penting

Cloud Services (klasik) sekarang tidak lagi digunakan untuk pelanggan baru dan akan dihentikan untuk semua pelanggan pada 31 Agustus 2024. Penyebaran baru sebaiknya menggunakan Azure Resource Manager yang baru berdasarkan model penyebaran Azure Cloud Services (dukungan tambahan).

Node.js mencakup serangkaian fungsionalitas minimum dalam runtime inti. Pengembang sering menggunakan modul pihak ke-3 untuk menyediakan fungsionalitas tambahan saat mengembangkan aplikasi Node.js. Dalam tutorial ini Anda akan membuat aplikasi baru menggunakan modul Ekspres , yang menyediakan kerangka kerja MVC untuk membuat aplikasi web Node.js.

Di bawah ini adalah cuplikan layar aplikasi yang sudah selesai:

A web browser displaying Welcome to Express in Azure

Membuat Proyek Layanan Cloud

Catatan

Agar berhasil menyelesaikan bagian ini, Anda harus memiliki Node.js dan Azure SDK terpasang untuk Node.js pada platform Anda.

Lakukan langkah-langkah berikut untuk membuat proyek layanan cloud baru bernama expressapp:

  1. Dari Menu Mulai atau Layar Mulai, cari Windows PowerShell. Setelah itu, klik kanan pada Windows PowerShell kemudian pilih Jalankan Sebagai Administrator.

    Azure PowerShell icon

  2. Ubah direktori ke direktori c:\node lalu masukkan perintah berikut untuk membuat solusi baru bernama expressapp dan peran web bernama WebRole1:

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

    Catatan

    Secara default, Add-AzureNodeWebRole menggunakan versi lama Node.js. Pernyataan Set-AzureServiceProjectRole di atas menginstruksikan Azure untuk menggunakan Node v0.10.21. Harap diingat, parameternya peka huruf besar/kecil. Anda dapat memastikan versi Node.js yang benar telah dipilih dengan memeriksa properti mesin di WebRole1\package.json.

Menginstal Express

  1. Instal generator Express dengan mengeluarkan perintah berikut:

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

    Output perintah npm akan terlihat mirip dengan hasil di bawah ini.

    Windows PowerShell displaying the output of the npm install express command.

  2. Ubah direktori ke direktori WebRole1 dan gunakan perintah express untuk menghasilkan aplikasi baru:

    PS C:\node\expressapp\WebRole1> express
    

    Anda akan diminta untuk menimpa aplikasi Anda sebelumnya. Masukkan y atau ya untuk melanjutkan. Express akan menghasilkan app.js dan struktur folder untuk membuat aplikasi Anda.

    The output of the express command

  3. Untuk menginstal dependensi tambahan yang ditentukan dalam file package.json, masukkan perintah berikut:

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

    The output of the npm install command

  4. Gunakan perintah berikut untuk menyalin file bin/www ke server.js. Hal ini agar layanan cloud dapat menemukan titik masuk untuk aplikasi ini.

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

    Setelah perintah ini selesai, seharusnya sudah ada file server.js di direktori WebRole1.

  5. Ubah server.js untuk menghapus salah satu karakter '.' dari baris berikut.

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

    Setelah melakukan modifikasi ini, barisnya seharusnya terlihat seperti berikut.

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

    Perubahan ini diperlukan karena kami memindahkan file (sebelumnya bin/www) ke direktori yang sama dengan file aplikasi yang diperlukan. Setelah melakukan perubahan ini, simpan file server.js.

  6. Gunakan perintah berikut untuk menjalankan aplikasi di emulator Azure:

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

    A web page containing welcome to express.

Mengubah Tampilan

Sekarang ubah tampilan untuk menampilkan pesan "Selamat Datang di Express di Azure".

  1. Masukkan perintah berikut untuk membuka file index.jade:

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

    The contents of the index.jade file.

    Jade adalah mesin tampilan default yang digunakan oleh aplikasi Express.

  2. Ubah baris terakhir teks dengan menambahkan di Azure.

    The index.jade file, the last line reads: p Welcome to #{title} in Azure

  3. Simpan file dan keluar dari Notepad.

  4. Refresh browser dan Anda akan melihat perubahan.

    A browser window, the page contains Welcome to Express in Azure

Setelah menguji aplikasi, gunakan cmdlet Stop-AzureEmulator untuk menghentikan emulator.

Menerbitkan Aplikasi ke Azure

Di jendela Azure PowerShell, gunakan cmdlet Publish-AzureServiceProject untuk menerapkan aplikasi ke layanan cloud

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

Setelah operasi penerapan selesai, browser Anda akan terbuka dan menampilkan halaman web.

A web browser displaying the Express page. The URL indicates it is now hosted on Azure.

Langkah berikutnya

Untuk informasi selengkapnya, lihat Node.js Developer Center.