· 12 Jul 2018

[Tutorial Instan] Belajar Cepat Bahasa Pemrograman Dart

Tutorial Belajar Bahasa Pemrograman Dart

Hello, selamat datang di “tutorial instan” belajar bahasa pemrograman Dart.

Ini adalah tutorial yang saya buat untuk mereka yang ingin belajar bahasa pemrograman Dart dengan cepat.

Jika kamu pernah belajar bahasa pemrograman sebelumnya, saya yakin akan mudah mengikuti tutorial ini. Apalagi yang sudah pernah belajar Javascript.

Namun, apabila belum sama sekali…

…ya maaf saja, karena sepertinya tutorial ini tidak newbie friendly 😄.

Pada tutorial ini, kita akan membahas:

Apa itu Dart?
Instalasi Dart
Membuat Program Hello World
Variabel dan Tipe Data
Fungsi Input dan Output pada Dart
Operator pada Dart
Control Flow (Percabangan)
Control Flow (Perulangan)
Struktur data List
Fungsi pada Dart
Class pada Dart

Mari kita mulai…

1. Apa itu Dart?

Dart adalah bahasa pemrograman yang dikembangkan oleh Google untuk kebutuhan umum (general-purpose programming language).

Ia bisa digunakan untuk membuat aplikasi android, front-end web, IoT, backend (CLI), dan Game.

Contoh beberapa aplikasi yang dibangun dengan Dart:

Google Adsense (front-end)
Google AdWords (front-end)
Google Fiber (front-end)
Hamilton (Android dan iOS)
dll.

Selengkapnya, bisa dilihat pada: Who Uses Dart

Platform Dart

Dart dapat digunakan pada tiga platform ini:

1. Flutter

Apabila kita ingin membuat aplikasi Android dan iOS dengan bahasa pemrograman Dart, maka kita harus menggunakan framework Flutter.

Flutter adalah sebuah framework yang dirancang khusus untuk membangun antarmuka (UI) aplikasi mobile.

2. Web

Penggunaan Dart pada web biasanya dalam bentuk front-end. Kode program Dart dapat dikompilasi (transpile) menjadi kode Javascript, sehingga web browser dapat mengeksekusinya.

Biasanya, pengembangan web dengan Dart menggunakan framework:

3. Server

Dart dapat juga digunakan pada server untuk membuat program berbasis teks (CLI), program IoT, backend, dll.

Beberapa framework yang bisa digunakan untuk mengembangkan backend:

Peralatan untuk Belajar Dart

Ada dua peralatan yang harus disiapkan untuk mengikuti tutorial ini:

Teks Editor VS Code + Ekstensi Dart;
Dart SDK (berisi library, compiler, transpiler, dll. yang dibutuhkan untuk coding Dart).

Selain menggunakan dua peralatan tersebut, kita juga dapat menggunakan Dartpad untuk mencoba kode program dart.

Syntaks Dasar Dart

Dart memiliki sintak yang mirip seperti C++, C#, Java, dan Javascript. Karena Dart menggunakan standar ECMA-408.

Jadi, buat kamu yang sudah pernah belajar bahasa C++, C#, Java, dan javascript sebelumnya, saya yakin akan cepat memahami tutorial ini.

Sekarang coba perhatikan Contoh program Hello World ini:

main() {
  print('Hello World!');
}

Sederhana sekali bukan.

Lalu, bagaimana cara kita mengeksekusi program tersebut?

Pertama, kita harus install dulu Dart. Baru nanti bisa dieksekusi.

Kalau begitu mari kita lanjut ke tahap:

2. Instalasi Dart

Dart dapat kita install dengan berbagai cara, tergantung dari sistem operasi yang digunakan.

Pada tutorial ini, saya akan menginstal Dart pada Kubuntu 18.04 melalui apt.

Silahkan ikuti langkah berikut:

Buka terminal, lalu paste perintah ini untuk menambahkan repository Dart.

sudo apt-get update
sudo apt-get install apt-transport-https
sudo sh -c 'curl https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -'
sudo sh -c 'curl https://storage.googleapis.com/download.dartlang.org/linux/debian/dart_stable.list > /etc/apt/sources.list.d/dart_stable.list'

Perintah di atas di-copas satu per satu.

Setelah itu lakukan update dan install Dart:

sudo apt-get update
sudo apt-get install dart

