Cara Install Flutter di Windows 11

Flutter adalah framework UI open-source dari Google yang memungkinkan Anda membangun aplikasi multi-platform dari satu basis kode. Dengan Flutter, Anda bisa membuat aplikasi yang berjalan mulus di Android, iOS, web, dan desktop (Windows, macOS, Linux) dengan performa tinggi dan tampilan yang konsisten. Bagi Anda yang ingin terjun ke dunia pengembangan aplikasi mobile atau desktop dengan Windows 11 sebagai lingkungan kerja utama, instalasi Flutter adalah langkah awal yang krusial.

Panduan ini akan membawa Anda melalui setiap langkah yang diperlukan untuk menginstal Flutter di Windows 11, mulai dari prasyarat hingga menjalankan aplikasi pertama Anda. Kita akan membahas instalasi Git, Flutter SDK, konfigurasi environment path, setup Android Studio untuk pengembangan Android, serta integrasi dengan Visual Studio Code sebagai IDE favorit para developer.

Persyaratan Sistem dan Prasyarat

Sebelum memulai instalasi, pastikan sistem Anda memenuhi persyaratan berikut:

  • Sistem Operasi: Windows 11 (64-bit). Meskipun Flutter bisa berjalan di Windows 10, panduan ini spesifik untuk Windows 11.
  • Ruang Disk: Minimal 1.64 GB untuk Flutter SDK saja. Namun, disarankan memiliki ruang lebih dari 10 GB untuk Android SDK, emulator, dan proyek Anda.
  • Alat (Tools):
    • Git for Windows: Diperlukan untuk mengunduh Flutter SDK dan mengelola pembaruan.
    • Windows PowerShell 5.0 atau lebih tinggi, atau Git Bash: Untuk menjalankan perintah Flutter dari baris perintah.
    • Android Studio: Untuk mendapatkan Android SDK, platform tools, dan emulator.
    • Visual Studio Code (opsional, sangat direkomendasikan): Sebagai IDE utama untuk menulis kode Flutter.
    • Java Development Kit (JDK): Biasanya sudah terinstal bersama Android Studio, namun penting untuk memastikan versi yang kompatibel.

Langkah 1: Menginstal Git untuk Windows

Flutter SDK diunduh dan dikelola menggunakan Git. Oleh karena itu, Git adalah salah satu prasyarat utama.

Cara Menginstal Git:

  1. Kunjungi situs resmi Git untuk Windows di git-scm.com/download/win.
  2. Unduh versi terbaru yang kompatibel dengan sistem 64-bit Anda.
  3. Jalankan installer yang telah diunduh. Ikuti langkah-langkah instalasi.
  4. Saat memilih komponen, pastikan opsi “Git from the command line and also from 3rd-party software” terpilih. Ini penting agar Flutter dapat mengenali Git.
  5. Untuk opsi lainnya, Anda bisa menggunakan pengaturan default atau sesuaikan sesuai preferensi Anda.
  6. Setelah instalasi selesai, buka Command Prompt atau PowerShell dan ketik perintah berikut untuk memverifikasi instalasi:

    git --version

    Jika berhasil, Anda akan melihat versi Git yang terinstal.

Langkah 2: Mengunduh Flutter SDK

Setelah Git terinstal, langkah selanjutnya adalah mengunduh Flutter SDK.

Cara Mengunduh Flutter SDK:

  1. Kunjungi halaman instalasi Flutter untuk Windows.
  2. Cari dan unduh file .zip yang berisi Flutter SDK versi stabil terbaru.
  3. Setelah diunduh, ekstrak file .zip tersebut ke lokasi yang mudah diakses dan diingat. Penting: Hindari folder seperti C:\Program Files\ atau C:\Windows\ yang memerlukan izin administrator. Lokasi yang direkomendasikan adalah di dalam folder pengguna Anda (misal: C:\Users\YourUsername\flutter) atau di sebuah folder khusus (misal: C:\src\flutter). Pastikan Anda tidak mengekstraknya di root drive (misal: C:\flutter) karena sering menimbulkan masalah izin.
  4. Pastikan struktur folder yang dihasilkan adalah <path_to_flutter_directory>\flutter\bin.

