Tutorial Flutter Basic - Part 1

Apa itu aplikasi Flutter? Flutter merupakan mobile UI framework buatan Google yang gratis dan open-source. Framework yang dirilis pada Mei 2017 ini dapat memudahkan kamu untuk membuat aplikasi Android dan iOS dalam satu kode yang sama. Hal ini akan dapat membuat kamu menghemat waktu dalam membuat aplikasi di dua platform sekaligus.

Untuk membuat aplikasi Flutter, kamu akan menggunakan suatu bahasa pemrograman Dart. Mungkin ini adalah bahasa pemrograman yang baru untuk kamu. Namun jika kamu sudah terbiasa dengan Javascript atau Kotlin, kamu akan cepat familiar dengan bahasa Dart ini.

Mengapa Kamu Sebaiknya Belajar Flutter

Saya sudah lama membuat aplikasi Android, namun ketika Flutter keluar dan saya mencobanya, sampai saat ini saya lebih sering menggunakan Flutter daripada menggunakan Kotlin. Berikut ini adalah alasan mengapa saya menyarankan kamu untuk belajar membuka aplikasi Flutter.

Mudah dipelajari

Flutter merupakan framework yang masih baru dan modern. Sehingga kamu akan dimudahkan dengan cara penggunaannya yang sederhana. Jika kamu sudah terbiasa menggunakan Kotlin, Swift, Java, atau React Native, kamu akan menyadari bahwa Flutter dengan dart-nya ini berbeda.

Hal yang sangat saya sukai dengan Flutter yaitu saya dapat dengan mudah membuat aplikasi mobile hanya dengan beberapa baris kode dan sedikit file.

Menghemat waktu development

Karena sifatnya yang cross-platform, yaitu dapat dijalankan di lebih dari satu platform (Android, iOS, dan web), menjadikan Flutter ini sangat cocok bagi kamu yang berencana membuat aplikasi di Android dan iOS.

Selain itu, proses kompilasi cukup cepat. Ditambah lagi dengan adanya fitur Hot Reload, dimana kamu dapat melihat hasil perubahan kode dalam beberapa detik saja langsung ke smartphone atau emulator tanpa harus melakukan kompilasi dari awal.

Performa native yang baik

Tidak seperti Ionic, Xamarin, atau hybrid framework yang lain, aplikasi Flutter ini bersifat native dan tentu saja performanya akan kurang lebih mirip dengan aplikasi native yang dibuat menggunakan Java, Kotlin, atau Swift (iOS).

Aplikasi yang dibangun menggunakan Flutter support dengan semua fungsi yang ada di native. Kamu dapat mencari library yang sudah dibuat oleh komunitas. Jika kamu tidak menemukan library yang kamu cari, kamu dapat membuat plugin sendiri dan bisa membagikannya ke komunitas.

Dokumentasi yang lengkap

Dokumentasi menjadi hal yang sangat penting, apalagi untuk teknologi baru. Untungnya, dokumentasi Flutter dapat dibilang sangat baik. Kamu dapat menemukan segala hal tentang pengembangan aplikasi Flutter melalui website resminya, flutter.dev.

Di website tersebut, kamu dapat mencari dokumentasi teknis, contoh widget, tutorial, contoh aplikasi, atau video menarik. Jika saya mengalami kesulitan dalam membuat aplikasi Flutter, biasanya saya langsung mencari solusinya di website dokumentasi ini.

Persiapan Sebelum Memulai

Sebelum kamu dapat membuat aplikasi Flutter, ada dua hal penting yang perlu disiapkan, yaitu Flutter SDK dan editor. Editor dapat menggunakan Android Studio atas VS Code. Tapi kali ini saya akan menjelaskan tentang Android Studio, editor yang saya suka untuk pengembangan aplikasi Flutter.

Instalasi Flutter SDK

Kamu dapat membuat aplikasi Flutter menggunakan operating system Windows, Linux, MacOS, dan Chrome OS. Masing-masing operating system mempunyai SDK yang berbeda. Berikut ini langkah mudah untuk instalasi Flutter SDK:

  1. Unduh Flutter SDK dalam bentuk zip, sesuai OS yang kamu pakai. Berikut ini adalah link download untuk masing-masing OS:
  2. Extract file zip yang sudah diunduh ke folder manapun (misal C:/sdk/flutter/)
  3. Perbaharui path agar kamu dapat memanggil fungsi flutter dari terminal
    • Jika kamu menggunakan Windows
      • Ubah path dengan cara search ‘env’ pada Start search bar, kemudian pilih Edit environment variables.
      • Pada User variables, cek apakah ada entry dengan nama Path. Jika belum ada, kamu bisa membuatnya.
      • Tambahkan alamat direktori lengkap folder bin dimana kamu melakukan extract file zip (misal C:/sdk/flutter/bin).
    • Jika kamu menggunakan MacOS atau Linux
      • Cek kamu menggunakan shell apa dengan menuliskan echo $SHELL di terminal.
      • Jika kamu menggunakan Bash, edit file $HOME/.bash_profile. Jika menggunakan Z shell, edit file $HOME/.zshrc
      • Tambahkan perintah penambahan Path ke folder bin dimana kamu melakukan extract file zip.
        export PATH="$PATH:[FOLDER_EXTRACT]/flutter/bin"
  4. Jalankan perintah flutter doctor di terminal. Langkah ini untuk memastikan bahwa kamu sudah siap untuk membuat aplikasi Flutter.

Instalasi Android Studio

  1. Unduh dan install Android Studio dari link ini.
  2. Install plugin Flutter dan Dart di Android Studio. Caranya:
    • Buka Android Studio dan pilih bukan konfigurasi plugin (Configure > Plugins).
    • Pilih plugin Flutter dan klik Install.
    • Klik Yes ketika muncul pilihan untuk install plugin Dart.
    • Restart Android Studio.
  3. Selanjutnya adalah menyiapkan perangkat untuk mencoba aplikasi. Kamu dapat menggunakan device Android yang dimiliki atau menggunakan Emulator.

Aplikasi Flutter Pertama

Setelah berhasil melakukan instalasi Flutter SDK dan Android Studio, kamu dapat mencoba membuat project pertama melalui Android Studio.

aplikasi-flutter-pertama
Aplikasi Flutter Pertama
  1. Buka Android Studio, dan pilih Start a new Flutter Project.
  2. Pilih Flutter Application pada pilihan project type. Kalau kamu tidak menemukan pilihan ini, maka kamu belum berhasil install plugin Flutter.
  3. Pastikan bahwa pada bagian Flutter SDK path sudah terisi dengan folder dimana kamu mengekstrak SDK.
  4. Klik Finish, kemudian tunggu project selesai dibuat.
  5. Jalankan aplikasi dengan memilih tombol Run.
  6. Tunggu beberapa saat. Jika aplikasi berhasil muncul di emulator atau device kamu, maka selamat! Kamu sudah siap untuk menjadi Flutter developer.
Toolbar pada Android Studio
Toolbar pada Android Studio

Di artikel selanjutnya, kamu akan belajar membuat aplikasi Hello World, mengenal struktur layout, bagaimana menggunakan widget sederhana di aplikasi Flutter. Selamat belajar, dan jangan pantang menyerah!

1 KOMENTAR

LEAVE A REPLY

Please enter your comment!
Please enter your name here