Tunggu sampai prosesnya selesai:

Setelah itu, ketik perintah dart --version untuk memeriksa versi yang terinstal:

Dengan demikian, kita sudah siap belajar bahasa pemrograman Dart.

Mari kita mulai:

3. Membuat Program Dart Pertama

Pertama silahkan buat direktori atau folder baru dengan nama belajar-dart. Setelah itu buka dengan teks editor VS Code.

Buka menu File -> Open Folder:

Cari direktori yang kamu buat tadi:

Berikutnya, buat file baru bernama hello_world.dart:

Isi file hello_world.dart dengan kode berikut:

void main(){
    print('Hello World!');
}

Silahkan disimpan.

Berikutnya, kita akan mengeksekusi programnya melalui terminal.

Tenang saja,… di VS Code sudah ada terminalnya yang bisa dibuka melalui menu View -> Integreted Terminal.

Pada terminal yang terbuka, ketik perintah berikut ini untuk mengeksekusi program Dart:

dart hello_world.dart

Hasilnya:

🎉 Selamat!

Kamu sudah berhasil membuat program pertama dengan Dart.

Selanjutnya kita akan belajar tentang variabel dan tipe data pada Dart.

4. Variabel dan Tipe Data

Variabel adalah sebuah simbol yang digunakan untuk menyimpan nilai. Sedangkan tipe data adalah jenis nilai yang akan kita simpan.

Tipe data dasar pada Dart dibagi menjadi tiga macam:

Tipe data Angka (Number): int, double
Tipe data teks: String
Tipe data boolean: bool

Lalu untuk membuat variabel pada Dart, kita bisa menggunakan kata kunci var dan menuliskan langsung tipe datanya.

Contoh:

var judul = "Belajar Pemrograman Dart";
int harga = 123000;
double berat = 2.23;

Apa perbedaan pembuatan variabel menggunakan kata kunci var dengan ’tipe data'?

Apabila kita membuat variabel menggunakan kata kunci var, maka variabel tersebut akan bisa diisi dengan tipe data apapun.

Sedangkan apabila kita membuat variabel dengan ’tipe data’, maka variabel tersebut hanya boleh diisi dengan nilai yang sesuai dengan tipe data yang diberikan.

Contoh:

// mula-mula kita isi variabel dengan nilai integer
var judul = 124;

// lalu kita isi ulang dengan string, ini sah!
judul = "Belajar Dart dalam Sehari!"

// tapi kalau kita membuat variabel seperti ini:
int harga = 90000;

// kita tidak bisa mengisi ulang dengan tipe data yang berbeda
harga = "sembilan puluh ribu"; // <-- ini akan error

Sebagai latihan, silahkan ikuti contoh program berikut…

Buat file baru bernama variabel.dart, lalu isi dengan kode ini:

void main(){
    // membuat variabel dengan tipe data
    String nama = "Dian";
    int umur = 23;
    double tinggi = 180.43;
    bool isMenikah = false;

    // membuat veriabel dengan kata kunci var
    var alamat = "Lombok, Indonesia";

    // mencetak variabel
    print("Nama saya $nama. Umur $umur tahun. Tinggi sekitar $tinggi cm.");
    print("Menikah: $isMenikah");
    print("Alamat: $alamat");
}

Hasilnya:

Program variabel dan tipe data dalam Dart

5. Fungsi Input dan Output

Kita sudah mengenal fungsi print() yang digunakan untuk menampilkan output ke dalam console.

Selain menggunakan fungsi print(), kita juga dapat menggunakan fungsi stdout.write(). Fungsi ini berada di dalam library dart:io.

Jadi untuk menggunakan fungsi stdout.write(), kita harus mengimpornya terlebih dahulu.

Caranya:

Pada bagian paling atas program, kita tulis import seperti ini:

import 'dart:io';

Maka semua fungsi yang ada di dalam library dart:io akan dapat digunakan di dalam program.

Libray dart:io adalah libray yang berisi fungsi-fungsi, konstanta, class, dan objek untuk melakukan operasi input dan output seperti:

Baca tulis file;
Baca tulis data dari jaringan;
Baca input dari keyboard;
Menampilkan output ke console;
dll.

Nah, sekarang mari kita coba menggunakan library ini di dalam program Dart.

Buat sebuah file baru bernama program_input.dart, lalu isi dengan kode berikut:

