WORKSHOP FROM HOME III

MOBILE PROGRAMMING PENGANTAR FLUTTER DAN

DART
NARASUMBER :
IR AGUS SUHARTO M.KOM
(Webinar Senin, 1 Juni 2020)

LAPORAN

Oleh :
SAMSO SUPRIYATNA
161021700424

PROGRAM STUDI SISTEM INFORMASI

SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN
KOMPUTER (STMIK) ERESHA
TANGERANG SELATAN
2020
 KATA PENGANTAR

Bismillahirahmanirrahim
Puji syukur Alhamdulillah kehadirat Allah SWT yang telah melimpahkan
rahmat dan karunia-Nya, sehingga penulis dapat menyelesaikan laporan webinar
untuk melengkapi tugas mata kuliah Kapita Selekta berjudul “WORKSHOP FROM
HOME III MOBILE PROGRAMMING PENGANTAR FLUTTER DAN DART”
dengan baik.
Penulis menyadari bahwa laporan ini masih jauh dari kata sempurna
dikarenakan keterbatasan kemampuan penulis. Untuk itu penulis mengharapkan
sumbangsih fikiran berupa kritik dan saran yang bersifat membangun demi hasil
penulisan yang lebih baik dimasa yang akan datang.
Dengan segala keterbatasan, penulis menyadari pula bahwa laporan ini
takkan terwujud tanpa bantuan, bimbingan, dan dorongan dari berbagai pihak.
Untuk itu, dengan segala kerendahan hati, penulis menyampaikan ucapan terima
kasih kepada:
1. Allah SWT. yang telah memberikan ni‘mat iman dan sehat sehingga dapat
menyelesaikan laporan skripsi ini.
2. Bapak Dr. Achmad Hindasyah, M.Si. selaku Ketua STMIK Eresha.
3. Bapak Dr. Ir. Agung Budi Susanto, M.M, selaku Ketua Program Studi Sistem
Informasi STMIK Eresha.
4. Bapak Yan Mitha Djaksana, M.Kom, selaku Ketua Program Studi Teknik
Informatika STMIK Eresha.
5. Bapak Ir. Agus Suharto M.Kom, selaku narasumber pada webinar Workshop
From Home III.
Semoga Allah SWT membalas kebaikan dan selalu mencurahkan hidayah
serta taufik-Nya, Amin. Penulis mohon maaf atas segala kesalahan yang pernah
dilakukan, Semoga laporan ini dapat memberikan manfaat terutama dibidang
sistem informasi.

Tangerang Selatan, 01 Juli 2020

Penulis

II
 DAFTAR ISI

KATA PENGANTAR ii

DAFTAR ISI iii

DAFTAR GAMBAR v

BAB I PENDAHULUAN 1

1.1 Latar Belakang 1

1.2 Rumusan Masalah 2

1.3 Tujuan Penulisan 2

1.4 Manfaat Penulisan 2

1.5 Batasan Masalah 2

BAB II LANDASAN TEORI 3

2.1 Mobile Programming 3

2.2 Pengertian SDK (Software Development Kit) 3

2.3 Pengertian Flutter 4

2.4 Pengertian Dart 5

2.5 Pengertian Emulator 6

2.6 Pengertian WAP (Wireless Aplication Protocol ) 7

BAB III PEMBAHASAN 8

3.1 Sistem Kerja Flutter 8

3.2 Sistem Kerja Pemerograman Dart 8

3.3 Penggunaan Flutter 9

3.4 Sfesisikasi Hardware dan Software 9

3.5 Software Pendukung 9

3.6 Proses Instalasi Flutter SDK 10

III
 3.7 Run Flutter Doctor 12

3.8 Install Visual Studio Code 13

BAB IV 16

KESIMPULAN 16

4.1 Kesimpulan 16

DAFTAR PUSTAKA 17

LAMPIRAN 18

IV
 DAFTAR GAMBAR

Gambar 1 Logo Flutter 4

Gambar 2 Logo Dart 6
Gambar 3 Emulator 7
Gambar 4 File Download 10
Gambar 5 Update Path 11
Gambar 6 Konfigurasi 11
Gambar 7 Flutter Doctor 12
Gambar 8 Flutter Doctor Lengkap 12
Gambar 9 Flutter Doctro Lengkap 12
Gambar 10 Download File 13
Gambar 11 Setup File 13
Gambar 12 Flutter New Project 14
Gambar 13 Name Project 14
Gambar 14 Lokasi Penyimpanan 15
Gambar 15 Finish Instalation 15

V
 BAB I
PENDAHULUAN

1.1 Latar Belakang

Perkembangan teknologi informasi pada era modern saat ini smarthpone

telah berkembang begitu pesat di seluruh dunia. Pada tahun 1993 dirilis
smartphone yang pertama, “IBM Simon” yang memiliki fitur layar sentuh, email
serta PDA. Selang 3 tahun kemudian, tahun 1996 Palm Pilot 1000
memperkenalkan personal digitalassistant (PDA) untuk pertama kalinya dengan
sistem operasi Palm OS. Masih dalam tahun yang sama PC Handled untuk
pertama kalinya diperkenalkan dengan sistem Windows CE. 4 tahun, kemudian,
tahun 2000 Symbian menjadi sistem operasi mobile modern pertama pada
smartphone yang diluncurkan oleh Ericsson R380.
Smartphone saat ini bukan hanya sebatas alat telekomunikasi melainkan
mencakup dalam bidang pendidikan, bisnis, dan hiburan. Adaptasi masyarakat
terhadap smartphone begitu cepat, terutama dengan hadirnya beberapa macam
Operating System khusus untuk mobile device yang telah ada seperti Android,
iOS, Windows Phone, Symbian, dan lainnya. Perkembangan Operating System
tersebut tidak akan pesat tanpa dukungan dari berbagai macam aplikasi diciptakan
beragam yang sangat membantu aktivitas masyarakat. Oleh karena itu, banyak
sekali developer yang berlomba membuat aplikasi untuk setiap Operating System.
Dewasa ini, jika kita menyebut tentang mobile device pasti tidak lepas
dengan istilah Mobile Programming yang sangat popular dikalangan programmer.
Untuk memudahkan programmer dalam pembuatan aplikasi berbasis mobile
banyak perusahaan menawarkan berbagai macam framework yang dapat
digunakan berbayar ataupun yang gratisan (open source). Diantara framework
tersebut adalah flutter, jQuery mobile, cordova, ionic dan lainnya. Serta tersedia
berbagai macam bahasa pemerograman untuk membuat aplikasi berbasis mobile
diantaranya java, dart, swift, kotlin, objective-C dan lainnya.

1
 Dari paparan diatas yang diperdalam pembahasan dalam webinar Workshop
From Home III yang diselenggarkan pada tanggal 1 juni 2020 yaitu mobile
programming dengan flutter dan dart.

1.2 Rumusan Masalah

Rumusan masalah yang dapat disimpulkan dalam laporan ini adalah sebagai
berikut :
1. Apakah yang dimaksud dengan flutter and dart?
2. Bagaimana cara membangun aplikasi dengan flutter and dart ?

1.3 Tujuan Penulisan

Laporan ini dibuat tentunya memiliki beberapa tujuan diantaranya sebagai
berikut :
1. Mengetahui dan memahami pembuatan aplikasi berbasis mobile dengan
menggunakan framework fluter dan bahasa pemerograman dart.
2. Memenuhi tugas mata kuliah Kapita Selekta dengan membuat laporan hasil
webinar dilingkungan STMIK Eresha.

1.4 Manfaat Penulisan

Manfaat dari penulisan laporan ini adalah sebagai berikut :
1. Mengetahui software serta bahasa pemerograman yang digunakan dalam
pembuatan aplikasi berbasis mobile.
2. Dapat dijadikan sebagai acuan dalam belajar dan memahami mobile
programming.

1.5 Batasan Masalah

Agar penulisan laporan ini tidak mencakup luas maka dibuatlah batasan
masalah. Adapun batasan masalah tersebut mencakup pada mobile programming
dengan menggunakan pengantar flutter and dart.

2
 BAB II
LANDASAN TEORI

2.1 Mobile Programming

Mobile Programming adalah pemerograman yang digunakan untuk

perangkat mobile. Adapun macam-macam Mobile Programming seperti :
1. Java 2 Micro Edition (J2ME)
2. Objective C yang hanya digunakan oleh iOS
3. C++ Brew Framework untuk handphone CDMA
4. C#.NET untuk Windows Phone
5. Javafx mobile untuk Android
6. PHP
7. Dart
8. Flash Lite
9. C++ dalam Symbian Framework
Masing-masing framework mempunyai bahasa pemerograman tersendiri dalam
penggunaanya.

2.2 Pengertian SDK (Software Development Kit)

SDK adalah seperangkat alat dan program perangkat lunak yang digunakan
oleh pengembang untuk membuat aplikasi untuk platform tertentu. Tools SDK
akan mencakup berbagai hal, termasuk library, dokumentasi, contoh kode, proses,
dan panduan yang dapat digunakan dan diintegrasikan oleh pengembang ke dalam
aplikasi mereka sendiri. SDK dirancang untuk digunakan untuk platform atau
bahasa pemrograman tertentu. (Rifqi, 2019)
SDK atau Devkit berfungsi dengan cara yang hampir sama dengan API,
menyediakan seperangkat alat, perpustakaan, dokumentasi yang relevan, contoh
kode, proses, dan atau panduan yang memungkinkan pengembang untuk membuat
aplikasi perangkat lunak pada platform tertentu. Jika API adalah sekumpulan blok
bangunan yang memungkinkan pembuatan sesuatu, SDK adalah bengkel lengkap,
yang memfasilitasi pembuatan jauh di luar cakupan yang diizinkan oleh API.

3
 SDK adalah sumber-sumber untuk hampir setiap program yang akan
berinteraksi dengan pengguna modern. Dari peramban Website yang Anda
gunakan hingga permainan video yang Anda mainkan di akhir hari, banyak yang
pertama kali dibangun dengan SDK, bahkan sebelum API digunakan untuk
berkomunikasi dengan aplikasi lain. Adapun manfaat dari penggunaan SDK
(Software Development Kit) yaitu integrasi lebih cepat, pengembangan efisien,
peningkatan reach (jangkauan) dan kontrol merk.

2.3 Pengertian Flutter

Sebuah SDK framework open-source yang dikembangkan oleh Google

(Lars Bak dan Kasper Lund). untuk membangun antarmuka (user
interface/UI) aplikasi Android dan iOS. (Suharto M.Kom, 2020)
Flutter adalah toolkit UI Google yang digunakan untuk membuat aplikasi yang
indah (beautifull), yang di compile secara native pada mobile dan dekstop yang
dikemas dalam satu codebase. Flutter merupakan SDK opensource yang
dikembangkan dan dikelola oleh Google yang dirilis pertama kali pada tahun
2017. Flutter sendiri menggunakan bahasa pemrograman dart. Compiler aplikasi
dart menggunakan metode “ahead of time (AOT)”, dimana sistem yang sudah di
compile sedari awal menjadi sistem native, sehingga dapat membantu kita lebih
cepat pada saat mendevelop dan running aplikasi. (Muhardian, 2018)

Gambar 1 Logo Flutter

4
Antara flutter dan react native memiliki paradigma yang sama, beberapa hal
seperti event handlers dan class extension. Di flutter tidak ada JSX seperti react
native sehingga tidak ada pemisah antara template, styling, dan fungsi di flutter.
Ada beberapa kelebihan flutter diantaranya :
1. Mendukung desain UI yang cantik (Expressive UI).
2. Hot Reload atau flash development.
3. Single Codebase
4. Memiliki fitur flutter doctor
5. Mudah di fahami
6. Support beberapa IDE ternama
7. Menghemat waktu dan biaya

2.4 Pengertian Dart

Adalah bahasa pemerograman yang dikembangkan oleh Google

untuk aplikasi mobile, desktop, web ataupun teknologi IOT.
Bahasa pemrograman bertipe OOP dimana struktur kode kita berada di
dalam class, data/Property dan method, Dart memakai C-style syntax yang mirip
dengan bahasa C, Java, Javascript. (Suharto M.Kom, 2020)
Dart adalah sebuah bahasa pemrograman yang dikembangkan oleh google untuk
kebutuhan dalam membuat aplikasi android/mobile, front-end, web, IoT, back-end
(CLI), dan Game. Dart sudah menerapkan konsep pemrograman berorientasi
objek (OOP) dimana struktur kode berada dalam class yang didalamnya berisi
method maupun variabel. Dart sendiri menggunakan C-Style syntax sehingga
mekanisme dart mirip dengan bahasa pemrograman C, java, javascript, dan Swift.

5
 Gambar 2 Logo Dart

2.5 Pengertian Emulator

Aplikasi yang memungkinkan sebuah software dari sebuah platform berjalan

