Mengonfigurasi lingkungan pengembangan JavaScript Anda untuk Azure

Saat Anda membuat aplikasi cloud, pengembang biasanya lebih suka menguji kode di stasiun kerja lokal mereka sebelum menyebarkan kode tersebut ke lingkungan cloud seperti Azure. Pengembangan lokal memberi Anda keuntungan dari berbagai macam alat dan lingkungan yang sudah dikenal.

Artikel ini memberikan instruksi penyiapan untuk membuat dan memvalidasi lingkungan pengembangan lokal yang cocok untuk JavaScript dengan Azure.

Pembuatan langganan satu kali

Sumber daya Azure dibuat dalam langganan dan grup sumber daya.

Jenis

Keterangan

Langganan percobaan

Buat langganan uji coba gratis.

Langganan yang sudah ada

Jika Anda sudah memiliki langganan, akses langganan yang sudah ada dengan:

• Portal Azure
• Azure CLI
• Perpustakaan klien Azure untuk JavaScript
• Ekstensi Visual Studio Code

Pada beberapa langganan

Jika Anda perlu mengelola beberapa langganan, pelajari cara membuat grup manajemen dengan JavaScript.

Penginstalan perangkat lunak satu kali

Pengembangan Azure dengan JavaScript di stasiun kerja lokal Anda, kami sarankan Anda menginstal alat berikut:

Nama/Penginstal	Deskripsi
Node.js LTS	Pasang lingkungan runtime dukungan jangka panjang (LTS) terbaru untuk pengembangan stasiun kerja lokal. Pelajari selengkapnya tentang memilih versi Node.js untuk Azure.
Visual Studio Code	Visual Studio Code memberi Anda pengalaman integrasi dan pengodean JavaScript yang hebat tetapi tidak diperlukan. Anda dapat menggunakan editor kode apa pun.
Ekstensi Visual Studio Code	Instal ekstensi yang relevan untuk layanan Azure yang ingin Anda gunakan.

Runtime hosting Azure

Saat Anda menggunakan sumber daya Azure sebagai lingkungan hosting untuk aplikasi Anda, seperti aplikasi web Azure atau Azure Functions, verifikasi versi runtime lingkungan pengembangan Node.js lokal Anda Node.js cocok dengan runtime sumber daya Azure yang anda rencanakan untuk digunakan.

Penginstalan lokal yang disarankan

Penginstalan stasiun kerja lokal umum berikut disarankan untuk membantu tugas pengembangan lokal Anda.

Nama	Deskripsi
Azure CLI	CLI lokal atau berbasis cloud untuk membuat dan menggunakan sumber daya Azure.
Azure Developer CLI	Alat baris perintah yang berpusat pada pengembang untuk membangun aplikasi cloud dalam proses kerja pengembang.
Ekstensi Visual Studio Code untuk Azure	Ekstensi Visual Studio Code ke IDE.
Git atau Git for Windows	Alat baris perintah untuk kontrol sumber. Anda dapat menggunakan alat kontrol sumber yang berbeda jika Anda mau.
Docker untuk Windows atau Mac	Gunakan kontainer pengembangan untuk lingkungan pengembangan yang konsisten.
Node.js LTS	Pelajari lebih lanjut

Menginstal Node.js

Azure mendukung versi LTS dari Node.js. Pelajari selengkapnya tentang memilih versi Node.js untuk Azure.

Konfigurasi satu kali untuk autentikasi

Untuk menggunakan kode autentikasi yang sama dalam pengembangan lokal dan lingkungan hosting Azure jarak jauh, gunakan DefaultAzureCredential. Pelajari selengkapnya tentang identitas terkelola ini.

Membuat grup sumber daya untuk proyek Anda

Portal Azure

1. Buka portal Azure di peramban web.

2. Di bilah pencarian, masukkan grup sumber daya dan pilih grup tersebut.

3. Pilih + Buat.

4. Masukkan pengaturan grup sumber daya Anda:

   Properti	Nilai
   Langganan	Pilih langganan Anda.
   Grup sumber daya	Masukkan nama grup sumber daya Anda. Nama grup sumber daya ini digunakan sebagai bagian dari URI sumber daya saat Anda mengakses Resource Manager (bidang manajemen). Nama tidak digunakan untuk kontrol (seperti membuat database) atau bidang data (menyisipkan data ke dalam tabel).
   Wilayah	Pilih wilayah geografis untuk grup sumber daya.

5. Pilih Tinjau + buat untuk memulai validasi.

6. Saat validasi berhasil, pilih Buat.

Visual Studio Code

1. Buka palet perintah, Ctrl + Shift + P.

2. Cari buat grup sumber daya dan pilih.

3. Jawab perintah menggunakan pengaturan berikut:

   Pesan	Nilai
   Pilih langganan	Masuk ke Azure jika diminta. Pilih langganan yang sudah ada atau buat akun Azure jika Anda tidak memilikinya.
   Masukkan nama grup sumber daya baru.	Masukkan nama grup sumber daya Anda. Nama grup sumber daya ini digunakan sebagai bagian dari URI sumber daya saat Anda mengakses Resource Manager (bidang manajemen). Nama tidak digunakan untuk kontrol (seperti membuat database) atau bidang data (menyisipkan data ke dalam tabel).
   Pilih lokasi untuk sumber daya baru.	Pilih wilayah geografis untuk grup sumber daya.

Azure CLI

1. Masuk ke Azure:

   az login
   

   Selesaikan autentikasi di browser.

2. Cantumkan nama langganan dan ID Anda. Salin nilai SubscriptionId untuk menggunakan perintah berikutnya.

   az account subscription list --output table 
   

3. Atur langganan default Anda, yang digunakan oleh perintah berikutnya:

   az account set --subscription YOUR_SUBSCRIPTION_ID
   

