Yang perlu dipersiapkan saat memulai pembuatan aplikasi Android dengan Flutter

Flutter 2 Mei 2021

Flutter merupakan salah satu framework yang memudahkan kita dalam pembuatan aplikasi multi-platform, sebut saja kita dapat membuat aplikasi Android, IOS, Desktop sampai Website dengan framework yang satu ini.

Karena hal ini juga tentunya membuat pamor dari Flutter meningkat cukup drastis. Dari tahun ke tahun pembaruan serta dukungan yang lebih luas terhadap Flutter membuat minat sebagian developer mulai terbentuk, dan hal ini juga turut berpengaruh terhadap bahasa Dart secara tidak langssung.

Minat Terhadap Flutter, Dart dan NodeJs pada Google Trends

Dari screenshot Google Trends diatas, kita dapat mengetahui bahwa Flutter cukup menjanjikan untuk kita para developer dalam memperluas skill dan pengetahuan terhadap framework berbasis Dart ini.

Oleh karena itu disini saya akan coba sharing cara mempersiapkan Flutter dari mulai proses download, instalasi sampai kita siap dalam memulai koding aplikasi Android.

Pada pembahasan instalasi ini saya menggunakan Platform Linux, namun untuk implementasi seharusnya tidak terlalu berbeda untuk platform lainnya seperti Windows atau MacOs.

Bagi kalian yang mungkin ingin tau lebih lanjut tata cara instalasi Fluttter bisa langsung menuju situs officialnya disini https://flutter.dev/docs/get-started/install, dimana disana terdapat menu pilihan tentang platform apa yang kalian inginkan untuk proses instalasi di Windows, Mac atau Chrome OS.  

Untuk memulai development Android dengan Flutter, kita diharuskan untuk setidaknya menyiapkan tiga hal, diantaranya adalah

  1. instalasi SDK Flutter
  2. Instalasi Android Studio, dimana terdapat SDK untuk development Androidnya dan juga Android Virtual Device (AVD).
  3. Visual Studio Code, dengan extension Flutter

Download SDK Flutter

Hal yang paling utama adalah mendownload SDK Flutter, dimana menjadi tulang punggung dari semua proses yang berjalan saat melakukan development.

Saat artikel ini dibuat Flutter memiliki versi 2.0.5. kalian dapat mendownloadnya sesuai dengan OS kalian di link berikut ini.

https://storage.googleapis.com/flutter_infra/releases/stable/linux/flutter_linux_2.0.5-stable.tar.xz

Di masa mendatang kemungkinan versi yang tersedia sudah lebih mutakhir

Extract File

Setelah SDK Flutter selesai di download, segera extract file tersebut ke dalam suatu folder atau direktori, sebagai contoh

cd ~/folder/tujuan
tar -xf ~/Downloads/flutter_linux_2.0.5-stable.tar.xz
Proses Extraksi SDK Flutter
kalian bisa sesuaikan alamat ~/folder/tujuan dengan direktori custom pilihan kalian sendiri.

Setting Path

Setelah proses extraksi, path direktori tadi akan menjadi acuan ketika kalian menjalankan Flutter di komputer kalian. Tentunya ada perbedaan tiap-tiap OS untuk setingan Path tersebut.

Buka file ~/.bashrc dengan kode editor kesayangan kalian untuk memodifikasi path di komputer kita dengan tambahan alamat direktori flutter tadi. saya biasa menggunakan vim untuk memodifikasi text file.

export PATH="$PATH:~/folder/tujuan/flutter/bin"
Export PATH untuk aplikasi SDK Flutter

jika dengan VIM, kira-kira seperti ini stepnya

vim ~/.bashrc

(Ketik i, akan muncul informasi "-- INSERT --" pada pojok kiri bawah)

ketikan "export PATH=..." tadi atau paste dengan CTRL+V

simpan & keluar (tekan ESC, ketik ":wq") 

Install Android Studio

Setelah proses diatas selesai, berikutnya adalah menginstall Android SDK, karena kita ingin membuat aplikasi Android dengan Flutter, maka Android SDK adalah hal yang wajib. Begitu pula jika ingin membuat aplikasi IOS dengan Flutter, maka Xcode perlu untuk diinstall.

Download Android Studio terbaru pada situs dibawah ini

Download Android Studio and SDK tools | Android Developers
<!-- hide description -->
Download Android Studio
Android SDK adalah komponen atau tools yang termasuk dalam Android Studio, jadi untuk menginstallnya dengan mudah, kalian bisa mendownload Android studio pada link diatas.

Selanjutnya adalah mengekstraksi file hasil download tadi ke direktori yang diinginkan, misalnya ~/folder/android-sdk