di atas platflorm lain. Emulator menjalankan kode-kode software pada virtual
machine. Sehingga software tersebut mengira bahwa Ia sedang berjalan di atas
platform aslinya.Sebagai contoh suatu program Windows dapat dijalankan di
sistem operasi Linux dengan menggunakan piranti lunak emulator Wine. Ada pula
program yang mengemulasikan suatu komputer dalam komputer, misalnya
VMware. Contoh lain adalah program-program emulator untuk menjalankan
permainan komputer yang awalnya hanya bisa dijalankan pada konsolnya masing-
masing, misalnya Nintendo, Atari, PlayStation, XBox dan lain-lain. Ada tiga
macam emulator yang bisa digunakan untuk menjalankan aplikasi Flutter:
1. Emulator bawaan Android Studio
2. Smartphone fisik (HP sendiri)
3. Genymotion

6
 Gambar 3 Emulator

2.6 Pengertian WAP (Wireless Aplication Protocol )

Teknologi WAP (Wireless Aplication Protocol ) merupakan sebuah metode

untuk menghadirkan halaman web di dalam layar Ponsel (Telepon Seluler).
Dengan begitu, maka bentuk informasi dari sebuah instansi tidak hanya
ditampilkan dengan metode Web yang hanya dapat di akses melalui Browser,
akan tetapi dapat ditampilkan dalam bentuk WAP yang dapat dilihat dengan
ponsel. Dengan adanya dukungan GPRS dari pesawat Handphone, maka
memungkinkan kita untuk mengakses semua informasi yang disajikan dalam
internet dalam bentuk WAP. WAP dapat dibuat dengan menggabungkan
pemrograman WML (Wireless Markup Language)dengan pemrograman PHP
sehingga dapat menghadirkan aplikasi WAP yang dinamis.

7
 BAB III
PEMBAHASAN

3.1 Sistem Kerja Flutter

Flutter mudah untuk dipelajari sama halnya dengan beberapa framework

lain yang sudah mendukung pemerograman berbasis objek (OOP), bahkan
setupnya juga jauh lebih mudah daripada react native. Sebagai framework Flutter
menggunakan bahasa pemerograman dart sama halnya dengan framework visual
studio dengan menggunakan bahasa pemerograman java. Adapun beberapa
perbedaan antara flutter dengan android studio diantranya sebagai berikut :

Tabel 1 Perbedaan Flutter & Android Studio

Tools Flutter Android Studio

Hot Reload Adanya fitur reload Tidak ada fitur reload
Bahasa Pemerograman Dart Java dan Kotlin
1 Codebase 2 Aplikasi Dapat di build ke Hanya bisa build ke
Android dan IOS Android saja
Costumizable UI Widget Terdapat mesin render Hanya bergantung pada
sendiri untuk widget bawaan OEM
menampilkan widgetnya

3.2 Sistem Kerja Pemerograman Dart

Tipe bahasa pemrograman dart berupa Statically Typed dimana tipe dari
variabel diketahui ketika proses compile, ketika membangun aplikasi mobile, dart
dicompile kedalam bahasa native agar dapat berjalan di mobile, lalu di transpile
ke javascript agar dapat berjalan di browser. Dart diterapkan pada framework
flutter yang merupakan framework untuk membuat aplikasi mobile yang saat ini
ramai diperbincangkan. Flutter adalah sebuah framework yang dirancang khusus
untuk membangun antarmuka (UI) aplikasi mobile yang lebih ekspresif dan
menarik.

8
 Bahasa pemrograman Dart dapat digunakan secara bebas oleh para
developer, karena bahasa ini dirilis secara open-source oleh Google di bawah
lisensi BSD. Bahasa pemrograman Dart merupakan bahasa pemrograman berbasis
class dan berorientasi terhadap obyek dengan menggunakan sitaks bahasa
pemrograman C.

3.3 Penggunaan Flutter

Ada beberapa aplikasi dalam perusahaan besar yang dibangun
menggunakan flutter diantaranya:
1. Google
2. Groupon
3. Alibaba Group
4. Capital One
5. BMW
6. Tencent
7. Ebay dan lainnya

3.4 Sfesisikasi Hardware dan Software

