BELAJAR PROGRESSIVE WEB APP - PENGERTIAN, KURIKULUM DAN CARA BELAJAR

Masalah memilih harus membuat aplikasi website atau mobile native sudah cukup lama. Perusahaan atau seseorang bingung mana yang lebih baik, membuat website atau aplikasi yang bisa didownload dari PlayStore / App Store, sehingga user tidak perlu terus mengetik URL dan membuka browser sebelumnya.

PWA memberikan fitur lebih dari itu. Dengan memanfaatkan berbagai teknologi modern, website bisa dibuat menjadi rasa ‘native’ aplikasi mobile. Dimana user punya opsi untuk menyimpan (seperti mendownload) websitenya agar mudah dibuka kembali dan mengatur strategi apa yang terjadi ketika websitenya offline.

Selama ini saat internet tidak ada, maka website pun tidak bisa diakses. Dengan PWA, seorang web developer bisa mengatur strategi yang sangat detail apa yang akan terjadi dan apa yang akan ditampilkan saat websitenya berada di jaringan yang lambat bahkan offline.

Secara garis besar ada dua bagian yang perlu kamu kenal, Web App Manifest, bagian tempat menyimpan data-data meta seperti icon dan judul dari aplikasi kamu, dan Kedua Service Worker, sebuah layanan yang berjalan di luar browser bahkan pada saat offline.

Daftar materi kelas Belajar Progressive Web App - PWA

Apa itu pwa ( progressive web app ) , apa saja keuntungannya dan bagaimana cara membuatnya? kita akan melihat bagaimana kekuatan website yang ngga kalah dengan aplikasi native di mobile!

perkenalan progressive web app (PWA)

Berkenalan apa itu progressive web app atau pwa, kenapa penting mengetahui pwa dan apa saja kegunannya

bantuan untuk pwa

Sumber sumber belajar untuk PWA selain di sekolahkoding.com : ada di youtube - PWA Course , website google dev sendiri dan dalam bahasa indonesia ada di Medium WWWID

apa itu serviceworker

Apa itu service worker pada website dan apa kegunannya

apa itu web app manifest

Apa itu web app manifest pada website dan apa kegunannya

membuat api dan menjalankan di https

Untuk latihan menggunakan pwa, kita akan membuat sistem API dan client. API nya sendiri akan dibuat dengan typicode json sebagai server yang lengkap dengan https

aplikasi dasar statis

Sekarang saatnya membuat bagian statis atau sebagai app shell, yang akan kita cache nantinya untuk dikonsumsi user secara offline di aplikasi progressive web app ini

cache statis di serviceworker

Kita lihat bagaimana cara cache bagian statis pada progressive web app dengan menggunakan serviceworker

startegi caching website

Ada banyak strategi caching untuk membuat progressive web app, seperti cache only, network only, cache then network, fallback general dan lainnya. Kita akan lihat apa saja perbedaan dan kapan menggunakannya.

implementasi cache then network

Implementasi startegi caching “cache then network” pada aplikasi progressive web app yang kita buat

membuat web app manifest

Seakrang kita akan membuat file web app manifest jsonnya agar user bia melakukan add to homescreen untuk aplikasi progressive web yang kita buat

Deploy dengan https dan report lighthouse

Kita akan memanfaatkan now dari zeit.com untuk deploy aplikasi dengan mudah, sudah lengkap dengan httpsnya! Selain itu, untuk mereview aplikasi progressive web app yang kita buat, akan menggunakan extensi chrome lighthouse