Membuat aplikasi web Hello World untuk Azure App Service menggunakan Eclipse

Artikel ini menunjukkan langkah-langkah yang diperlukan untuk membuat aplikasi web Halo Dunia dasar dan menerbitkan aplikasi web Anda ke Azure App Service dengan menggunakan Azure Toolkit for Eclipse.

Catatan

Jika Anda lebih memilih menggunakan IntelliJ IDEA, lihat tutorial serupa untuk IntelliJ.

Jika Anda tidak memiliki langganan Azure, buatlah akun gratis sebelum Anda memulai.

Jangan lupa untuk membersihkan sumber daya setelah Anda menyelesaikan tutorial ini. Menjalankan panduan ini tidak akan menghabiskan kuota akun gratis Anda.

Prasyarat

Untuk menyelesaikan langkah-langkah dalam artikel ini, Anda harus menginstal Azure Toolkit for Eclipse, yang memerlukan komponen perangkat lunak berikut:

Catatan

Halaman Azure Toolkit for Eclipse di Eclipse Marketplace mencantumkan build yang kompatibel dengan toolkit ini.

Penginstalan dan kredensial masuk

Langkah-langkah berikut akan memandu Anda melalui proses masuk ke akun Azure di lingkungan pengembangan Eclipse Anda.

  1. Jika Anda belum menginstal plugin-nya, lihat Menginstal Azure Toolkit for Eclipse.

  2. Untuk masuk ke akun Azure Anda, klik Alat, klik Azure, lalu klik Masuk.

    Sign in to Azure in Eclipse IDE.

  3. Di dalam jendela Masuk Azure, pilih Login Perangkat, lalu klik Masuk (opsi percobaan masuk lainnya).

  4. Klik Salin&buka dalam dialog Masuk Perangkat Azure.

  5. Di browser, tempelkan kode perangkat Anda (yang telah disalin saat Anda mengklik Salin&Buka di langkah terakhir) lalu klik Berikutnya.

  6. Pilih akun Azure Anda dan selesaikan semua prosedur autentikasi yang diperlukan untuk masuk.

  7. Setelah berhasil masuk, tutup browser dan kembali ke Eclipse IDE Anda. Dalam kotak dialog Pilih Langganan, pilih langganan yang ingin Anda gunakan, lalu klik Pilih.

Memasang perangkat lunak yang diperlukan (opsional)

Untuk memastikan bahwa Anda memiliki komponen yang diperlukan untuk bekerja dengan proyek aplikasi web, ikuti langkah-langkah berikut:

  1. Klik menu Bantuan, lalu klik Instal Perangkat Lunak Baru.

  2. Dalam dialog Perangkat Lunak yang Tersedia, klik Kelola, dan pastikan versi Eclipse terbaru sudah dipilih (misalnya 2020-06).

  3. Klik Terapkan dan Tutup. Luaskan menu dropdown Bekerja dengan: untuk menampilkan situs yang disarankan. Pilih situs versi Eclipse terbaru untuk mengajukan kueri perangkat lunak yang tersedia.

  4. Gulir ke bawah pada daftar tersebut dan pilih item Web, XML, Java EE dan OSGi Enterprise Development. Klik Berikutnya.

  5. Dalam jendela Detail Instalasi, klik Berikutnya.

  6. Dalam dialog Tinjau Lisensi, tinjau ketentuan perjanjian lisensi. Jika Anda menerima ketentuan perjanjian lisensi, klik Saya menerima ketentuan perjanjian lisensi dan kemudian klik Selesai.

    Catatan

    Anda dapat memeriksa progres penginstalan di sudut kanan bawah ruang kerja Eclipse Anda.

  7. Jika diminta untuk menghidupkan ulang Eclipse guna menyelesaikan penginstalan, klik Hidupkan Ulang Sekarang.

