Anda Perlu Memastikan bahwa Situs Web Anda sudah PWA-Ready
Langkah pertama yang perlu Anda lakukan untuk membangun progressive web App adalah dengan memastikan bahwa situs web yang Anda bangun sudah dalam mode PWA-Ready. Apa maksudnya? Hal ini tentu saja jauh sekali berbeda dengan pengoperasian aplikasi mobile. Dalam hal ini, Anda tidak perlu menunggu persetujuan Google atau bahkan Apple serta Windows untuk mempublikasikan aplikasi Anda tersebut.Untuk membuat situs web Anda agar sudah berada dalam mode PWA-Ready, Anda bisa menggunakan Lighthouse. Nantinya, aplikasi ini akan membantu Anda melakukan audit pada situs web guna memastikan apakah situs Anda tersebut sudah sesuai dengan ketentuan penggunaan untuk PWA.
Lakukanlah dengan cara mengunjungi situs web Anda menggunakan Google Chrome, lalu bukalah menu Developer Tools pada titik tiga sebelah kanan browser (Menu More Tools), selanjutnya pilih menu Audits, lalu pilih Run Audits. Setelah itu, pastikan bahwa hasilnya sudah menunjukkan warna hijau pada kategori PWA.
Baca juga : Domain Gratis hanya di DomaiNesia
Melakukan Pembuatan Web App Manifest
Langkah selanjutnya yang bisa Anda lakukan untuk membangun progressive web app adalah dengan membuat web app manifest. Yang dimaksud dengan web app manifest di sini adalah sebuah file JSON yang memuat tentang berbagai macam informasi seperti contohnya saja nama situs web, ikon dan juga ukuran yang digunakan, warna default situs web, home screen atau laman utama, orientasi pada layar dan juga splash screen yang ada.Jangan bingung mengenai langkah yang satu ini karena ada banyak sekali contoh web app manifest yang bisa membantu Anda untuk memahami dan melakukan langkah yang satu ini.
Melakukan Penambahan Web App Manifest ke Dalam Template
Perlu Anda ketahui bahwa penambahan web app manifest ke template aplikasi adalah salah satu langkah untuk membangun progressive web app. Memang sebaiknya web app manifest perlu ditambahkan ke level terendah dari sebuah template aplikasi yang Anda bangun. Hal tersebut dilakukan sebagai upaya terlihat oleh browser saat sedang melakukan proses instalasinya (proses pemasangan).Misalnya, sebagai contoh yang bisa diterapkan. Anda bisa saja menambahkan manifest tersebut pada bagian <head> template yang Anda miliki. Contohnya, <link rel=”manifest”href=”/static/manifest.json”>. Nantinya, dijamin situs web Anda akan memiliki performa dan kecepatan yang mumpuni demi keamanan para penggunanya.
Membuat Sebuah Service Worker
Service worker merupakan salah satu kelebihan ketika seseorang menggunakan PWA untuk situs web yang ia miliki. Nah, untuk membangun progressive web app untuk kepentingan situs, service worker juga merupakan salah satu hal yang perlu Anda rancang. Seperti yang sudah kita ketahui bahwa service worker adalah sebuah script yang bisa dijalankan di balik layar.Service worker nantinya memungkinkan sebuah situs agar tetap berjalan seperti biasa tanpa adanya interaksi dari pengguna sepert auto synchronize, push notifications dan lain sebagainya. Bahkan, Anda juga bisa menambahkan sendiri script service worker Anda ke dalam file. Index template. Dengan begitu, progressive web app untuk situs web Anda bisa dibangun dengan sempurna.
Melakukan Loading Serive Worker
Sebagai salah satu penyempurnaan dalam membangun progressive web app, Anda selanjutnya perlu melakukan ‘load’ service worker yang Anda bangun. Jadi, pastikanlah bahwa Anda melakukan load service worker dengan cara yang tepat agar nantinya ia bisa berfungsi sebagaimana mestinya. Cara melakukan load service worker ini bisa dimulai dengan menambahkan script yang ada ke dalam bagian <body> file tenplate HTML yang Anda miliki.Setelah proses load service worker selesai dilakukan, Anda bisa melakukan pengetesan atau pengecekan ulang atas perubahan yang telah terjadi pada log di konsol dalam browser yang Anda miliki. Jika sudah selesai, Anda sudah mendekati langkah akhir guna membangun PWA untuk kepentingan situs web Anda tersebut.
Melakukan Deploy Progressive Web App
Langkah terakhir dalam membangun sebuah PWA untuk browser Anda ialah dengan melakukan deploy PWA. Pada langkah ini, Anda bisa bebas dalam memilih platform jenis apa saja yang ingin Anda gunakan. Jika proses ini sudah selesai, Anda sudah bisa lho mulai mencoba PWA yang sudah dibuat sebelumnya.PWA sendiri memiliki banyak sekali kelebihan yang bisa berpengaruh baik pada situs web Anda. Salah satunya ialah keberadaannya yang ramah bandwidth dan juga storage penyimpanan. PWA ini memiliki ukuran yang relatif kecil jika Anda bandingkan dengan aplikasi mobile. Untuk itu, jangan ragu untuk membangun progressive web app sekarang juga untuk situs Anda.
Tags
Tip & Trick