Wednesday, August 22, 2018

Penjelasan Mudah Script Manifest JSON untuk Aplikasi Web Progressive

Mulustrasi Aplikasi Web Progressive - Nizwar ID
Aplikasi Web Progressive adalah Aplikasi yang berguna untuk mempermudah visitor saat mengakses situs kita, aplikasi jenis ini bisa didapat tanpa Download dan Install Aplikasi karena pengembangannya bukan dari Build App, tapi mengembangkan dari Situs itu sendiri dengan memasukan Script Manifest JSON.

Buat yang udah sampe disini tanpa membaca artikel gue sebelumnya tentang "Buat Aplikasi Progressive Website / Blog Dengan Manifest JSON (Tanpa App Maker)", pastikan lo baca dulu disitu 😅 biar lebih afdol.

Dannn.... lagi... Ini sebenernya lanjutan dari artikel gue yang Buat Aplikasi Progressive Website / Blog Dengan Manifest JSON (Tanpa App Maker), karna disana udah kepanjangan, jadi gue buat artikel dengan tema dan judul yang baru 😅, dan disini buat mereka yang penasaran sama fungsi-fungsi script yang gue kasi di artikel itu.

Okeh langsung aja kita masuk ke pembahasan tentang Script Manifest JSON buat bikin Aplikasi Web Progressive, cekidot!

Penjelasan Script

Untuk penjelasan script, seharusnya lo bisa tau sendiri dengan membaca variabel atau nama nilai JSON yang dipake, tapi lebih rinci gue jelasin disini.

Fungsi short_name

"short_name": "Nizwar ID"
Ini berfungsi untuk memberi nama shortcut... ituloh yang buat ditampilkan dibawah shortcut, nilainya berupa String dan pastikan lo ga isi lebih dari 12 karakter huruf karna ini format seharusnya penggunaan Short_Name.

Fungsi Name

"name": "Mochamad Nizwar Syafuan"
Fungsi ini sama kaya short_name, nilai berupa String, tapi pada fungsi Name, lo bisa isi lebih dari 12 karakter (seharusnya min 20 karakter, maksimal 30 karakter), saat Splash aplikasi dimunculkan, tulisan Nama ini bakal  ikut dimunculkan dibawah Logo, sebenernya juga lo bisa isi Ini tanpa membuat short_name, karna fungsi ini juga bisa dipake buat nama shortcut, tapi biar lebih lengkap, gunakan short_name juga.

Fungsi Objek Icons

"icons": [{'src':'Link Gambar','type':'image/png','sizes':'128x128'},{dst....}]
Icons ini berupa objek Array, dimana isinya ada Src (Diisi dengan link sumber gambar), Type (Diisi dengan jenis File yang diupload, dalam hal ini "image/png" yang artinya gambar PNG) dan Sizes (Diisi dengan dimensi gambar kaya "128x128"), juga... karna Icons bersifat array, jadi ini seharusnya diisi lebih dari 1, dalam script gue diataskan ada 7 tuh, jadi tinggal lo sesuaikan aja, tapi kalo mau diisi 1 doang, pastikan resolusinya gede biar ga pecah, saran sih ukuran 256px atau 512px.

Fungsi Background_color

"background_color": "#e74c3c"
Ini fungsi buat ngasi warna pada latar belakang, misalnya pada Splash, nah latar belakang tampilan itu bakal berwarna sesuai kaya ini, tipe datanya String, mantepnya diisi dengan Warna berupa Hexa, kaya contoh script itu, warnanya Merah, ah lu pasti tau lah.. hehe...

Fungsi Display

"display":"standalone"
Fungsi ini ada dua Opsi, ada Standalone sama Browser, dimana masing-masing punya fungsi tersendiri dalam menampilkan Web, yang Standalone dia ga munculin Bar Navigasi jadi web pas dibuka mirip punya aplikasi tersendiri geto, sementara Browser dia nampilin kaya tampilan Browser Chrome, ya gitu aja sih, lengkapnya kaya gini.
Tampilan Display Browser dan Standalone - Nizwar ID

Fungsi Orientation

"orientation":"portrait"
Mungkin ini lo udah tau, dimana Aplikasi akan terbuka sesuai dengan nilai yang diisi, seperti seharusnya nilainya cuma dua yaitu Portrait sama Landscape (Berdiri atau Miring hehe), di script gue kan pake Portrait tuh, lo bisa ganti dah sama Landscape kalo mau.

Fungsi Theme_color

"theme_color":"#e74c3c"
Ini untuk memberi warna pada Address Bar (kalo lo display dengan browser), sama itu bar navigasi yang diatas itu (gatau namanya) 😅, pokonya warna tema Aplikasi lo bakal disesuaikan dengan warna yang disetting, nilai berupa String dan isi dengan Hexa Warna kaya fungsi Background_color.

Fungsi Start_url

"start_url": "/"
Terakhir adalah fungsi Start_url, sesuai dengan namanya, ini berfungsi dari mana situs lo bakal diload, gue menggunakan simbol "/", itu berarti Website bakal dimulai dari Halaman Awal alias https://www.nizwar.id/ tanpa ada embel-embel, lo bisa isi ini dengan yang lain, misalnya buat nyambut pengguna lo pas buka Shortcut URL ini.

Nah begitulah penjelasan-penjelasan dari Script yang gue bahas di Buat Aplikasi Progressive Website / Blog Dengan Manifest JSON (Tanpa App Maker), ga bosen gue ingetin kalo ini Progressive App yang artinya hanya berupa Fitur dari Android untuk membuat Website kita dibuka dengan Browser yang tampilannya udah disesuaikan sama fungsi diatas, kalo lo mau bikin versi Nativenya, baca disini : Jasa Blog to APK, Istimewakan Blogmu. Okeh sekian artikel kece gue kali ini, See ya! 😘.

Cari dengan kata-kunci :

  • Manifest JSON Progressive App

  • Dokumentasi Manifest JSON Web App

  • Script Manifest JSON Web App

  • Penjelasan Manifest JSON Website Progressive App

Bagikan Ke Temen-Temen mu!

Related

0Komentar