Aplikasi Webview Menggunakan PWA (Progressive Web App)
Sebelum membahas cara membuat webview dengan PWA, sebaiknya kita mengetahui apa itu PWA atau Progressive Web App. PWA (Progressive Web Apps) iyalah sejenis perangkat lunak aplikasi yang dijalankan pada peramban web, tetapi memiliki tampilan dan fungsi yang sama layaknya aplikasi mobile pada umumnya. PWA biasa dibangun menggunakan teknologi-teknologi web seperti HTML, CSS, php, dan Javascript atau istilah lainnya adalah website yang dibuat menjadi aplikasi mobile. PWA ini lebih ringan dari aplikasi mobile pada umumnya, kenapa ?
karena source code PWA tidak diinstal langsung pada perangkat yang digunakan, mekanisme penggunaan sama persis seperti website, hanya perlu merequest halaman yang akan ditampilkan saja. Meski berjalan di peramban website, aplikasi PWA tidak menampilkan navigator browser.
Sehingga hal ini seperti memberikan pengalaman yang sama saat menggunakan aplikasi native (aplikasi mobile) dan PWA dapat dijalankan di browser apapun itu. Publikasi web progresif seperti web pada umumnya. Saat ada pembaharuan sistem maka developer hanya perlu memperbaiki websitenya, dan PWA yang terinstall akan otomatis mendapatkan pembaharuan itu. Hal ini sangat memudahkan developer karena pengembangan aplikasi dapat dibuat sekali saja.
Keunggulan PWA
- Fast : Mempersingkat loading time pada tiap halaman aplikasi, Kalo aplikasi native ukurannya bisa puluhan bahkan ratusan mega, untuk PWA hanya beberapa mega saja, kenapa hal ini bisa terjadi ? karena source code tidak diinstall di PWA, tapi tetap di dalam server. Layaknya website, PWA hanya merequest halaman yang dibutuhkan pengguna saja, sehingga PWA dapat menghemat data dan ruang penyimpanan.
- Less Cost : Dengan PWA, perusahaan bisa lebih hemat karena website yang sudah ada dapat dioptimalkan menjadi aplikasi mobile. Sehingga anggaran perusahaan dapat dialokasikan ke hal lain yang lebih penting.
- Fast-Development : Pengembangan PWA lebih cepat kenapa ? karena developer dapat menggunakan website yang sudah ada. Developer atau programmer tidak perlu membuat project aplikasi yang berbeda dengan bahasa pemrograman dan teknologi yang berbeda pula, dan dengan hanya memahami bagaimana website tersebut diterjemahkan ke PWA developer dan programmer tidak perlu waktu lama untuk membuat aplikasi PWA yang cantik dan professional.
Membuat Website Menjadi Aplikasi dengan PWA
- Pertama sekali kamu harus memiliki website kamu sendiri, Contohnya (Freehost.id)
- Kemudian buat akun github kamu sendiri, tujuannya agar nanti file manifest.json dihosting melalui github kamu saja jadi setidaknya kamu paham dasar github. Untuk contoh file manifest.json kamu bisa melihat punya saya kemudian kamu ubah sesuai keinginan kamu sendiri. Manifest.json
- Pada file manifest.json yang saya bagikan untuk name, shortname, start_url, dan deskripsinya bisa kamu sesuaikan dengan websitemu sendiri kemudian untuk src ganti dengan link gambar logo kamu.
- Selanjutnya jika semua sudah selesai, kamu salin url/ link file github manifest.json kamu kemudian buka statically.io kamu Pastekan link url kamu pada website statically.io
- Kamu akan mendapatkan url cdn setelah melakukan hal di atas, selanjutnya kamu copy url yang kamu dapat dan pastekan kedalam sourcecode website kamu di bawah tag <head> atau di atas tag </head>
<link href="URL HOSTING FILE manifest.json kamu" rel="manifest"></link>
Jika cara diatas kamu lakukan benar maka ketika kamu mengakses website kamu menggunakan Google Chrome - Klik Tombol Titik 3 sebelah kanan atas - Pilih Tambahkan Ke Layar Utama maka website kamu akan menjadi aplikasi mobile.
Catatan : Saya sarankan jika website kamu memiliki iklan dari google Adsense dan ingin kamu jadikan Aplikasi mobile (webview) saya sarankan menggunakan PWA saja, karena setelah saya telusuri dari berbagai informasi yang saya dapat webview yang menggunakan Google Adsense kemudian di publish ke playstore berpotensi di banned akun Adsensenya.