4. Pilih dari daftar lokasi yang didukung untuk langganan Anda. Salin nilai Nama wilayah yang dekat dengan Anda.

   az account list-locations --output table
   

5. Gunakan Azure CLI berikut untuk membuat grup sumber daya dengan nama langganan atau ID Anda:

   az group create --name "YOUR_RESOURCE_GROUP_NAME" --location YOUR_REGION
   

   Contohnya:

   az group create --name "my-azure-app" --location westus
   

Bekerja menggunakan Azure dan pustaka klien Azure SDK

Pustaka klien Azure disediakan secara individual untuk setiap layanan. Anda memasang setiap pustaka berdasarkan layanan Azure yang perlu Anda gunakan.

Setiap proyek baru yang menggunakan Azure harus:

• Buat sumber daya Azure.
• Instal pustaka klien Azure dari manajer paket seperti NPM.
• Gunakan identitas terkelola untuk mengautentikasi dengan pustaka klien Azure, lalu gunakan informasi konfigurasi untuk mengakses layanan tertentu.

Mengamankan informasi konfigurasi

Anda memiliki beberapa opsi untuk menyimpan informasi konfigurasi:

• Azure Key Vault untuk membuat dan memelihara rahasia, kunci, dan sertifikat yang mengakses sumber daya cloud, yang belum menawarkan akses identitas terkelola.
• Dotenv adalah paket npm yang populer untuk membaca variabel lingkungan dari file .env. Pastikan untuk menambahkan .env file ke .gitignore file sehingga .env file tidak diperiksa ke kontrol sumber.

Membuat variabel lingkungan

Untuk menggunakan pengaturan Azure yang diperlukan pustaka Azure SDK agar bisa mengakses cloud Azure, tetapkan nilai paling umum ke variabel lingkungan. Perintah berikut mengatur variabel lingkungan untuk stasiun kerja lokal.

Dalam contoh berikut, ID Klien adalah ID perwakilan layanan dan rahasia perwakilan layanan.

Bash

AZURE_SUBSCRIPTION_ID="<REPLACE-WITH-YOUR-AZURE-SUBSCRIPTION-ID>"
AZURE_TENANT_ID="<REPLACE-WITH-YOUR-AZURE-TENANT-ID>"
AZURE_CLIENT_ID="<REPLACE-WITH-YOUR-AZURE-CLIENT-ID>"
AZURE_CLIENT_SECRET="<REPLACE-WITH-YOUR-AZURE-CLIENT-SECRET>"

Cmd

set AZURE_SUBSCRIPTION_ID="<REPLACE-WITH-YOUR-AZURE-SUBSCRIPTION-ID>"
set AZURE_TENANT_ID="<REPLACE-WITH-YOUR-AZURE-TENANT-ID>"
set AZURE_CLIENT_ID="<REPLACE-WITH-YOUR-AZURE-CLIENT-ID>"
set AZURE_CLIENT_SECRET="<REPLACE-WITH-YOUR-AZURE-CLIENT-SECRET>"

Ganti nilai dalam <> tanda kurung dalam perintah ini dengan variabel lingkungan spesifik Anda.

Membuat .env file

Mekanisme umum lainnya adalah dengan menggunakan paket NPM DOTENV untuk membuat file .env untuk pengaturan ini. Jika Anda berencana menggunakan .env, pastikan untuk menambahkan file ke .gitignore agar file tidak dimasukkan ke dalam kontrol sumber. Menambahkan file .env ke file .ignore git adalah cara standar untuk memastikan pengaturan tersebut dicek masuk ke kontrol sumber.

Memasang paket npm

Untuk setiap proyek, sebaiknya selalu buat folder terpisah, dan file package.json sendiri menggunakan langkah-langkah berikut:

1. Buka terminal, perintah, atau bash shell dan buat folder baru untuk proyek tersebut. Lalu pindah ke folder baru.

   mkdir MY-NEW-PROJECT && cd MY-NEW-PROJECT
   

2. Inisialisasi file paket:

   npm init -y
   

   Perintah ini membuat file package.json dan menginisialisasi properti minimum.

3. Instal pustaka klien Azure yang Anda butuhkan, seperti contoh pustaka klien autentikasi ini:

   npm install @azure/identity
   

Menggunakan kontrol sumber dengan Visual Studio Code

Kami menyarankan Anda membiasakan diri membuat repositori kontrol sumber setiap kali memulai proyek. Anda dapat melakukan ini dari Visual Studio Code.

1. Di Visual Studio Code, pilih ikon kontrol sumber untuk membuka penjelajah Kontrol Sumber, lalu pilih Inisialisasi Repositori untuk menginisialisasi repositori Git lokal:

   

2. Setelah repositori diinisialisasi, dan Anda memiliki file untuk disimpan dalam pengendalian versi, masukkan pesan Initial commit dan pilih tanda centang untuk membuat commit awal file sumber Anda.

   

3. Buat repositori baru di GitHub dan salin URL repositori untuk beberapa langkah berikutnya.

4. Di terminal terintegrasi Visual Studio, gunakan perintah git berikut untuk menambahkan repositori jarak jauh ke repositori lokal Anda. Ganti <YOUR-ACCOUNT> dan <REPOSITORY> dengan nilai Anda sendiri.

   git remote add origin https://github.com/<YOUR-ACCOUNT>/<REPOSITORY>
   

Visual Studio Code menyertakan banyak fitur git bawaan. Untuk informasi selengkapnya, lihat Menggunakan Kontrol Versi di Visual Studio Code.

Langkah berikutnya

• Membuat dan menggunakan prinsipal layanan
• Mengautentikasi dengan modul Azure untuk Node.js