tar -xf ~/Downloads/android-studio-ide-201.7199119-linux.tar.gz ~/folder/android-sdk
Ekstraksi File Android SDK

Bagi kalian yang menggunakan Ubuntu versi 64 bit, library berikut harus diinstall agar Android Studio dapat berjalan

sudo apt-get install libc6:i386 libncurses5:i386 libstdc++6:i386 lib32z1 libbz2-1.0:i386
Library Ubuntu 64 Bit untuk Android Studio

Sedangkan jika kalian menggunakan Fedora 64 bit, berikut library yang harus diinstall

sudo yum install zlib.i686 ncurses-libs.i686 bzip2-libs.i686
Library Fedora 64 bit untuk Android Studio

Menjalankan Android Studio

Selanjutnya jalankan Android Studio dengan mengeksekusi file studio.sh yang ada pada folder bin melalui terminal. Contohnya seperti ini

~/folder/android-sdk/android-studio-ide-201.7199119-linux/bin/studio.sh
Menjalankan Android Studio pada Linux
Kemungkinan nama folder bisa berbeda tergantung versi build dari android studio yang kalian install pada saat itu

Menyiapkan Android Virtual Device (Android Emulator)

Setelah Android Studio berhasil dijalankan, maka langkah berikutnya adalah menyiapkan Android Emulator dengan memilih menu Tools~> AVD Manager seperti dibawah ini.

Menu AVD Manager untuk Android Emulator

AVD Manager adalah komponen yang memuat daftar Android Emulator kalian atau biasa juga disebut dengan Android Virtual Device. Pada pertama kali instalasi, pilihan list virtual device yang ada pasti masih kosong, oleh karena itu kalian perlu membuat Virtual Device baru dengan mengklik menu Create Virtual Device pada pojok kanan bawah.

Tombol Buat Virtual Device Baru

Setelahnya kalian akan diarahkan untuk memilih jenis hardware yang diinginkan. Sebagai contoh di bawah ini saya memilih device dengan kategori Phone dengan tipe Pixel 4XL.

Memilih Kategori Virtual Device

Kalian dapat memilih sesuai keinginan kalian, karena diantara pilihan tersebut terdapat atribut yang berbeda-beda seperti ketersediaan Play Store, ukuran layar, resolusi, dan sebagainya.

Selanjutnya pada System Image pilih API version atau yang biasa kita kenal dengan versi Android.

Pilihan System Image atau Versi API Android

Jika belum ada sebelumnya, akan muncul link Download dimana kita harus mendownload terlebih dahulu API Android yang ingin digunakan, karena tombol Next tidak akan aktif sebelum kita selesai mendownload. Contohnya seperti di bawah ini.

Download API Android

Tahap berikutnya kita tinggal mengikuti wizard yang ditampilkan hingga selesai.

Menginstal Visual Studio Code

Dalam proses pembuatan aplikasi menggunakan Flutter, kita akan menggunakan Kode Editor yang cukup populer yaitu Visual Studio Code atau biasa disebut vscode.

Download terlebih dahulu pada link dibawah ini dan lakukan instalasi seperti biasa.

Visual Studio Code - Code Editing. Redefined
Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.
Link Download Visual Studio Code

Menambahkan Extension Fluter

Buka vscode yang telah terinstal, dan tambahkan extension Flutter dengan mengetikan flutter pada menu marketplace di sisi samping kiri seperti dibawah ini, lalu klik install.

Jalankan Flutter Doctor

Jika kita sudah selesai dalam menyiapkan Emulator atau Android Virtual Device sebelumnya, berikutnya adalah langkah yang cukup sederhana. Kembali ke terminal kalian dan mulai jalankan perintah flutter doctor untuk melakukan pengecekan.

Flutter doctor adalah perintah untuk memeriksa semua kondisi dari mulai Flutter SDK, Android Studio, Visual Studio Code, sampai Connected Device (Android Virtual Device)

Bila ada beberapa hal yang belum siap, flutter doctor akan memunculkan tanda silang [X]. Cobalah untuk memeriksa hal-hal yang belum dilakukan, seperti menjalankan Android Virtual Device, instalasi plugin VSCode, dan sebagainya.

Sampai sini kira-kira sekian yang dapat saya sharing tentang cara menyiapkan tools untuk dapat mendevelop aplikasi android dengan Flutter. Semoga artikel ini dapat membantu, dan jangan sungkan untuk menanyakan hal-hal yang terkait dengan artikel ini di kolom komentar ya.

Tags

Great! You've successfully subscribed.
Great! Next, complete checkout for full access.
Welcome back! You've successfully signed in.
Success! Your account is fully activated, you now have access to all content.