Langkah 3: Menambahkan Flutter ke Environment Path

Agar Anda bisa menjalankan perintah flutter dari Command Prompt atau PowerShell di mana saja, Anda perlu menambahkan lokasi folder bin Flutter SDK ke variabel lingkungan (Environment Path) sistem Anda.

Cara Mengatur Environment Path:

  1. Di Windows Search, ketik “environment variables” dan pilih “Edit the system environment variables”.
  2. Pada jendela System Properties, klik tombol “Environment Variables…”.
  3. Di bagian “System variables”, cari variabel bernama Path, lalu pilih dan klik tombol “Edit…”.
  4. Klik tombol “New” dan tambahkan jalur lengkap ke folder bin di dalam direktori Flutter Anda (contoh: C:\src\flutter\bin).
  5. Klik “OK” pada semua jendela yang terbuka untuk menyimpan perubahan.
  6. Penting: Tutup semua jendela Command Prompt atau PowerShell yang sedang terbuka, lalu buka kembali. Perubahan variabel lingkungan hanya akan berlaku pada sesi baru.
  7. Verifikasi instalasi dengan menjalankan perintah:

    flutter --version

    Jika berhasil, Anda akan melihat informasi versi Flutter.

Langkah 4: Menjalankan flutter doctor

flutter doctor adalah alat diagnostik bawaan Flutter yang memeriksa lingkungan pengembangan Anda dan melaporkan komponen apa pun yang hilang atau perlu dikonfigurasi. Ini adalah langkah krusial untuk memastikan semua sudah siap.

Cara Menjalankan flutter doctor:

  1. Buka Command Prompt atau PowerShell.
  2. Ketik perintah:

    flutter doctor

  3. Tunggu hingga proses selesai. flutter doctor akan memeriksa beberapa hal:
    • Flutter: Versi SDK dan ketersediaan.
    • Android toolchain: Android SDK, Build-Tools, Command-line Tools, dan lisensi.
    • Chrome: Untuk pengembangan web (jika terinstal).
    • Visual Studio: Untuk pengembangan Windows desktop (jika terinstal).
    • Android Studio: Instalasi dan plugin Dart/Flutter.
    • VS Code: Instalasi dan plugin Dart/Flutter.
    • Connected device: Perangkat fisik atau emulator yang terhubung.

Idealnya, Anda ingin melihat semua item memiliki tanda centang hijau (✓). Jika ada tanda silang merah (x) atau tanda seru kuning (!), itu berarti ada masalah yang perlu Anda atasi. Output ini akan menjadi panduan Anda untuk langkah-langkah selanjutnya.

Langkah 5: Menginstal Android Studio (untuk Pengembangan Android)

Untuk mengembangkan aplikasi Android dengan Flutter, Anda memerlukan Android SDK dan alat pendukung lainnya yang disediakan oleh Android Studio.

Cara Menginstal Android Studio:

  1. Kunjungi situs resmi Android Studio di developer.android.com/studio.
  2. Unduh dan jalankan installer Android Studio. Ikuti petunjuk instalasi.
  3. Setelah instalasi, buka Android Studio. Pada jendela Welcome to Android Studio, pilih “More Actions” lalu “SDK Manager”.
  4. Di tab “SDK Platforms”, pastikan Anda telah menginstal Android SDK Platform terbaru (misal: Android API 34 atau 35).
  5. Di tab “SDK Tools”, pastikan Anda telah menginstal:
    • Android SDK Build-Tools (versi terbaru)
    • Android SDK Platform-Tools
    • Android SDK Command-line Tools (latest)
    • Intel x86 Emulator Accelerator (HAXM installer) atau Android Emulator Hypervisor Driver for AMD Processors (tergantung CPU Anda, ini penting untuk performa emulator).
  6. Klik “Apply” atau “OK” untuk menginstal komponen yang dipilih.
  7. Setelah semua komponen terinstal, buka kembali Command Prompt atau PowerShell dan jalankan perintah untuk menerima lisensi Android:

    flutter doctor --android-licenses

    Tekan y (yes) untuk setiap pertanyaan persetujuan lisensi.

  8. Jalankan flutter doctor sekali lagi untuk memverifikasi bahwa semua masalah Android telah teratasi.

