Web Deployment

 Pada materi ini kita akan mempelajari bagaimana melakukan build aplikasi flutter untuk platform web. Sama seperti platform android dan ios, informasi untuk pengaturan aplikasi berada pada folder web.


Setting Nama Aplikasi

Untuk mengatur nama aplikasi, kita bisa membuka berkas manifest.json. Konfigurasi untuk nama aplikasi dapat Anda temukan dan ubah pada key name dan short_name.

  1. {
  2.     "name": "wisata_bandung",
  3.     "short_name": "wisata_bandung"
  4. }


Setting Icon Aplikasi

Platform web juga membutuhkan icon dalam berbagai ukuran. Icon untuk web dapat Anda taruh pada folder /web/icons. Kemudian, Anda perlu mendaftarkannya pada berkas manifest.json.

  1. {
  2.     ...
  3.     "icons": [
  4.         {
  5.             "src": "icons/Icon-192.png",
  6.             "sizes": "192x192",
  7.             "type": "image/png"
  8.         },
  9.         {
  10.             "src": "icons/Icon-512.png",
  11.             "sizes": "512x512",
  12.             "type": "image/png"
  13.         }
  14.     ]
  15. }


Melakukan build web

Sama seperti build aplikasi android dan ios, untuk mem-build aplikasi Flutter web kita menjalankan perintah flutter web. Perintah selengkapnya adalah seperti ini:

  1. flutter build web

Sama seperti ketika menjalankan flutter web, ketika melakukan build, kita juga bisa menentukan renderer yang ingin digunakan. Untuk menentukan renderer yang digunakan, tambahkan parameter --web-renderer pada perintah flutter build. Jika tidak mendefinisikan parameter --web-renderer maka mode auto yang akan digunakan.

Hasil build akan Anda temukan pada folder /build/web. Folder inilah yang nantinya bisa Anda deploy ke sebuah web hosting atau web server.

Beberapa opsi hosting yang bisa Anda gunakan, antara lain:

Popular posts from this blog

Build APK

Image
  Project Flutter yang telah dibuat dapat kita build menjadi berkas .apk yang dapat berjalan di Android. Build APK adalah suatu proses membungkus aplikasi flutter menjadi format .apk yang nantinya untuk diinstal pada perangkat Android. Berikut tahapan ketika build aplikasi Flutter ke APK. AndroidManifest.xml Sebelum mem-build APK, kita akan mengatur berkas  android/app/src/main/AndroidManifest.xml .  AndroidManifest.xml  merupakan sebuah berkas yang berisikan informasi mengenai aplikasi Android yang akan di- build . Informasi-informasi tersebut berupa nama aplikasi, ikon,  permission ,  screen orientation , dan lain-lain. Isi dari  AndroidManifest.xml  seperti berikut: <manifest xmlns:android = "http://schemas.android.com/apk/res/android"      package = "id.eudeka.samples" >      <application          android:name = "io.flutter.app.FlutterApplication"        ...
Read more

Generic

Image
Jika Anda perhatikan pada dokumentasi  collection  seperti  List , sebenarnya tipe dari  List  tersebut adalah  List<E> . Tanda  <...>  ini menunjukkan bahwa  List  adalah tipe  generic , tipe yang memiliki tipe parameter. Menurut  coding convention  dari Dart, tipe parameter dilambangkan dengan satu huruf kapital seperti  E ,  T ,  K , atau  V . Secara umum  generic  merupakan konsep yang digunakan untuk menentukan tipe data yang akan kita gunakan. Kita bisa mengganti tipe parameter  generic  pada Dart dengan tipe yang lebih spesifik dengan menentukan  instance  dari tipe tersebut. Sebagai contoh, perhatikan  List  yang menyimpan beberapa nilai berikut: List <int> numberList = [ 1 , 2 , 3 , 4 , 5 ]; Tipe parameter yang digunakan pada variabel list di atas adalah  int , maka nilai yang bisa kita masukkan adalah nilai dengan tipe  ...
Read more

Build IPA

Image
  Build IPA Catatan: Build .IPA hanya bisa dijalankan dengan mendaftar akun Apple Developer Program. Silakan baca informasi tentang Apple Developer Program di sini  https://developer.apple.com/programs/ . Untuk lulus dari kelas ini, tidak diwajibkan untuk bisa build .IPA. Pada materi ini kita akan mempelajari bagaimana melakukan  build  aplikasi Flutter menjadi berkas  .ipa  yang dapat dijalankan pada perangkat iOS. Sebelum melakukan  build , ada beberapa hal yang perlu kita atur seperti nama dan ikon aplikasi. Setting Nama Aplikasi Untuk mengatur nama aplikasi buka berkas  Info.plist  pada direktori  /ios/Runner/ . Konfigurasi untuk nama aplikasi dapat Anda temukan dan ubah pada  key Bundle Name . <key> CFBundleName </key> <string> builder </string> Atau Anda bisa gunakan library  berikut  untuk men- generate  nama aplikasi melalui  pubspec.yaml . Setting Ikon Aplikasi Sama seperti perang...
Read more