import 'dart:io';

main() {
  stdout.write("Siapa kamu: ");
  var nama = stdin.readLineSync();
  print("Hello $nama!");
}

Hasilnya:

Perhatikanlan fungsi write() dan readLineSync().

Fungsi write() digunakan untuk menampilkan teks ke console “apa adanya”. Artinya dia tidak akan membuat baris baru.

Berbeda dengan print() yang akan selau membuat baris baru di setiap mencetak teks.

Lalu fungsi readLineSync() adalah fungsi untuk membaca input dari keyboard. Fungsi ini akan mengembalikan nilai berupa String.

6. Operator

Dart memiliki operator yang sama seperti bahasa C++, C#, Java, dan Javascript.

Ada 6 kelompok operator di dalam pemrograman Dart:

(Mind map ukuran penuh cek ke sini: coggle.it)

Operator Aritmatika

Penjumlahan (+)
Pengurangan (-)
Pembagian (/) yang menghasilkan nilai double.
Pembagian (~/) yang menghasilkan nilai integer.
Perkalian (*)
Sisa bagi atau modulo (%)
Increment (++)
Derement (--)

Operator Relasi

Sama dengan (==)
Tidak samadengan (!=)
Lebih besar (>)
Lebih kecil (<)
Lebih besar sama dengan (>=)
Lebih kecil sama dengan (<=)

Operator Penugasan

Pengisian (=)
Penjumlahan (+=)
Pengurangan (-=)
Pembagian (/=)
Perkalian (*=)
Sisa Bagi (%=)

Operator Logika

And (&&)
Or (||)
Not (!)

Operator Bitwise

And (&)
Or (|)
Xor (^)
Not (~)
Left Shift (<<)
Right Shift (>>)

Operator Ternary (?)

Itulah operator-operator yang ada pada Dart. Mari kita coba dalam program:

import 'dart:io';

main() {
  print("PROGRAM OPERATOR");

  stdout.write("Nilai a: ");
  double a = double.parse(stdin.readLineSync());
  stdout.write("Nilai b: ");
  double b = double.parse(stdin.readLineSync());

  double hasil;

  // operator penjumlahan
  hasil = a + b;
  print("$a + $b = $hasil");
  
  // operator pengurangan
  hasil = a - b;
  print("$a - $b = $hasil");
  
  // operator perkalian
  hasil = a * b;
  print("$a * $b = $hasil");
  
  // operator pembagian
  hasil = a / b;
  print("$a / $b = $hasil");
  
  // operator sisa bagi
  hasil = a % b;
  print("$a % $b = $hasil");

}

Contoh di atas hanya menggunakan operator aritmatika.

Hasilnya:

Untuk operator-operator yang lain, silahkan dicoba sendiri ya…

7. Control Flow (Percabangan)

Struktur percabangan pada bahasa pemrograman Dart, sama seperti pada C++, C#, Java, dan Javascript.

Ada lima macam bentuk percabangan pada Dart:

Percabangan If;
Percabangan If/Else;
Percabangan If/Else If/Else;
percabangan Switch/Case;
Percabangan dengan Operator Ternary.

Mari kita coba:

1. Percabangan If

Contoh: program_diskon.dart

import 'dart:io';

void main(){
    print("### Program Kasir ###");
    stdout.write("Total belanja: ");
    int totalBelanja = int.parse(stdin.readLineSync());

    if( totalBelanja >= 100000 ){
        print("Selamat anda dapat hadiah!");
    }
}

Hasilnya:

2. Percabangan If/Else

Contoh: login.dart

import 'dart:io';

main(){
  print("=== Login ===");
  stdout.write("Password: ");
  String password = stdin.readLineSync().trim();

  // cek password yang diinputkan
  if(password == "kopi"){
    print("Selamat datang bos!");
  } else {
    print("Kamu siapa? Pergi sana!");
  }
}

Hasilnya:

Percabangan If/Else If/Else

Percabangan IF/ELSE IF/ELSE: program_grade.dart

import 'dart:io';

main(){
  print("*** Program Grade ***");

  stdout.write("Inputkan nilai: ");
  int nilai = int.parse(stdin.readLineSync());

  String grade;

  if(nilai >= 90) grade = "A+";
  else if(nilai >= 80) grade = "A";
  else if(nilai >= 70) grade = "B+";
  else if(nilai >= 60) grade = "B";
  else if(nilai >= 50) grade = "C+";
  else if(nilai >= 40) grade = "C";
  else if(nilai >= 30) grade = "D";
  else if(nilai >= 20) grade = "E";
  else grade = "F";

  print("Grade: $grade");
  
}