Langkah 6: Mengatur Emulator Android (AVD)

Emulator memungkinkan Anda menguji aplikasi Flutter Anda langsung di PC tanpa perlu perangkat fisik.

Cara Membuat Emulator Android:

  1. Buka Android Studio. Pada jendela Welcome to Android Studio, pilih “More Actions” lalu “Virtual Device Manager” (atau AVD Manager).
  2. Klik tombol “Create Virtual Device”.
  3. Pilih definisi perangkat keras (misal: Pixel 6 atau ukuran lainnya yang Anda inginkan) dan klik “Next”.
  4. Pilih System Image (versi Android) yang ingin Anda instal. Disarankan memilih versi terbaru (misal: Tiramisu atau UpsideDownCake). Klik tombol “Download” jika belum terunduh.
  5. Setelah terunduh, pilih image tersebut dan klik “Next”.
  6. Berikan nama untuk AVD Anda dan klik “Finish”.
  7. Sekarang, Anda bisa melihat emulator yang baru dibuat di daftar AVD Manager. Klik tombol “Play” untuk memulai emulator.
  8. Setelah emulator berjalan, jalankan flutter doctor kembali. Anda akan melihat bahwa ada perangkat yang terhubung (connected device).

Langkah 7: Menginstal Visual Studio Code (VS Code) (IDE Pilihan)

Visual Studio Code adalah editor kode yang ringan, cepat, dan sangat populer di kalangan developer Flutter berkat ekstensinya yang powerful.

Cara Menginstal VS Code dan Ekstensi Flutter:

  1. Kunjungi situs resmi Visual Studio Code di code.visualstudio.com.
  2. Unduh dan instal VS Code versi stabil untuk Windows 64-bit.
  3. Setelah terinstal, buka VS Code.
  4. Tekan Ctrl+Shift+X untuk membuka panel Extensions (atau klik ikon ekstensi di sisi kiri).
  5. Cari “Flutter” dan instal ekstensi yang dibuat oleh Dart Code. Ekstensi ini secara otomatis juga akan menginstal ekstensi Dart.
  6. Setelah ekstensi terinstal, restart VS Code.
  7. Untuk memverifikasi, buka Command Palette (Ctrl+Shift+P), ketik “Flutter: Run Flutter Doctor”. Ini akan menjalankan flutter doctor di dalam terminal VS Code dan menunjukkan bahwa VS Code sudah siap.

Langkah 8: Membuat dan Menjalankan Aplikasi Flutter Pertama

Sekarang, Anda sudah siap untuk membuat aplikasi Flutter pertama Anda!

Langkah-langkah Membuat Aplikasi Pertama:

  1. Buka Visual Studio Code.
  2. Buka Command Palette (Ctrl+Shift+P).
  3. Ketik “Flutter: New Project” dan pilih opsi tersebut.
  4. Pilih “Application” sebagai jenis proyek.
  5. Pilih folder di mana Anda ingin menyimpan proyek Anda.
  6. Berikan nama untuk proyek Anda (misal: my_first_app). Nama proyek harus dalam huruf kecil dan menggunakan underscore jika ada spasi.
  7. Tunggu hingga Flutter selesai membuat proyek. VS Code akan secara otomatis membuka proyek baru Anda.
  8. Di bagian bawah kanan VS Code, Anda akan melihat pilihan perangkat (device selector). Klik dan pilih emulator Android yang sudah Anda jalankan (atau perangkat fisik jika ada).
  9. Tekan F5 atau buka “Run” > “Start Debugging” untuk menjalankan aplikasi.
  10. Flutter akan membangun aplikasi dan meluncurkannya di emulator yang Anda pilih. Anda akan melihat aplikasi demo standar dengan tombol penambah angka.

