Flutter Pemula #2 – Menggunakan Visual Studio Code atau Android Studio untuk Coding Flutter

ISALLAB.COM – Halo teman-teman, di postingan kali ini saya akan membahas seputar tentang Flutter Pemula #2 – Menggunakan Visual Studio Code atau Android Studio untuk Coding Flutter . Dan sebelum kamu belajar Flutter saya saranin kamu belajar bahasa pemrograman Dart dahulu, sebab dasar dari Flutter sendiri adalah bahasa pemrograman Dart. Untuk linknya silahkan kamu ikuti link di bawah ini. Lengkap !
Baca semua partnya ya agar kamu paham semua dan gampang saat belajar Flutter ini 🙂
BACA DISINI : Pengenalan Bahasa Pemrograman Dart Untuk Pemula – Part 1
BACA DISINI : Pengenalan Bahasa Pemrograman Dart Untuk Pemula – Part 2
BACA DISINI : Pengenalan Bahasa Pemrograman Dart Untuk Pemula – Part 3
BACA DISINI : Pengenalan Bahasa Pemrograman Dart Untuk Pemula – Part 4
Beberapa hal yang akan saya bahas dalam Menggunakan Visual Studio Code atau Android Studio untuk Coding Flutter yaitu :
(klik link dibawah ini agar langsung ke artikel yang kamu inginkan)
Silahkan baca sampai bawah artikel ini agar kamu lebih paham 🙂
1. INSTALASI PLUGIN
VISUAL STUDIO CODE
Sebelum kamu menggunakan visual studio code kamu dapat mendownloadnya di link berikut :
Unduh disini : https://code.visualstudio.com/download
Setelah kamu unduh/download silahkan buka Visual Studio Code nya ikuti langkah langkah berikut :
1. Buka tab Extensions pada bagian kiri Visual Studio Code, cari extension Dart di pencarian lalu Install Dart tersebut.
2. Cari ekstensi Flutter dan install Flutter tersebut.
3. Setelah itu buka Terminal dengan cara ketik Ctrl + ‘ atau Ctrl + Shift + ‘ seperti gambar di bawah ini :
4. Ketik di dalam terminal
$ flutter doctor
Maka akan tampil seperti di bawah ini :
5. Nah berarti flutter sudah dapat digunakan
ANDROID STUDIO / INTELLIJ
Sebelum kamu menggunakan Android Studio atau IntelliJ kamu dapat mendownloadnya di link berikut :
Unduh disini Android Studio : https://developer.android.com/studio#downloads
Unduh disini IntelliJ : https://www.jetbrains.com/idea/download/
Setelah kamu unduh/download silahkan buka Android Studio nya ikuti langkah langkah berikut :
1. Pada halaman utama, buka Plugins pada Configure.
2. Cari plugins Flutter pada tab Marketplace dan install, secara otomatis plugins Dart juga akan terinstall.
2. VALIDASI FLUTTER
Setelah semua terpasang (Flutter SDK, Android SDK, IDE Android Studio/IntelliJ/Visual Studio Code, Plugin/Extension Flutter dan Dart), coba ketikkan
flutter doctor
pada Terminal/Command Prompt (CMD) untuk mengecek apakah semua sudah terpasang dengan baik dan benar, jika semua sudah ceklis OK maka kita bisa melanjutkan belajarnya. Jika terdapat error, maka akan muncul penjelasan error tersebut dan cara memperbaiki error tersebut.
3. MEMBUAT PROJECT FLUTTER BARU
Visual Studio Code
1. Buka Command Palette pada menu View.
2. Cari dan pilih Flutter: New Project.
3. Isi dengan nama project yang ingin kamu buat.
4. Pilih direktori dimana project tersebut akan tersimpan.
5. Tunggu beberapa saat sampai project berhasil terbuat dan muncul file main.dart.
6. Coba jalankan aplikasi dengan menjalankan Start Debugging pada menu Debug.
Android Studio / IntelliJ
1. Pilih Start s new Flutter project pada tampilan home.
2. Pilih Flutter Application untuk membuat aplikasi Flutter yang dapat dipasang padaperangkat mobile pengguna lainnya.
3. Isi seperti berikut ini,
- Project name : Nama project yang akan dibuat.
- Flutter SDK path : Path folder atau direktori dimana SDK Flutter telah terpasang sebelumnya, atau jika belum terpasang, klik Install SDK… dan arahkan ke tempat dimana SDK Flutter ingin di simpan.
- Project location : Path folder atau direktori dimana project tersebut akan tersimpan.
- Description : Deskripsi project atau aplikasi tersebut.
- Create project offline : Jika ingin membuat project tersebut dapat diakses ketika sedang offline atau tidak ada internet.
- Company domain : Nama domain instansi Anda, atau jika belum punya domain Anda bisa mengisinya dengan domain apa saja.
- Package name : Nama paket aplikasi bersifat unik, jika nama paket aplikasi tersebut sudah ada pada Play Store atau App Store, silakan Edit dengan nama paket yang unik. Untuk mengecek apakah nama paket aplikasi tersebut sudah ada di Play Store atau belum, Anda bisa buka link berikut
https://play.google.com/store/apps/details?id=package (ganti package dengan nama paket aplikasi Anda). - AndroidX : Jika Anda ingin menggunakan AndroidX pada project Anda.
- Platform channel language : Jika ingin menggunakan bahasa Kotlin atau Swift pada project untuk platform channel, jika tidak di ceklis secara otomatis bahasa yang digunakan adalah Objective-C dan Java.
5. Tunggu beberapa saat sampai project berhasil terbuat dan muncul file main.dart.
6. Coba jalankan aplikasi dengan menjalankan Run ‘main.dart’ pada menu Run, atau klik segitiga hijau pada toolbar atas di Android Studio.
Terminal / Command Prompt (CMD)
1. Ketikkan flutter create project_name
C:\Users\Faisal Ridwan> flutter create project_name
(ganti project_name dengan nama project yang Anda ingin buat).
2. Masuk ke direktori atau folder project Flutter tersebut dengan mengetikkan cd project.
C:\Users\Faisal Ridwan> cd project_name
3. Ketikkan flutter devices
C:\Users\Faisal Ridwan> flutter devices
untuk melihat apakah sudah ada perangkat yang terhubung dengan komputer atau laptop Anda.
4. Coba jalankan aplikasi dengan mengetikkan flutter run,
C:\Users\Faisal Ridwan> flutter run
maka aplikasi counter sederhana akan muncul.
Sebelum menjalankan aplikasi pada real device jangan lupa untuk mengaktifkan Developer options dan USB debugging.
Sampai disini tutorial Flutter Pemula #2 – Menggunakan Visual Studio Code atau Android Studio untuk Coding Flutter , ikuti terus website ini untuk mendapatkan tutorial dan artikel menarik lainya. Semoga bermanfaat, jangan lupa berkomentar dan bagikan artikel ini jika menurut kamu berguna. 🙂
6 thoughts on “Flutter Pemula #2 – Menggunakan Visual Studio Code atau Android Studio untuk Coding Flutter”