PWA: Membuat Progressive Web App dengan Blogger
Sudah banyak Merek terkenal yang membuat Progressive Web Apps (PWA) untuk Website resmi mereka agar dapat memungkinkan pengguna agar dapat menginstal aplikasi Web Lite pada Smartphone serta menggunakan aplikasi tersebut seperti menggunakan Aplikasi khusus Smartphone.
Progressive Web Apps (PWA) juga bagus untuk Branding karena setiap terdapat pengguna yang menginstalnya, Logo dari Brand/Merek tersebut akan tampil seperti aplikasi biasa.
Ada yang mengatakan bahwa Progressive Web Apps tidak dapat dipasang pada Blogger. Sebenernya tetap bisa, tetapi tidak untuk keseluruhannya.
Maka dari itu, pada artikel ini saya akan menunjukkan cara membuat Progressive Web Apps khusus untuk Blog/Website berplatform Blogger/Blogspot agar user dapat menikmati pengalaman seperti menginstall Aplikasi Resmi.
Apa itu Progressive Web Apps?
Apakah kalian pernah melihat Pop-Up yang berisi teks "Add to home screen" ketika mengunjungi salah satu Website di Smartphone dengan menggunakan Browser Google Chrome? Jika pernah, tahukan kalian bahwa Pop-Up tersebut adalah penanda bahwasannya Website tersebut mendukung PWA.Ketika kalian mengklik tombol "Add to home screen" tersebut, maka kalian akan melihat Logo Website yang ditambahkan ke dalam HomeScreen di Smartphone.
Untuk Lebih lengkapnya, kalian dapat melihat artikel tentang Progressive Web App.
Kira-kira tampilannya seperti berikut:
Jika kalian sering mengunjungi dan membaca artikel di EL Creative Academy dengan menggunakan Smartphone, kalian dapat mencobanya dengan memilih Menu (Icon Titik Tiga) > Add to Home Screen (Tambahkan ke Home Screen).
Sekarang kalian bisa melihat bahwa PWA EL Creative Academy telah ditambahkan ke Homescreen Smartphone kalian dan ketika kalian membukanya, kalian dapat menggunakan elcreativeacademy.com seperti halnya aplikasi lain di yang ada di Smartphone.
Nah, apa kalian sudah memiliki dasar pemahaman tentang apa itu PWA? Jika sudah, mari kita mulai membuat Progressive Web App untuk Blogger.
Memasang Progressive Web App di Blogger
Salah satu tahap pertama dalam memasang PWA untuk Blogger adalah membuat Favicon Pack. Jika kalian sudah memiliki Logo Blog/Website, kalian dapat meng-generate Favicon dalam beberapa ukuran. Untuk mempermudahnya, kalian dapat menggunakan layanan dari Favicon.io.Selanjutnya, kalian harus membuat sebuah File berekstensi JSON dan menghubungkannya dengan Blog kalian. Untuk tutorial lengkapnya, kalian dapat melihat artikel Memasang Web App Manifest.
Catatan: Semua tutorial tentang PWA sudah saya bahas pada artikel Memasang Web App Manifest
Itulah beberapa cara untuk memasang PWA di Blogger dengan cara yang mudah, semoga artikel ini bermanfaat dan terimakasih telah berkunjung di EL Creative Academy.