Masalah yang Sering Terjadi

Proses instalasi sering kali tidak berjalan mulus. Berikut adalah beberapa masalah umum yang mungkin Anda hadapi dan solusinya:

1. flutter doctor Masih Merah di Android Toolchain

  • Gejala: Output flutter doctor menunjukkan tanda silang merah pada “Android toolchain” atau “Android licenses”.
  • Penyebab:
    • Android SDK belum sepenuhnya terinstal.
    • Lisensi Android belum diterima.
    • Variabel lingkungan ANDROID_HOME tidak diatur atau salah.
  • Solusi:
    1. Pastikan semua komponen Android SDK yang disebutkan di Langkah 5 telah terinstal melalui Android Studio SDK Manager.
    2. Jalankan flutter doctor --android-licenses dan terima semua lisensi dengan mengetik y.
    3. Secara manual atur variabel lingkungan ANDROID_HOME ke lokasi Android SDK Anda (biasanya C:\Users\YourUsername\AppData\Local\Android\Sdk). Caranya sama seperti menambahkan Flutter ke Path, tetapi buat variabel baru bernama ANDROID_HOME.

2. Emulator Tidak Muncul atau Sangat Lambat

  • Gejala: Emulator tidak bisa boot, macet, atau performanya sangat buruk.
  • Penyebab:
    • Hardware Acceleration (HAXM untuk Intel, Hyper-V untuk AMD) tidak terinstal atau tidak diaktifkan.
    • Fitur virtualisasi (VT-x/AMD-V) tidak diaktifkan di BIOS/UEFI.
    • RAM atau CPU yang dialokasikan untuk emulator tidak cukup.
  • Solusi:
    1. Pastikan Intel HAXM atau Android Emulator Hypervisor Driver for AMD Processors terinstal melalui Android Studio SDK Manager.
    2. Restart komputer Anda, masuk ke BIOS/UEFI, dan pastikan fitur virtualisasi (misal: Intel VT-x atau AMD-V) diaktifkan.
    3. Di AVD Manager Android Studio, edit emulator dan kurangi alokasi RAM atau CPU jika PC Anda memiliki spesifikasi terbatas.

3. VS Code Tidak Mengenali Perintah Flutter/Dart

  • Gejala: VS Code tidak bisa membuat proyek Flutter baru, tidak ada auto-completion, atau notifikasi “Flutter SDK not found”.
  • Penyebab:
    • Ekstensi Flutter dan Dart belum terinstal atau tidak aktif.
    • Path Flutter SDK tidak benar di variabel lingkungan sistem.
    • VS Code perlu di-restart setelah instalasi ekstensi atau perubahan environment variables.
  • Solusi:
    1. Pastikan ekstensi Flutter dan Dart terinstal dan diaktifkan di VS Code.
    2. Verifikasi kembali Environment Path untuk Flutter SDK di Windows.
    3. Tutup dan buka kembali VS Code sepenuhnya.

4. Error “flutter pub get failed”

  • Gejala: Saat membuat proyek atau menambahkan package, muncul error terkait pub get.
  • Penyebab:
    • Koneksi internet tidak stabil.
    • Proxy atau VPN memblokir akses ke pub.dev.
    • Cache pub rusak.
  • Solusi:
    1. Pastikan koneksi internet Anda stabil.
    2. Coba nonaktifkan VPN/proxy untuk sementara waktu jika Anda menggunakannya.
    3. Bersihkan cache pub dengan perintah: flutter pub cache repair.

Pengalaman dan Pertimbangan Praktis

