Header Ads

Vultr $100

WORDPRESS PROGRESSIVE WEB APPS

Saat ini, memiliki website mungkin nggak lagi menarik perhatian pelanggan potensial. Sampeyan mungkin bertanya-tanya apakah ada cara lain yang bisa dilakukan dengan website Sampeyan agar bisa terlibat dengan pengunjung dan menawarkan pengalaman yang lebih baik kepada mereka, sementara banyak sekali aplikasi-aplikasi berbasis Android dan iOS saling berebutan pasar, entah itu di Apple Store ataupun di Playstore.

Disisi lain, pemilik smartphone Android dan iOS udah enggan menginstall aplikasi-aplikasi baru yang menjejali device dan gadget mereka dimana di lain sisi media penyimpanan bakalan membengkak dan semakin menyempit, mengecil yang efeknya kebutuhan RAM atau memory yang udah besar pun semakin membengkak, dan gak ada pilihan lain selain uninstall aplikasi yang wasted space media, alias gak guna.

Sampeyan sedang kejar tayang work from home making money on the internet with Google Admob by creating android apps? hm, sport jantung aja deh.

Well, Sampeyan yang masih bertahan di dunia webbing, ada opsi yang makin lama makin populer akhir-akhir ini: Progressive Web Application (PWA), jadi gak usah ikutan kepo membuat iOS dan Android apps demi pencapaian target, apalagi jelas dilihat dari sisi urgensi, mungkin bisnis kita belum laku-laku amat.

Dalam pos ini, kita bakal membahas sistem pengembangan aplikasi web, dan bagaimana membangun aplikasi berbasis website menggunakan WordPress. Well, kita bakal mengumpulkan beberapa plugin dan mungkin theme juga yang sanggup melakukannya tanpa repot-repot ngoding apalagi jika Sampeyan termasuk end-user. Ayo mulai!


Apa itu Progressive Web App?

Singkatnya, PWA adalah perangkat lunak yang gunakan tehnik pemrograman website terkini. Biasanya, PWA bisa saja menawarkan pemberitahuan push menggunakan JavaScript. hal ini dapat lebih mudah diperbarui dan tidak memerlukan instalasi yang rumit. Selain itu, bisa bekerja pada setiap pengguna terlepas dari jenis browser yang digunakan, dan cukup aman (biasanya menggunakan secure HTTPS).

PWA terhitung memotong keperluan pengguna untuk menemukan, mengunduh, dan menginstal aplikasi berasal dari toko aplikasi. Mereka dapat berjalan pada browser apa pun, dan tersedia dari layar beranda user. Selain itu, Google baru-baru ini menginformasikan bahwa pembaruan pada browser website Chrome dapat menyertakan kompatibilitas dengan PWA, nah ini yang asik. Ini juga berarti bahwa user mendapatkan faedah PWA Sampeyan di Chrome OS dan desktop, dan Sampeyan dapat memberikan pengalaman yang ditingkatkan lebih dari sekadar perangkat seluler.

Mengapa Harus Mengubah Menjadi Progressive Web Apps?

Saat membandingkan situs web, aplikasi web, dan aplikasi seluler, salah satu elemen yang perlu dipikirkan adalah push notification. Penelitian menunjukkan bahwa pengguna dengan dukungan push memiliki tingkat keterlibatan 88% lebih. Website tradisional biasanya tidak menawarkan opsi ini, tetapi dengan membuat PWA, maka Sampeyan dapat menggabungkan fungsi ini tanpa proses yang berpotensi rumit yang mungkin melibatkan aplikasi seluler.

Kecepatan pemuatan sebuah website juga alasan lain untuk mempertimbangkan hal ini. Jika website Sampeyan loadingnya lambat, Sampeyan bakal kehilangan banyak traffic. Jika Sampeyan mengubah website menjadi PWA, maka Sampeyan nggak lagi khawatir tentang speed website. Konten Sampeyan juga akan tersedia bahkan jika user dalam kondisi sedang offline, dan itu akan auto refresh cepat dan dapat dikembalikan alias refresh mendapatkan konten yang baru.

Google juga menunjukkan bahwa ketika Sampeyan membuat PWA untuk web Sampeyan yang meniru antar muka dari native mobile app, maka kemungkinan Sampeyan memiliki tingkat konversi yang jauh lebih tinggi. Ini bahkan akan lebih baik dibandingkan dengan desain website yang hanya mengacu 'mobile-friendly' native atau sekedar responsive.

WordPress Web Application Development

WordPress dapat menjadi dasar untuk mengembangkan aplikasi. Namun, ini memerlukan pemahaman pengguna (UX), HTML, CSS, PHP, dan JavaScript. Bahkan pembuatan plugin dasar dapat memakan waktu untuk belajar. Adapun, ada banyak manfaat yang bakal didapat.

WordPress Service Workers

Sebuah Service Worker pada dasarnya adalah script yang memungkinkan PWA Sampeyan untuk bisa mengintegrasikan aspek terbaik dari aplikasi web standard dan native. Hal ini biasanya dilakukan dalam programming JavaScript (Library), dan banyak lagi seperti client-side proxy, yang akan memungkinkan Sampeyan untuk menentukan bagaimana menanggapi dengan request resources. Precache akan membantu mengurangi kebutuhan untuk koneksi internet persisten disisi user.

Service Worker mampu menangani push notification dengan mudah, dan juga dapat sinkronisasi data di background dan hal ini sangat-sangat berimbas pada traffic loyal visitor dimana user akan menerima pembaruan update, jadi traffic akan selalu mendapatkan update konten versi terbaru dari web Sampeyan tanpa perlu mereka menginstall aplikasi Android ataupun iOS (Baca kembali awal paragraph artikel ini).