Hasilnya:

4. Percabangan Switch/Case

Contoh: quote_harian.dart

import 'dart:io';

main(){
  print("~~~ Quote Harian ~~~");
  stdout.write("Input hari: ");
  String hari = stdin.readLineSync().trim().toLowerCase();

  String quote;

  switch(hari){
    case "senin": {
      quote = "Mari kita mulai dari senin";
      break;
    }
    case "selasa": {
      quote = "Selesaikan tugas, dan bersantailah";
      break;
    }
    case "rabu": {
      quote = "Serbu! hari ini penuh semangat!";
      break;
    }
    case "kamis": {
      quote = "Meski hujan gerimis, aku belajar coding";
      break;
    }
    case "jumat": {
      quote = "Jum'at berkah";
      break;
    }
    case "sabtu": {
      quote = "Tenangkan jiwa di hari akhir!";
      break;
    }
    case "minggu": {
      quote = "Selamat berlibur!";
      break;
    }
    default: {
      quote = "Hari yang anda masukan salah!";
    }
  }

  print(quote);
}

Hasilnya:

Percabangan dengan operator ternary

Kita dapat membuat percabangan dengan menggunakan operator ternary (?). Percebangan ini sebenarnya bentuk lain dari If/Else.

Contoh: ternary.dart

import 'dart:io';

main(){
  print("apakah kamu suka aku?");
  stdout.write("jawab (y/t): ");
  String jawab = stdin.readLineSync();

  // menggunakan operator ternary sebagai ganti if/esle
  var hasil = (jawab == 'y') ? "menikah" : "jomblo lagi";

  print("Selamat kamu $hasil");
}

Hasilnya:

Program percabangan dengan operator ternary

8. Control FLow (Perulangan)

Sama seperti Javascript, perluangan di dalam Dart juga ada empat macam:

Perulangan For
Perulangan While
Perulangan Do/While
Perulangan Foreach (For)

Mari kita coba satu per satu…

1. Perulangan For

Buat file baru bernama perulangan_for.dart lalu isi dengan kode berikut:

import 'dart:io';

main(){
  stdout.write("Jumlah perulangan: ");
  int n = int.parse(stdin.readLineSync());

  for(int i = 1; i <= n; i++){
    print("Perulangan ke-$i");
  }
}

Hasilnya:

2. Perulangan While

Buatlah file baru dengan nama perulangan_while.dart, kemudian isi dengan kode berikut:

import 'dart:io';

main() {
  int i = 0;
  bool ulang = true;

  while(ulang){
    stdout.write("Apakah anda mau keluar (y/t): ");
    String jawaban = stdin.readLineSync();

    i++;
    if (jawaban.toUpperCase() == "Y") ulang = false;
  }

  print("Total perulangan: $i");

}

Hasilnya:

3. Perulangan Do/While

Perulangan Do/While adalah perulangan yang melakukan pengecekan kondisi di belakang.

Artinya, ia akan mengulang dulu sebanyak satu kali, baru dicek kondisi atau syarat pengulangannya.

Apabila bernilai true, maka perulangan berlanjut. Namun apabila false maka perulangan akan berhenti.

Contoh: perulangan_dowhile.dart

import 'dart:io';

main() {
  int i = 0;
  bool ulang = true;

  do {
    stdout.write("Apakah anda mau keluar (y/t): ");
    String jawaban = stdin.readLineSync();

    i++;
    if (jawaban.toUpperCase() == "Y") ulang = false;
  } while(ulang);

  print("Total perulangan: $i");

}

Hasilnya:

4. Perulangan Foreach

Perulangan foreach biasanya digunakan untuk mengulang sebanyak isi dari sebuah list atau array.

Perulangan foreach pada Dart sebenarnya adalah sebuah perulangan for yang menggunakan kata kunci in.

Contoh: perulangan_foreach.dart

import 'dart:io';

main() {
  var languages = ["C", "C++", "Java", "Dart", "Javascript"];

  for(var language in languages){
    print(language);
  }

  print("Total bahasa: ${languages.length}");
}

Hasilnya:

9. List

List adalah struktur data yang memungkinkan kita menyimpan banyak nilai di dalam satu variabel.

Dalam bahasa pemrograman lain, list biasanya dikenal dengan sebutan Array.

Cara membuat List pada Dart:

// membuat list kosong dengan ukuran 10
var namaList = new List(10);

// membuat list kosong yang tak jelas ukuran panjangnya
var namaList = [];

// membuat list sekaligus mengisinya dengan nilai
var namaList = ["Belajar", "Dart", "di", "Petani Kode"];

Mari kita coba di dalam program.

Buatlah file baru bernama program_list.dart, lalu isi dengan kode berikut:

import 'dart:io';

main(){
  // membuat list dengan ukuran 5
  var languages = new List(5);

  print("Sebutkan ${languages.length} yang ingin kamu pelajar!");

  for(int i = 0; i < languages.length; i++){
      stdout.write("$i. ");
      languages[i] = stdin.readLineSync();
  }

  print(languages);
}

Hasilnya:

10. Fungsi

Pembuatan fungsi pada Dart sama seperti membuat fungsi pada bahasa C, C++, dan Java.

Contoh:

// fungsi yang tak mengembalikan nilai
void namaFungsi(){
  //...magic...
}

// fungsi yang mengembalikan nilai
String namaFungsi(){
  //...black magic...
}

// fungsi yang memiliki parameter
int namaFungsi(int param1, int param2){
  //...sesuatu...
}

Intinya, jika tidak ada nilai kembalian…

…kita cukup memberikan void di depan nama fungsi.

Sedangkan apabila fungsi memiliki nilai kembalian, kita harus menuliskan tipe data dari nilai yang akan dikembalikan.

Mari kita coba.

Buatlah program baru bernama fungsi.dart, lalu isi kodenya seperti ini:

import 'dart:io';

// membuat fungsi luas persegi
int luasPersegi(int sisi){
  return sisi * sisi;
}

main(){
  print("--- Program luas persegi ---");
  stdout.write("Input panjang sisi: ");
  int s = int.parse(stdin.readLineSync());

  // memanggil fungsi
  int hasil = luasPersegi(s);

  print("Luas: $hasil");
}

Hasilnya:

11. Class

Class pada Dart sama seperti class pada bahasa pemrograman Java.

Contoh: oop_dasar.dart

class Person{
  String _name;
  var _address;

  String getName(){
    return this._name;
  }

  void setName(String name){
    this._name = name;
  }

  String getAddress(){
    return this._address;
  }

  void setAddress(String address){
    this._address = address;
  }
}

// fungsi main
main(){
  var dian = new Person();
  dian.setName("Dian");
  dian.setAddress("Lombok");

  print("Nama: ${dian.getName()}");
  print("Alamat: ${dian.getAddress()}");
}

Hasilnya:

🎁 Semua source code contoh program di atas dapat di-download pada Github

Bonus video:

Apa Selanjutnya?

Akhirnya, selesai juga tutorial ini…

Jika kamu mengikuti dan mencoba sendiri semua contoh-contoh program di atas, saya yakin kamu sudah cukup paham dengan bahasa pemrograman Dart.

Tentu, pembahasan pada tutorial ini masih kulitnya saja. Karena masih banyak yang perlu dibahas lebih dalam lagi.

Yah, namanya juga tutorial instan, seperti mie instan 😄.

Karena itu, saya tidak menjamin kamu akan langsung menjadi expert ngoding Dart setelah menyelesaikan tutorial ini.

Butuh lebih banyak latihan lagi.

Perjalanan masih panjang…

Akhir kata…

Selamat belajar.

1. Apa itu Dart?

Platform Dart

Peralatan untuk Belajar Dart

Syntaks Dasar Dart

2. Instalasi Dart

3. Membuat Program Dart Pertama

4. Variabel dan Tipe Data

5. Fungsi Input dan Output

6. Operator

7. Control Flow (Percabangan)

1. Percabangan If

2. Percabangan If/Else

Percabangan If/Else If/Else

4. Percabangan Switch/Case

Percabangan dengan operator ternary

8. Control FLow (Perulangan)

1. Perulangan For

2. Perulangan While

3. Perulangan Do/While

4. Perulangan Foreach

9. List

10. Fungsi

11. Class

Apa Selanjutnya?

Referensi 📖