Setelah instalasi dasar, ada beberapa hal yang perlu Anda ketahui untuk pengalaman pengembangan Flutter yang lebih baik:

  • Performa PC: Pengembangan Flutter, terutama dengan emulator dan Android Studio yang berjalan bersamaan, sangat menguras RAM dan CPU. Disarankan memiliki minimal 16GB RAM dan SSD untuk kinerja yang optimal. Project skala besar dengan banyak dependensi bisa terasa lambat di PC dengan spesifikasi minimal.
  • Pentingnya SSD: Menginstal Android Studio, Android SDK, dan Flutter SDK di SSD akan mempercepat waktu build aplikasi dan loading emulator secara signifikan.
  • VS Code vs. Android Studio: Banyak developer lebih memilih VS Code karena lebih ringan dan responsif untuk menulis kode. Android Studio sering digunakan ketika perlu melakukan konfigurasi spesifik Android, debugging native, atau menggunakan fitur-fitur yang lebih kompleks dari IDE Android.
  • Menjaga SDK Tetap Update: Flutter terus berkembang. Penting untuk secara rutin memperbarui Flutter SDK Anda dengan perintah flutter upgrade di Command Prompt. Ini akan memastikan Anda mendapatkan fitur terbaru dan perbaikan bug.
  • Manajemen Dependensi: Semua dependensi proyek Flutter Anda diatur dalam file pubspec.yaml. Saat Anda menambahkan dependensi baru, jalankan flutter pub get di terminal proyek untuk mengunduh package tersebut.
  • Mengembangkan untuk iOS: Perlu diingat, meskipun Flutter adalah cross-platform, untuk mengompilasi dan menguji aplikasi iOS, Anda tetap membutuhkan mesin macOS dengan Xcode terinstal.

FAQ

Apakah Flutter bisa jalan di Windows 10?

Ya, Flutter sepenuhnya kompatibel dengan Windows 10 (64-bit) dan proses instalasinya sangat mirip dengan Windows 11. Panduan ini dapat menjadi referensi yang baik meskipun ada perbedaan kecil pada antarmuka pengguna.

Berapa RAM yang dibutuhkan untuk Flutter?

Minimal 8GB RAM, tetapi sangat disarankan 16GB atau lebih. Terutama jika Anda berencana menjalankan Android Studio, emulator, dan Visual Studio Code secara bersamaan, RAM yang cukup akan sangat mempengaruhi produktivitas Anda.

Perlukah Visual Studio Code?

Tidak wajib, tapi sangat direkomendasikan. VS Code adalah IDE favorit banyak developer Flutter karena ringan, cepat, dan memiliki ekstensi Flutter/Dart yang powerful. Anda juga bisa menggunakan Android Studio sebagai IDE utama.

Apakah saya perlu instal JDK secara terpisah?

Tidak perlu dalam kebanyakan kasus. Android Studio biasanya sudah menyertakan Java Development Kit (JDK) yang diperlukan. Namun, jika Anda mengalami masalah dengan Java, Anda bisa memeriksa dan menginstalnya secara terpisah.

Bagaimana cara update Flutter?

Untuk memperbarui Flutter SDK ke versi terbaru, buka Command Prompt atau PowerShell dan jalankan perintah flutter upgrade. Ini akan mengunduh versi terbaru dan melakukan penyesuaian yang diperlukan.

Kesimpulan

Menginstal Flutter di Windows 11 adalah fondasi penting untuk memulai perjalanan Anda dalam pengembangan aplikasi multi-platform. Dengan mengikuti langkah-langkah di atas, Anda telah berhasil menyiapkan lingkungan pengembangan yang lengkap, mulai dari Git, Flutter SDK, konfigurasi Android Studio, hingga integrasi dengan Visual Studio Code. Sekarang, Anda memiliki semua alat yang dibutuhkan untuk mulai bereksperimen, membangun, dan menyebarkan aplikasi inovatif dengan Flutter. Jangan ragu untuk eksplorasi lebih jauh dan terus belajar dari komunitas Flutter yang sangat aktif.

TAGS: flutter, install flutter, windows 11, developer tools, mobile development, cross-platform, android studio, vs code, dart, programming tutorial, tutorial instalasi


Baca Juga

You May Also Like

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *