Catatan
Akses ke halaman ini memerlukan otorisasi. Anda dapat mencoba masuk atau mengubah direktori.
Akses ke halaman ini memerlukan otorisasi. Anda dapat mencoba mengubah direktori.
Untuk menyebarkan aplikasi berbasis JavaScript ke Azure, Anda memindahkan file atau sekumpulan file ke Azure untuk dilayani melalui titik akhir HTTP. Proses pemindahan file disebut penyebaran.
Prasyarat
- Langganan Azure - buat langganan secara gratis.
- Node.js LTS.
- Akun GitHub jika Anda berencana untuk menyebarkan dari repositori GitHub.
Metode penyebaran
Azure menawarkan berbagai metode penyebaran agar sesuai dengan kebutuhan yang berbeda. Berikut adalah beberapa metode umum:
| Metode | Rincian |
|---|---|
| CLI Pengembang Azure | Ideal untuk pengembang yang lebih memilih alat baris perintah dan perlu mengotomatiskan provisi dan penyebaran sumber daya. |
| Ekstensi Visual Studio Code | Cocok untuk penyebaran manual, pengujian, atau penyebaran yang tidak sering. Memerlukan ekstensi Azure yang relevan yang diinstal secara lokal. |
| Azure CLI | Berguna untuk penyebaran manual atau sesekali. Memerlukan Azure CLI yang diinstal secara lokal. |
| Tindakan GitHub | Terbaik untuk penyebaran otomatis atau berkelanjutan yang dipicu oleh perubahan di repositori GitHub Anda. |
Metode penyebaran lain ada, berdasarkan layanan tertentu. Misalnya, layanan aplikasi Azure mendukung berbagai metode penyebaran:
Anda dapat menyebarkan ulang ke layanan Aplikasi menggunakan salah satu metode yang disediakan meskipun Anda tidak menggunakan metode tersebut untuk menyebarkan awalnya. Anda mungkin memiliki beberapa konfigurasi sebelum menyebarkan ulang jika Anda beralih metode.
Layanan hosting Azure untuk aplikasi JavaScript
Azure menyediakan beberapa layanan hosting yang dioptimalkan untuk skenario aplikasi JavaScript yang berbeda:
| Pelayanan | Terbaik Untuk | Fitur Utama |
|---|---|---|
| Azure Static Web Apps | Aplikasi web modern dengan frontend statis (React, Vue, Angular) dan API tanpa server opsional | SSL gratis, CDN global, lingkungan penahapan pada permintaan pull, autentikasi terintegrasi |
| Azure App Service | Aplikasi web berfungsi lengkap dan REST API | Pensakalan otomatis yang terintegrasi, slot penempatan, integrasi yang mudah dengan layanan Azure |
| Azure Functions | Aplikasi dan layanan mikro tanpa server berbasis peristiwa | Harga bayar per eksekusi, penskalaan otomatis, beberapa pemicu, dan pengikatan |
| Azure Container Apps | Aplikasi kontainer dan layanan mikro | Kontainer tanpa server yang didukung Kubernetes, integrasi Dapr, penskalakan berbasis peristiwa |
Untuk informasi selengkapnya tentang memilih layanan hosting yang tepat, lihat Menghosting aplikasi di Azure.
Langkah-langkah membangun
Bergantung pada kompleksitas aplikasi dan kebutuhan penyebaran, Anda dapat memilih untuk membangun aplikasi JavaScript anda baik sebelum atau selama penyebaran:
- Build sebelum penyebaran: Untuk build yang kompleks atau panjang, kemas aplikasi Anda ke dalam file zip dan sebarkan. Paket penyebaran memungkinkan Anda mengontrol dan menguji build sebelum penyebaran.
- Build selama penyebaran: Untuk build yang lebih sederhana, gunakan variabel lingkungan yang disediakan Azure SCM_DO_BUILD_DURING_DEPLOYMENT=true untuk melakukan build pada aplikasi Anda selama penyebaran.
Slot penggunaan
Slot penyebaran di Azure App Service memungkinkan Anda membuat lingkungan terpisah untuk penahapan dan produksi. Penggunaan slot memungkinkan Anda menguji aplikasi di lingkungan penahapan sebelum menukarnya dengan slot produksi, memastikan penyebaran yang lancar dan bebas kesalahan. Pelajari lebih lanjut tentang slot penyebaran.
Jangan gunakan slot penyebaran untuk mencampur tujuan penyebaran. Semua slot penyebaran berbagi layanan aplikasi sehingga Anda perlu memastikan pola lalu lintas dan penggunaan semua slot yang dimaksudkan sama. Jika Anda memerlukan lingkungan uji atau tahap yang dihosting, itu seharusnya menjadi layanan aplikasi yang terpisah.
Menyebarkan dengan Azure Developer CLI
Azure Developer CLI (azd) menyederhanakan proses penyebaran aplikasi Anda ke Azure. Ikuti langkah-langkah berikut:
Instal Azure Developer CLI.
Temukan proyek yang ada yang menggunakan banyak sumber daya yang sama dengan yang digunakan proyek Anda.
Inisialisasi versi lokal proyek untuk digunakan sebagai templat infrastruktur untuk proyek Anda sendiri.
azd init --template <template-name>Buat sumber daya dan sebarkan kode ke Azure.
azd up
Menyebarkan dengan Visual Studio Code
Untuk menyebarkan atau menyebarkan ulang aplikasi layanan Aplikasi Anda dengan Visual Studio Code, selesaikan langkah-langkah berikut:
Instal ekstensi Azure terkait, misalnya AzureApp Service atau Azure Functions.
Buka penjelajah Azure. Pilih ikon Azure di bilah sisi utama atau gunakan pintasan keyboard (Shift + Alt + A).
Di grup Sumber Daya, pilih langganan dan layanan Anda.
Klik kanan layanan Anda lalu pilih Sebarkan ke Aplikasi Web....
Terapkan ke Azure Static Web Apps
Azure Static Web Apps sangat ideal untuk aplikasi web modern yang dibangun dengan kerangka kerja JavaScript. Untuk mengimplementasikan:
- Instal ekstensi Azure Static Web Apps untuk Visual Studio Code.
- Bangun aplikasi Anda secara lokal untuk memastikan aplikasi berfungsi seperti yang diharapkan.
- Di Visual Studio Code, buka penjelajah Azure dan temukan Azure Static Web Apps.
- Klik kanan pada langganan Anda dan pilih Buat Static Web App.
- Ikuti perintah untuk menyambungkan repositori GitHub Anda. Azure secara otomatis membuat alur kerja GitHub Actions.
- Dorong perubahan ke repositori Anda untuk memicu penyebaran otomatis.
Untuk detail selengkapnya, lihat Menyebarkan aplikasi web Anda ke Azure Static Web Apps.
Menyebarkan ke Azure Container Apps
Azure Container Apps menyediakan hosting kontainer tanpa server untuk aplikasi JavaScript. Untuk menerapkan:
- Kontainerisasi aplikasi Anda menggunakan Docker. Buat Dockerfile di akar proyek Anda.
- Buat dan uji kontainer Anda secara lokal.
- Dorong gambar kontainer Anda ke Azure Container Registry.
- Gunakan ekstensi Azure Container Apps atau Azure CLI untuk membuat dan menyebarkan aplikasi kontainer Anda.
Untuk panduan lengkapnya, lihat Gambaran umum JavaScript di Azure Container Apps.
Menyambungkan ke lingkungan yang dihosting di Azure Anda
- Untuk akses manual atau sesekali ke lingkungan yang dihosting, lihat cara melihat file di lingkungan yang dihosting Azure Anda.
- Untuk akses otomatis atau konsisten, pertimbangkan menyiapkan salah satu metode penyebaran.
Menampilkan file di lingkungan yang dihosting Azure
Ada beberapa cara untuk segera melihat file di aplikasi Web Azure atau aplikasi Fungsi yang dihosting. Jika Anda menggunakan slot di sumber daya yang dihosting, Anda perlu memastikan Anda berada di slot yang benar sebelum melihat file.
Lihat file di portal Azure - pilih Console di bawah Development tools untuk sumber daya hosting Anda.
Menampilkan file di ekstensi Visual Studio Code: - pilih ikon Azure di bilah Aktivitas. Di bagian Sumber Daya, pilih langganan dan layanan Anda. Simpul File menyediakan tampilan berkas jarak jauh Anda.
layanan Azure App dan ekstensi Azure Functions keduanya menyediakan tampilan file jarak jauh.
Menampilkan titik akhir HTTP di portal Microsoft Azure
Lihat titik akhir HTTP Anda dari halaman Gambaran Umum layanan di portal Microsoft Azure.
