1. Halo Guest, pastikan Anda selalu menaati peraturan forum sebelum mengirimkan post atau thread baru.

(SHARE) Tutorial Pemasangan Progressif Web Apps (PWA)

Discussion in 'Pemrograman Web' started by adang234, Jan 6, 2018.

  1. adang234

    adang234 Ads.id Fan

    Joined:
    Jul 23, 2013
    Messages:
    225
    Likes Received:
    19
    Location:
    Bogor rain city
    Assalamualaikum ,ane mau share lanjutan dari postingan ane kemaren yang ngebahas kelebihan progressif web app (Gabungan website dan keunggulan aplikasi).

    Yang belum baca postingan ane kemaren keunggulan menjadikan website kita menjadi PWA ,silahkan kemari saja :
    https://ads.id/forums/index.php?threads/apa-itu-perkawinan-web-dan-apps-p-w-a.298361/#post-3504505

    Langsung saja gan apa saja sih yang perlu kita persiapkan sebelum membuat PWA untuk website wordpress :
    1. (Wajib) memiliki website yang sudah dinstal SSL alias websitenya harus sudah Https ya gan

    2. Memiliki akun file generator PWA (bisa pesan ke ane WA 08811101867 harga Rp.50.000 atau beli sendiri senilai 29$) untuk mendapatkan file yang sudah jadi yang nantinya diinstal di dalam root file manager website kita ada 3 file yang diperlukan (manifest.json,pnotification.js,dan sw.js serta file service worker)

    3. Instal file file tersebut ke dalam root website kita dan tahapannya saya terangkan dibawah ini .
    ------------------------------------------------------------------------------------------------------------------
    Tahap 1 : Buat Ikon di hxxp://www.favicon-generator.org/ Ukurannya 180 px x 180 px format .png
    dan splash screen di aplikasi komputer paint ukuran 750 x 1334 pixel

    Tahap 2 : Buat Akun Generator File PWA (Kontak Ane WA 0881101867 )
    Upload semua PWA.png

    Upload semua file gambar ikon dan splash screen untuk tampilan di smartphone user anda
    kemudian Klik Generate dan akan mendownload otomatis file yang sudah jadi berupa zip file

    Tahap 3 : Berikutnya masuk ke cpanel hosting website anda dan klik file manager -----> nama website anda

    Login cpanel.png
    file manager klik
    Klik file manager.png
    Masuk ke directory website agan
    Upload file PWA ke root folder website kita.png
    Dan upload file zip yang sudah didownload tadi
    File PWA yang sudah didownload.png
    Kemudian extrak file zip tadi di root folder tersebut.
    extract file.png
    Kemudian masuk ke folder wp-content diroot folder -----> klik folder Themes ------> Folder tema website kita-------> Klik file header.php kemudian klik kanan pilih Edit ------> Copypaste kode script serviceworker yang sudah digenerate ,yang nantinya digunakan untuk memanggil dan memasang website dihomescreen smartphone user .
    copas service worker file.png
    Kemudian SAVE FILE

    Kalau sudah selesai semua tahapannya silahkan anda test progressif web app anda dengan google lighthouse alamatnya disini ------>hxxps://developers.google.com/web/tools/lighthouse/run


    masukan alamat lengkap https nya jangan lupa
    dan hasil test website ane sebelum dan sesudah dipasang kode dan file PWA
    Sebelum pakai PWA.png

    Sesudah dipasang PWA dan hasil TEST nya :
    100 % pwa ++.png

    Itu saja gan tutorial pemasangan script dan file pada website agan mudah mudahan bermanfaat dan tidak sulit untuk menambah jempol satu klik agan sangat berarti untuk kami .

    Bila ada kesalahan dalam penulisan atau tutorial kami mohon maaf , dan bila ada sumbang saran yang membangun sangat kami harapkan bila ada yang butuh bantuan pemasangan silahkan kontak WA ane di 08811101867 tolong jangan dipake nyepam produk produk gak jelas ya no hapenya :)


     
    idayiduy likes this.
  2. bagusrifai

    bagusrifai Super Hero

    Joined:
    Jan 17, 2010
    Messages:
    1,091
    Likes Received:
    25
    Maaf gan. Apa ada perbedaan trafik saat menginstal pwa ini
     
  3. aolx.net

    aolx.net Newbie

    Joined:
    Dec 10, 2009
    Messages:
    31
    Likes Received:
    1
    bisa d bantuin caranya yg simple ?
     
  4. adang235

    adang235 Newbie

    Joined:
    Jan 23, 2018
    Messages:
    48
    Likes Received:
    17
    Location:
    Bogor
    Maaf akun saya adang234 verifikasi di hp kena instal ulang jadi sulit balikin akunnya . jadi aku pakai akun baru dengan nama ini .

    Ada gan , enggagement visitor sebelumnya akan menjadi lebih loyal apabila konten anda dianggap menarik dan memang dibutuhkan sehingga kenaikan visitor akan meningkat.
     
    bagusrifai likes this.
  5. Pcgamehouse

    Pcgamehouse Ads.id Pro

    Joined:
    Feb 4, 2012
    Messages:
    412
    Likes Received:
    17
    Location:
    Pati
    Menarik juga, bikin pengunjung tambah loyal ini.
    Kalau mau dipasang untuk subdomain saja bisa?
     
    adang235 likes this.
  6. adang235

    adang235 Newbie

    Joined:
    Jan 23, 2018
    Messages:
    48
    Likes Received:
    17
    Location:
    Bogor
    Bisa gan
     
  7. idayiduy

    idayiduy Hero

    Joined:
    Nov 26, 2011
    Messages:
    557
    Likes Received:
    49
    PWA ini bisa diaplikasikan untuk web apa saja Gan ?
    Web News, Toko Online, Web Affiliasi, apa semua itu bisa ?
     
    adang235 likes this.
  8. adang235

    adang235 Newbie

    Joined:
    Jan 23, 2018
    Messages:
    48
    Likes Received:
    17
    Location:
    Bogor
    Bisa semua .
     

Share This Page