Mengonfigurasi lingkungan pengembangan JavaScript lokal Anda untuk Azure

Saat membuat aplikasi cloud, pengembang biasanya lebih suka menguji kode pada 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	Deskripsi
Langganan percobaan	Buat langganan percobaangratis.
Langganan yang sudah ada	Jika Anda sudah berlangganan, akses langganan yang sudah ada di portal Azure, Azure CLI, atau Azure SDK for JavaScript.
Di 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, sebaiknya pasang yang berikut:

Nama/Alat Penginstal	Deskripsi
Node.js LTS	Pasang lingkungan runtime dukungan jangka panjang (LTS) terbaru untuk pengembangan stasiun kerja lokal.
Visual Studio Code	Visual Studio Code akan memberi Anda pengalaman pengkodean dan integrasi JavaScript yang hebat, tetapi itu tidak diperlukan. Anda dapat menggunakan editor kode apa pun.

Runtime hosting Azure

Jika Anda berencana untuk menggunakan sumber daya Azure sebagai lingkungan hosting untuk aplikasi Anda, seperti aplikasi web Azure atau Azure Functions, Anda harus memverifikasi versi runtime lingkungan pengembangan Node.js lokal Anda 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 ber sentris pengembang untuk membangun aplikasi cloud di alur 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.

Konfigurasi satu kali untuk autentikasi

Untuk menggunakan kode autentikasi yang sama dalam pengembangan lokal dan lingkungan hosting Azure jarak jauh, gunakan DefaultAzureCredential.

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 untuk membuat grup sumber daya dan memilihnya.

3. Jawab perintah menggunakan pengaturan berikut:

   Prompt	Value
   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
   

   Misalnya:

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

Bekerja menggunakan Azure dan pustaka klien Azure SDK

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

Setiap proyek baru yang menggunakan Azure harus:

• Membuat sumber daya Azure dan menyimpan kunci atau konfigurasi terkait ke lokasi yang aman.
• Memasang pustaka Azure SDK dari NPM atau Yarn.
• Menggunakan info masuk Perwakilan Layanan lokal Anda untuk mengautentikasi ke Azure SDK, lalu menggunakan informasi konfigurasi untuk mengakses layanan tertentu.

Mengamankan informasi konfigurasi

Anda memiliki beberapa opsi untuk menyimpan informasi konfigurasi:

• Azure Key Vault untuk membuat dan memelihara kunci yang mengakses dan mengenkripsi sumber daya, aplikasi, dan solusi cloud Anda.
• Dotenv adalah paket npm yang populer untuk membaca variabel lingkungan dari file .env. Pastikan untuk menambahkan file .env ke file .gitignore sehingga file .env tidak dicek masuk ke kontrol sumber. Pelajari selengkapnya tentang variabel lingkungan di aplikasi web untuk Azure.

Membuat variabel lingkungan untuk pustaka Azure

Untuk menggunakan pengaturan Azure yang diperlukan pustaka Azure SDK untuk 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 yang ditampilkan dalam perintah ini dengan nilai dari perwakilan layanan khusus Anda.

Membuat file .env

Mekanisme umum lainnya adalah dengan menggunakan paket NPM DOTENV untuk membuat file .env untuk pengaturan ini. Jika Anda berencana untuk menggunakan .env, pastikan untuk tidak mengecek masuk file ke 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
   

   Ini membuat file paket.json dan menginisialisasi properti minimum.

3. Pasang pustaka Azure SDK yang Anda butuhkan, seperti contoh ini:

   npm install @azure/ai-text-analytics@5.0.0
   

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 kontrol sumber, masukkan pesan Initial commit dan pilih tanda centang untuk membuat penerapan awal file sumber Anda.

   

3. Buat repositori baru di GitHub atau Azure DevOps 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-ALIAS dan YOUR-REPOSITORY dengan nilai Anda sendiri.

   git remote add origin https://github.com/YOUR-ALIAS/YOUR-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 perwakilan layanan
• Mengautentikasi dengan modul Azure untuk Node.js