Halo kawan-kawan kembali lagi, pada masih semangat?
Kali ini saya akan mencoba upload website sederhana (sebenarnya hanya landing
page sih) tetapi artikel ini bisa kita jadikan sebagai acuan bahwa semua
website (dalam bahasa pemrograman apapun) dapat kita upload dan deploy di
Microsoft Azure.
Seperti yang saya jelaskan pada artikel sebelumnya
bahwa kita akan menggunakan fitur Web + Mobile dimana difiturnya kita
menggunakan Web App.
Langkah pertama kita Mengklik Menu New > Web +
Mobile + Web App
Gambar 1. Memilih Web App
Selanjutnya, setelah memilih Web App maka akan
tampil sebuah form. Pada form tersebut terdapat : App Name, Subscription, Resource Group dan App Service plan / Location.
Untuk App Name kita akan memberikan
nama virtualearning, nah uniknya disini Microsoft Azure sudah menyediakan
domain tersendiri berupa .azurewebsites.net , dimana nama aplikasi kita (dalam
hal ini URL yang akan di akses) nantinya adalah virtualearning.azurewebsites.net
. Awesome bukan J.
Kemudian setelah mengisi App Name terdapat
Suscription dimana saat memilih sudah
tersedia akun (account) kita itu sebagai apa. Dalam hal ini kita menggunakan
akun Dreamspark
jadi kita akan memilih Dreamspark. Selanjutnya Resource Group kita akan mengesetnya
sebagai Default. Sedangkan untuk App Service plan / Location disini
adalah kita memilih lokasi terdekat dimana kita berada dalam hal ini kita
memilih eastasia(East US 2).
Untuk lebih jelasnya gambarnya akan terlihat seperti
ini :
Gambar 2 : Mengisi Form Web App
Setelah
mengisi semua formnya dan sudah valid kita akan menekan button Create. Kita
akan menunggu upload selesai seperti gambar dibawah ini :
Gambar 3 : Proses Pembuatan Web App
Sukses! Web App sudah dibuat J kita akan mendapatkan notification bahwa
Deployments Succeded, seperti gambar dibawah ini :
Gambar 4 : Hasil Deployment Web App
Digambar
juga terlihat URL kita sudah terbuat dengan nama : http://virtualearning.azurewebsites.net
. Untuk memastikan apakah Web Apps kita sudah terbuat kita bisa mengaksesnya dengan
mengklik URL di atas, interface awalnya akan seperti gambar di bawah ini :
Gambar 5 : Akses URL http://virtualearning.azurewebsites.net
Setelah Web Apps sudah jadi sekarang kita akan
melakukan upload landing page login yang akan mengganti halaman di Gambar 5.
Kembali ke Microsoft Azure untuk melakukan publishing (dalam hal ini mengupload
sebuah website) kita akan meng-upload website menggunakan FTP, di FTP kita
perlu mengatur Deployment Credential terlebih dahulu. Deployment Credential disini kurang lebih sebagai otentikasi untuk
mengupload sebuah website menggunakan FTP. Untuk lebih jelasnya gambar dibawah
ini akan menunjukkan dimana letak FTP dan Deployment Credential :
Gambar 6 : FTP dan Deployment Credential
Seperti yang kita lihat di gambar di atas FTP
terdapat di Form virtualearning dan Deployment Cridentials terdapat di Form
Settings > Publishing > Deployment Credentials.
Sekarang kita akan mengatur ulang Deployment
Credentialnya terlebih dahulu. Setelah meng-klik Deployment Credentials maka
akan muncul form baru dimana tersedia : Ftp/deployment
username, Password dan Confirm Password. Kita akan mengisi form tersebut
dan mengeset username dan password kita, setelah itu kita akan Klik Save.
Gambar 7 : Re-Set Deployment Credentials
Setelah
meng-klik save seperti pada gambar di atas akan muncul notifications bahwa
Deployment Credentials sudah berhasil di atur.
Untuk
mengakses FTPnya kita perlu copy dan Masukkan di URL, dapat dilihat seperti
gambar di bawah ini :
Gambar 8 : Akses FTP
Setelah mengakses FTP tersebut di URL kita akan
diarahkan untuk memasukkan username dan Password. Setelah itu klik Log on.
Interface setelah log on akan seperti gambar di bawah :
Gambar 9 : FTP setelah log on
Pada gambar di atas kita dapat melihat 2 Directory
di antaranya : LogFiles dan site.
Directory yang kita gunakan disini adalah site
> wwwroot > Direktori utama
(tempat menyimpan File Website.
Gambar 10 : Direktori utama
By default di direktori utama kita sudah terdapat
file html. File tersebut akan kita hapus dan menggantinya menjadi landing page
login J
. Untuk menghapusnya kita akan menggunakan cara Open FTP site in File Explorer.
Perlu
diketahui, kita disini menggunakan browser internet explorer untuk membuka Open FTP site in File Explorer.
Yang perlu dilakukan adalah : View > Open
FTP site in File Explorer.
Setelah meng-kliknya kita akan diarahkan ke folder
explorer dan akan memasukkan Username dan Password (Tentu saja username dan
Password yang sama saat kita mengakses FTP di URL).
Gambar 11 : Akses FTP menggunakan File Explorer
Setelah memasukkan User name dan Password maka kita
akan melihat directory yang sama seperti saat kita mengakses URL, kita hanya
perlu mengarah ke Direktori Utama setelah itu menghapus file default dan menggantinya
menjadi file landing page login.
Gambar 12 : Mengganti file default
Setelah
itu kita kembali ke URL dan merefreshnya apakah file yang kita ganti diatas
akan sesuai pada URL.
Gambar 13 : Hasil perubahan default file
WOW
!!! Berhasil !! Mari kita Klik dan lihat Hasilnya J
Gambar 14 : Halaman Utama Web App
Sekarang halaman Utama Web Apps yang kita buat sudah
berubah menjadi landing page login sederhana J. Intinya kita dapat mendeploy dan mengupload
website dalam bentuk apapun, dalam bahasa pemrograman apapun di Microsoft
Azure.
Keren kan?!
Tambahan kita bisa menggunakan tools untuk
mengupload langsung file tanpa menggunakan FTP, salah satu toolsnya adalah Visual
Studio Community 2015.
Mungkin saya tidak akan menunjukkan caranya tapi
hanya memperlihatkan fitur apa yang digunakan untuk mengupload file website apa
saja menggunakan tools Visual Studio Community 2015.
Baik, sekarang kita buka Visual Studio 2015. Setelah
kita membuka file website / project, kita akan melihat beberapa directory di
sebelah kanan kita klik kanan > Publish seperti gambar di bawah ini :
Gambar 15 : Upload Web di Visual Studio 2015
Gambar 16 : Mengatur FTP
Kita sisa mengatur Username dan Passwordnya.
Setelah itu kita kembali ke Website Microsoft Azure,
di menu Web App yang telah kita buat tadi terdapat fitur Get Publish Profile
dimana fungsinya sebagai perantara antara Visual Studio dan Microsoft Azure,
nah disini setelah kita mengatur sedemikian rupa kita sisa mengupload filenya
menggunakan Visual Studio 2015 dan jangan lupa jika kita ingin menggunakan Web
Apps sebelumnya jangan lupa untuk menghapus terlebih dahulu file yang berada di
direktori utama J
.
Baik, mungkin sampai disini dulu. Mohon maaf yang
sebesar-besarnya jika terdapat banyak kesalahan kita sama belajar dan menimbah
ilmu jika ada kritik dan saran bisa di tinggalkan di komentar atau langsung
hubungi saya J
.
Tag :
IT
0 Komentar untuk "Upload Website di Microsoft Azure"