Membuat proyek aplikasi web baru

  1. Klik File, luaskan Baru, lalu klik ...Proyek. Di dalam jendela dialog Proyek Baru, luaskan Web, pilih Proyek Web Dinamis, dan klik Berikutnya.

    Tip

    Jika Anda tidak melihat Web tercantum sebagai proyek yang tersedia, lihat bagian ini untuk memastikan bahwa Anda memiliki perangkat lunak Eclipse yang diperlukan.

  2. Untuk tujuan tutorial ini, beri nama proyek MyWebApp. Layar Anda akan muncul seperti berikut:

    New Dynamic Web Project properties

  3. Klik Selesai.

  4. Di panel Penjelajah Paket sebelah kiri, luaskan MyWebApp. Klik kanan WebContent, arahkan kursor ke Baru, lalu klik Lainnya....

  5. Luaskan Web untuk menemukan opsi File JSP. Klik Berikutnya.

  6. Dalam kotak dialog File JSP Baru, beri nama fileindex.jsp, simpan folder induk sebagai MyWebApp/WebContent, lalu klik Berikutnya.

    New JSP File dialog box

  7. Untuk tujuan tutorial ini, dalam kotak dialog Pilih Templat JSP, pilih File JSP Baru (html 5), lalu klik Selesai.

  8. Ketika file index.jsp Anda terbuka di Eclipse, tambahkan teks untuk menampilkan Halo Dunia! secara dinamis di dalam elemen <body> yang sudah ada. Konten <body> Anda yang sudah diperbarui harus menyerupai contoh berikut:

    <body>
    <b><% out.println("Hello World!"); %></b>
    </body>
    
  9. Simpan index.jsp.

Menyebarkan aplikasi web ke Azure

  1. Di panel Penjelajah Paket sebelah kiri, klik kanan proyek Anda, pilih Azure, lalu pilih Terbitkan sebagai Azure Web App.

    Publish as Azure Web App

  2. Saat kotak dialog Sebarkan Aplikasi Web muncul, Anda dapat memilih salah satu opsi berikut:

    • Pilih aplikasi web yang sudah ada, jika tersedia.

    • Jika Anda tidak memiliki aplikasi web yang sudah ada, klik Buat.

      Di sini, Anda dapat mengonfigurasi lingkungan runtime, grup sumber daya pada paket layanan aplikasi, dan pengaturan aplikasi. Buat sumber daya baru jika diperlukan.

      Tentukan informasi yang diperlukan untuk aplikasi web Anda dalam kotak dialog Buat App Service, lalu klik Buat.

  3. Pilih aplikasi web Anda, lalu klik Sebarkan.

  4. Toolkit akan menampilkan status Diterbitkan di bawah tab Log Aktivitas Azure ketika aplikasi web Anda telah berhasil disebarkan. Status tersebut juga merupakan hyperlink untuk URL aplikasi web Anda yang disebarkan.

  5. Anda dapat menelusuri aplikasi web Anda menggunakan tautan yang disertakan dalam pesan status.

    Browsing your web app

Membersihkan sumber daya

  1. Setelah Anda menerbitkan aplikasi web Anda ke Azure, Anda dapat mengelolanya dengan mengeklik kanan Azure Explorer dan memilih salah satu opsi di menu konteks. Misalnya, Anda dapat Menghapus aplikasi web Anda di sini untuk membersihkan sumber daya pada tutorial ini.

    Manage app service

Memperlihatkan tampilan Azure Explorer

Jika tampilan Azure Explorer tidak terlihat di Eclipse, tampilkan dengan melakukan hal berikut:

  1. Klik Jendela, arahkan kursor ke Perlihatkan Tampilan, kemudian klik Lainnya.

  2. Dalam kotak dialog Perlihatkan Tampilan, perluas Azure, pilih Azure Explorer, kemudian klik Buka.

    Select the Azure Explorer option.

Langkah berikutnya

Untuk melaporkan bug atau meminta fitur baru, buat laporan masalah di repositori GitHub kami. Atau, ajukan pertanyaan di Stack Overflow dengan tag azure-java-tools.

Untuk informasi selengkapnya tentang penggunaan Java dengan Azure, lihat tautan berikut:

Untuk informasi tambahan tentang pembuatan Azure Web Apps, lihat Gambaran Umum Web Apps.