Dokumen tersebut memberikan panduan singkat tentang cara membuat aplikasi sederhana menggunakan Visual Studio Code dan Flutter. Langkah-langkahnya meliputi instalasi plugin Flutter di VS Code, membuat project baru menggunakan perintah flutter create, dan menginput script Dart ke dalam project untuk membangun tampilan awal aplikasi.

1. Fariz Nizar, M.Ars
MembuatAplikasi
sederhana
(vsc&flutter)

2. Apa Yang kita
pelajari hari ini
Membuat
Script
Menginput
Script ke VSC
Menginstal
Flutter
01 02 03
Plugins
tambahan untuk
visual studio
code
Script digunakan
untuk bahasa
pemrograman
aplikasi di VSC
Script di input
dan membuat
tampilan dari
aplikasi di VSC

3. 01
Install
flutter
Plugins tambahan (Extension) untuk
visual studio code

4. Install Extension Flutter di VS Code
Pertama silahkan install beberapa extension Flutter yang dibutuhkan. Masuk ke
manu extension, lalu ketik flutter.

5. Membuat aplikasi sederhana
Pilih Folder untuk tempat Directory projectnya. kali ini saya ingin menyimpannya pada
folder Fulter di dalam Document

6. Membuat aplikasi sederhana
Klik File -> Open Windows PowerShell -> Open Windows PowerShell

7. Membuat aplikasi sederhana
Ketik kan perintah flutter create app_flutter pada powershell yang baru dibuka.

8. Membuat aplikasi sederhana
tunggu sebentar proses persiapan projectnya. ketika project flutter sudah selesai akan
menjadi

9. Membuat aplikasi sederhana
tunggu sebentar proses persiapan projectnya. ketika project flutter sudah selesai akan
menjadi

10. Membuat aplikasi sederhana
Buka folder app_flutter pada folder yang kita buat tadi sehingga menjadi
Buka Project di VS Code dengan Klik kanan -> Open in Visual Studio Code

11. Komponen struktur aplikasi Flutter akan
dijelaskan di sini:
1.android – Kode sumber yang dibuat secara otomatis untuk membuat aplikasi android
2.ios – Kode sumber yang dibuat secara otomatis untuk membuat aplikasi ios
3.lib – Folder utama yang berisi kode Dart yang ditulis menggunakan framework flutter
4.lib/main.dart – kode aplikasi Flutter
5.test – Folder berisi kode Dart untuk menguji aplikasi flutter
6.test/widget_test.dart – Contoh kode
7..gitignore – File kontrol versi Git
8..metadata – dibuat secara otomatis oleh alat flutter
9..packages – dibuat secara otomatis untuk melacak paket flutter
10.pubspec.yaml – Digunakan oleh Pub, pengelola paket Flutter
11.pubspec.lock – Dibuat secara otomatis oleh pengelola paket Flutter, Pub
12.README.md – File deskripsi proyek yang ditulis dalam format Markdown format

12. 02
Membuat
SRIPT
Script digunakan untuk bahasa
pemrograman aplikasi di VSC

13. didalam folder lib/main.dart.
Copykan script yang telah diberikan dosen pada laptop kalian masing
masing dan buat folder untuk script dari dosen

14. 03
Menginput
Script ke VSC
Script digunakan untuk bahasa
pemrograman aplikasi di VSC

15. kita coba untuk menjalan kan aplikasi tersebut dengan menekan F5 dan tunggu
sebentar untuk mendebug

16. CREDITS: This presentation template was created by Slidesgo, including
icons by Flaticon, and infographics & images by Freepik
Do you have any questions?
THANKS