Bagaimana Membangun Web Apps Berbasis Wordpress?

Tergantung pada jenis Progressive Web Application yang pengen Sampeyan kembangkan. Sebagai contoh, Sampeyan perlu mengidentifikasi spesifik jQuery request, test snippet, dan pengemmbangan basis data segmentasi (database returns). Selain itu, Sampeya harus mengintegrasikan variabel untuk variasi platform yang berbeda (serta style element), dan kemudian membungkusnya semua ke dalam kerangka framework dan berfungsi dengan baik.

Sampeyan juga harus memilih back-end dan front-end framework. Tentu saja, karena disini kita bicarakan WordPress, maka WordPress akan menjadi Content Management System (CMS) back-end Sampeyan, tetapi Sampeyan juga akan memilih server stack yang cocok, seperti Apache.

Pilihan Sampeyan untuk front-end akan lebih nyaman dan mudah ketika berkolaborasi dengan WordPress. Banyak optin dalam hal ini baik Bootstrap atau AngularJS, meskipun Facebook ReactJS dan Backbone.js juga lumayan populer:

Ini adalah contoh dari WordPress Application Framework yang didedikasikan untuk menyederhanakan kebutuhan-kebutuhan diatas.

WordPress Web App Themes

Web app themes bekerja mengktifkan WordPress sebagai Progressive Web Application, tanpa perlu fungsionalitas ngoding dari awal. rata-rata sering tampil sempurna dan menawarkan kekuatan terbesar dan fleksibilitas untuk sebuah Progressive Web Application.

Okay mari kita lihat beberapa pilihan tersebut.

a. Ubold

Sebagai permulaan, Ubold adalah salah satu opsi web app theme yang paling populer, dan dibangun di atas Bootstrap:

Ubold menyediakan sejumlah menu style, dengan tambahan fitur ribuan ikon Font Awesome yang pastinya cukup keren untuk diaplikasikan. Sebagai tambahan, Upload juga termasuk contoh Customer Relationship Management (CRM) dan aplikasi eCommerce, untuk menunjukkan kemampuan theme ini.

b. OneUI


OneUI ini (berdasarkan Bootstrap dan AngularJS) memungkinkan Sampeyan untuk membangun front dan back-ends dalam satu framework, dan termasuk empat versi untuk membantu kickstart. Selain itu, dirancang untuk lightweight seringan-ringannya, dan benar-benar sebuah modular, dimana hal ini berarti adalah sebagai fleksibilitas seperti yang Sampeyan butuhkan untuk mengembangkan Progressive Web Apps.

WordPress Web App Plugins

Ada juga plugin WordPress untuk membantu Sampeyan membuat Progressive Web Apps, meskipun bekerja pada skala yang lebih kecil tapi cukup powerful.

a. Super Progressive Web Apps


Super Progressive Web Apps plugins adalah plugins yang cukup membantu secara cepat dan mudah untuk mengubah website Sampeyan menjadi PWA. Pengguna website akan mendapat pesan/notifikasi ketika mengunjungi website Sampeyan pada perangkat yang didukung, mendorong mereka untuk menekan button "Add to Home Screen".. keren yak. Ketika mereka klik pada prompt ini, website Sampeyan akan 'terpasang' pada device mereka sebagai Progressive Web Apps dengan ikon pada layar. Setelah itu, halaman yang terlihat akan dibuat offline kemudian otomatis refresh ketika ada pembaharuan konten pada website Sampeyan.

b. Progressive WordPress (PWA)


Progresif WordPress memungkinkan Sampeyan untuk memberikan visitor sebuah opsi 'add to home screen', dan fungsi seperti aplikasi mobile. Juga memiliki dukungan untuk push notifikasi dan AMP.

Panduan Google Progressive Web Apps

Ketika pengen meng-convert PWA, Google sendiri juga memberikan pedoman yang menyeluruh untuk hal ini. Termasuk daftar isu-isu potensial dan bagaimana memperbaikinya untuk kedua baseline dan perkembangannya. Selain daftar cek pengembang tertentu, Google menyatakan bahwa PWA juga harus dapat diandalkan, cepat, dan engaging.

Google menguraikan beberapa persyaratan lain untuk membuat baseline PWA:
  • Website memiliki fitur HTTPS.
  • Halaman didesain untuk tablet dan perangkat mobile.
  • Semua URL app url dimuat dalam mode luring alias offline.
  • Metadata mesti diberikan bagi penambahan ke fungsi "Add To Homescreen".
  • Loading harus cepat bahkan pada jaringan 3G.
  • Website kudu kompatibel pada cross-browser.
  • Transisi halaman sangat cepat dan lancar tak peduli status jaringan pengunjung.
  • Setiap halaman harus memiliki URL.

Ide terbaik untuk menguji elemen dasar menggunakan Google Lighthouse yang merupakan alat pengembangan Google yang dapat Sampeyan gunakan untuk mengaudit halaman web Sampeyan untuk perbaikan potensial-potensial error yang kemungkinan muncul dan terdeteksi.

Jika Sampeyan lebih jauh pengen mendalami Progressive Web Apps maka saya sarankan merujuk ke Google PWA checklist. Ini termasuk item seperti memverifikasi bahwa isi website PWA Sampeyan juga diindeks oleh Google. Sebagai tambahan, Sampeyan juga harus memastikan telah menggunakan Schema.org metadata pada pilihan yang tepat. Jangan sampai konten web berita Sampeyan aplikasikan menggunakan Schema resep masakan.