Membuat To-Do List Sederhana Menggunakan DartPad
📋 Membuat To-Do List Sederhana Menggunakan DartPad
🚀 Belajar Dart Jadi Lebih Seru dengan Membuat To-Do List!
Pernah merasa tugas sekolah menumpuk dan bingung harus mengerjakan yang mana terlebih dahulu?
Mulai dari tugas pemrograman, membuat laporan, belajar untuk ujian, sampai tugas kelompok. Kalau semuanya hanya disimpan di dalam pikiran, kemungkinan ada yang terlupakan.
Salah satu solusi sederhana adalah menggunakan To-Do List.
Menariknya, kita tidak harus langsung membuat aplikasi yang rumit. Kita bisa belajar membuat To-Do List sederhana menggunakan DartPad.
💡 Apa Itu DartPad?
DartPad adalah tempat untuk mencoba dan menjalankan kode Dart secara langsung melalui browser, sehingga kita dapat belajar pemrograman tanpa harus melakukan instalasi yang rumit.
DartPad sangat cocok untuk pemula karena kita bisa:
💻 Menulis kode Dart
▶️ Menjalankan program secara langsung
🐛 Mencoba dan memperbaiki kode
📚 Belajar konsep dasar Dart
🚀 Membuat project sederhana
Untuk latihan membuat To-Do List berbasis console, DartPad sudah cukup untuk memulai.
🎯 Apa yang Akan Kita Buat?
Pada project ini, kita akan membuat To-Do List sederhana yang dapat:
➕ Menambahkan tugas
📋 Menampilkan tugas
🗑️ Menghapus tugas
❌ Keluar dari program
Contoh hasilnya:
================================
📋 TO-DO LIST
================================
1. Tambah Tugas
2. Lihat Tugas
3. Hapus Tugas
4. Keluar
Pilih menu:
Sederhana, tetapi dari project ini kita bisa mempelajari banyak konsep dasar pemrograman.
🧠 Konsep Dart yang Digunakan
Dalam project ini kita akan menggunakan beberapa konsep penting:
| Konsep | Kegunaan |
|---|---|
List | Menyimpan daftar tugas |
String | Menyimpan teks tugas |
int | Menyimpan pilihan menu |
while | Menjalankan menu berulang |
if | Memeriksa kondisi |
for | Menampilkan daftar tugas |
stdin | Menerima input pengguna |
stdout | Menampilkan informasi |
Dengan kata lain, project kecil ini dapat menjadi latihan untuk memahami dasar-dasar bahasa Dart.
💻 Kode To-Do List di DartPad
Berikut contoh program To-Do List sederhana:
import 'dart:io';
void main() {
List<String> tasks = [];
while (true) {
print('\n================================');
print(' 📋 TO-DO LIST');
print('================================');
print('1. ➕ Tambah Tugas');
print('2. 📋 Lihat Tugas');
print('3. 🗑️ Hapus Tugas');
print('4. ❌ Keluar');
print('================================');
stdout.write('Pilih menu: ');
String? pilihan = stdin.readLineSync();
if (pilihan == '1') {
stdout.write('Masukkan tugas: ');
String? tugas = stdin.readLineSync();
if (tugas != null && tugas.isNotEmpty) {
tasks.add(tugas);
print('✅ Tugas berhasil ditambahkan!');
}
}
else if (pilihan == '2') {
print('\n📋 DAFTAR TUGAS');
if (tasks.isEmpty) {
print('Belum ada tugas.');
} else {
for (int i = 0; i < tasks.length; i++) {
print('${i + 1}. ${tasks[i]}');
}
}
}
else if (pilihan == '3') {
if (tasks.isEmpty) {
print('❌ Tidak ada tugas yang bisa dihapus.');
} else {
print('\n📋 DAFTAR TUGAS');
for (int i = 0; i < tasks.length; i++) {
print('${i + 1}. ${tasks[i]}');
}
stdout.write('Masukkan nomor tugas yang ingin dihapus: ');
int? nomor = int.tryParse(stdin.readLineSync() ?? '');
if (nomor != null &&
nomor >= 1 &&
nomor <= tasks.length) {
String tugas = tasks.removeAt(nomor - 1);
print('🗑️ "$tugas" berhasil dihapus.');
} else {
print('❌ Nomor tugas tidak valid.');
}
}
}
else if (pilihan == '4') {
print('\n👋 Program selesai. Sampai jumpa!');
break;
}
else {
print('⚠️ Pilihan tidak tersedia.');
}
}
}
🔍 Bagaimana Program Ini Bekerja?
Walaupun kode terlihat cukup panjang, sebenarnya alurnya sederhana.
1️⃣ Membuat List Tugas
List<String> tasks = [];
Bagian ini digunakan untuk membuat tempat penyimpanan daftar tugas.
Misalnya pengguna memasukkan:
Belajar Dart
Mengerjakan laporan
Membuat project
Maka data tersebut akan disimpan di dalam tasks.
2️⃣ Membuat Menu
Program menggunakan while agar menu terus muncul selama pengguna belum memilih keluar.
while (true) {
Dengan begitu, setelah menambahkan tugas, pengguna bisa kembali ke menu tanpa menjalankan ulang program.
3️⃣ Menambahkan Tugas
Ketika pengguna memilih menu nomor 1, program meminta nama tugas.
stdout.write('Masukkan tugas: ');
String? tugas = stdin.readLineSync();
Kemudian tugas dimasukkan ke dalam List:
tasks.add(tugas);
4️⃣ Melihat Tugas
Menu nomor 2 digunakan untuk menampilkan semua tugas.
Program menggunakan perulangan:
for (int i = 0; i < tasks.length; i++) {
print('${i + 1}. ${tasks[i]}');
}
Hasilnya:
📋 DAFTAR TUGAS
1. Belajar Dart
2. Mengerjakan laporan
3. Membuat project
🗑️ 5. Menghapus Tugas
Pengguna juga dapat menghapus tugas berdasarkan nomor.
Misalnya:
1. Belajar Dart
2. Mengerjakan laporan
3. Membuat project
Masukkan nomor tugas yang ingin dihapus: 2
Program akan menghapus tugas nomor 2.
Hasil:
🗑️ "Mengerjakan laporan" berhasil dihapus.
Untuk menghapus data digunakan:
tasks.removeAt(nomor - 1);
🔄 Alur Program
Alur kerja aplikasi dapat digambarkan seperti ini:
▶️ MULAI
│
▼
📋 Tampilkan Menu
│
▼
Pilih Menu
/ | \
/ | \
▼ ▼ ▼
Tambah Lihat Hapus
│ │ │
└───────┴───────┘
│
▼
Kembali ke Menu
│
▼
Pilih Keluar?
/ \
Tidak Ya
│ │
└───► ▼
❌ SELESAI
🧪 Contoh Hasil Program
Misalnya kita memasukkan beberapa tugas.
================================
📋 TO-DO LIST
================================
1. ➕ Tambah Tugas
2. 📋 Lihat Tugas
3. 🗑️ Hapus Tugas
4. ❌ Keluar
Pilih menu: 1
Masukkan tugas: Belajar Dart
✅ Tugas berhasil ditambahkan!
Kemudian kita melihat daftar tugas:
📋 DAFTAR TUGAS
1. Belajar Dart
2. Mengerjakan tugas sekolah
3. Membuat laporan
Program sederhana ini sudah bisa membantu mengelola daftar pekerjaan.
🌟 Kelebihan Membuat Project dengan DartPad
Belajar menggunakan DartPad memiliki beberapa keuntungan bagi pemula.
💻 Tidak Perlu Instalasi Rumit
Kita dapat langsung menulis kode dan mencoba program.
⚡ Cepat untuk Eksperimen
Ingin mencoba sebuah kode?
Tulis → Jalankan → Lihat hasilnya.
📚 Cocok untuk Belajar Dart
DartPad dapat digunakan untuk memahami dasar-dasar bahasa Dart sebelum masuk ke project yang lebih besar.
🎯 Cocok untuk Project Kecil
To-Do List, kalkulator, konversi suhu, program nilai siswa, dan berbagai project sederhana dapat digunakan sebagai latihan.
🚀 Dari DartPad Menuju Aplikasi Flutter
Project To-Do List yang dibuat di DartPad merupakan langkah awal.
Setelah memahami logika programnya, project tersebut dapat dikembangkan menjadi aplikasi mobile menggunakan Flutter.
Misalnya:
DartPad
↓
Belajar Dart
↓
Membuat Program Console
↓
Membuat To-Do List
↓
Belajar Flutter
↓
Membuat UI
↓
Database
↓
📱 Aplikasi To-Do List
Dengan begitu, kita tidak hanya belajar membuat tampilan, tetapi juga memahami logika di balik sebuah aplikasi.
🔥 Ide Fitur untuk Pengembangan
Project ini masih sangat sederhana dan bisa dikembangkan menjadi lebih keren.
Beberapa fitur yang dapat ditambahkan:
⭐ Prioritas tugas
📅 Deadline
🔔 Pengingat
✅ Status selesai
🔍 Pencarian tugas
🏷️ Kategori tugas
🌙 Dark Mode
💾 Penyimpanan database
👤 Login pengguna
📊 Statistik tugas
Contohnya:
📋 TO-DO LIST
🔴 Tugas Penting
☐ Membuat project Flutter
📅 Deadline: 28 Agustus
🟡 Tugas Sedang
☐ Belajar Dart
📅 Deadline: 29 Agustus
🟢 Tugas Ringan
☑ Membaca materi
🎓 Apa yang Kita Pelajari?
Dari satu project sederhana, kita sudah mempelajari:
Dart → List → Input → Percabangan → Perulangan → Function → Pengolahan Data
Hal tersebut merupakan dasar penting sebelum membuat aplikasi yang lebih kompleks.
🏁 Kesimpulan
Membuat To-Do List menggunakan DartPad adalah project sederhana yang cocok untuk pemula yang sedang belajar pemrograman.
Walaupun tampilannya masih berbasis console, kita sudah bisa belajar bagaimana cara menerima input, menyimpan data, menampilkan data, menghapus data, serta membuat menu interaktif.
Yang paling penting bukan seberapa rumit aplikasinya, tetapi seberapa banyak hal yang kita pelajari dari proses pembuatannya.
Dari program sederhana di DartPad, kita bisa melangkah lebih jauh menuju pembuatan aplikasi mobile menggunakan Flutter.
💡 Mulai dari kode sederhana, pahami logikanya, lalu kembangkan menjadi sesuatu yang lebih besar!
🚀 DartPad → Dart → Flutter → Mobile Developer
Satu project kecil hari ini bisa menjadi langkah pertama menuju project besar di masa depan.
Komentar
Posting Komentar