Untuk menunjang penggunaan flutter dalam membangun sebuah aplikasi
tentunya ada beberapa spesifikasi hardware dan software yang harus diperhatikan,
dengan tujuan agar memperlancar proses pembuatan. Adapun spesifikasi minimal
tersebut adalah :
1. Processor Intel Core i3 gen 4
2. RAM 4 GB
3. Hardisk 500 GB disarankan menggunakan tipe SSD
4. Windows 7 64 Byte atau yang terbaru

3.5 Software Pendukung

Dalam pembuatan sebuah aplikasi berbasis mobile yang perlu disiapkan
dalam belajar flutter diantaranya:
1. Java Development Kit (JDK);
2. Android Studio;

9
3. Android SDK;
4. Flutter SDK;
5. Teks Editor (atau bisa juga pakai Android Studio).

3.6 Proses Instalasi Flutter SDK

a. Pertama Download File instalasi berikut untuk mendapatkan rilis stabil
terbaru dari Flutter SDK:

Gambar 4 File Download

b. Setelah selesai buat folder baru lalu Extract file zip nya (contoh c:\src\flutter
(jangan install fluter pada folder c:\program files\
c. Update path pada environment variable :

10
 Gambar 5 Update Path

d. Klik tombol Envornment variable untuk set path tersebut

Gambar 6 Konfigurasi

11
e. Arahkan ke path lalu klik tombol new,
f. Pada jendela New User Variable, klik Browse directory
g. Telusuri file flutter pada folder yang sudah di extract,
h. Sampai ketemu folder Bin, lalu klik.
i. Selesai

3.7 Run Flutter Doctor

Untuk mengatahui apakah apakah flutter sudah siap digunakan kita bisa check
dengan perintah Flutter Doctor pada command prompt

Gambar 7 Flutter Doctor

Contoh hasil dari flutter doctor belum lengkap :

Gambar 8 Flutter Doctor Lengkap

Contoh hasil dari flutter doctor sudah siap :

Gambar 9 Flutter Doctro Lengkap

12
3.8 Install Visual Studio Code
Download terlebih dahulu file intaller Visual Studio Code melalui situs
resminya https://code.visualstudio.com/

Gambar 10 Download File

Setelah proses download berhasil , klik ganda file installernya,

Gambar 11 Setup File

Ikuti tahapan install dengan di akhiri klik next

Klik Finish jika tahapan selesai.

13
Setelah itu install Flutter dan Dart Flugin pada Visual Studio Code

3.9 Membuat Project Flutter pada Visual Studio Code

Lankah-langkah dalam membuat project flutter adalah sebagai berikut :
Buka VS Code.
Klik View –Command pallete (Ctrl+Shift+P)
Pada command > Ketik Flutter:New Project

Gambar 12 Flutter New Project

Pada kotak isian New Project ketik nama Aplikasi nya :

Gambar 13 Name Project

Kemudian kita akan diminta untuk menentukan lokasi penyimpanan project. Kita
bisa menyimpan di tempat yang diinginkan.

14
 Gambar 14 Lokasi Penyimpanan

Tunggulah proses pembuatannya sampai selesai.

Gambar 15 Finish Instalation

15
 BAB IV
KESIMPULAN

4.1 Kesimpulan

Smarthphone merupakan kebutuhan primer sebagai penunjang kebutuhan,

tentunya tidak lepas dari aplikasi yang terdapat didalamnya. Dalam pembuatan
aplikasi berbasis mobile terdapat berbagai macam framework dan bahasa
pemerograman yang dapat digunakan diantaranya Flutter dan Dart. Flutter
merupakan SDK opensource yang dikembangkan dan dikelola oleh Google yang
dirilis pertama kali pada tahun 2017. Sedangkan Dart adalah sebuah bahasa
pemrograman yang dikembangkan oleh google untuk kebutuhan dalam membuat
aplikasi android atau mobile, front-end, web, IoT, back-end (CLI), dan Game.
Kelebihan menggunakan flutter dibandingkan framework lain yaitu diantranya
sangat menarik dan hot reload.

16
 DAFTAR PUSTAKA

Suharto M.Kom, I. (2020). Mobile Programming Pengantar Flutter dan Dart.

Tangerang.
Rifqi, M. (2019, Juni 14). Pengertian SDK. Retrieved from
https://rifqimulyawan.com/blog/pengertian-sdk/
Muhardian, A. (2018, Juli 15). Retrieved from
https://www.petanikode.com/flutter-linux/

17
 LAMPIRAN

Lampiran 1 Sertifikat Webinar WFH III

18