Aplikasi web yang ringan dan intuitif untuk mengelola tugas harian Anda. Proyek ini mendemonstrasikan konsep-konsep dasar pengembangan web menggunakan HTML, CSS, dan JavaScript, termasuk penanganan formulir, manipulasi DOM, persistensi data (Local Storage), dan pemfilteran dasar.
- Tambah Tugas Baru: Tambahkan item tugas baru dengan mudah menggunakan deskripsi tugas dan tanggal jatuh tempo.
- Tampilkan Daftar Tugas: Lihat semua tugas Anda dalam daftar yang jelas dan terorganisir.
- Tandai Selesai: Ubah status penyelesaian tugas. Tugas yang sudah selesai dibedakan secara visual.
- Hapus Tugas: Hapus tugas dari daftar Anda saat tidak lagi diperlukan.
- Filter Tugas: Filter tugas Anda untuk menampilkan:
- Semua tugas
- Tugas Aktif (belum selesai)
- Tugas Selesai
- Validasi Input: Memastikan bahwa deskripsi tugas dan tanggal jatuh tempo tidak dibiarkan kosong.
- Persistensi Data: Tugas disimpan ke Local Storage browser Anda, sehingga tetap ada meskipun Anda menutup dan membuka kembali browser.
- Desain Responsif: Aplikasi menyesuaikan tata letaknya untuk tampilan optimal di berbagai ukuran layar (desktop, tablet, seluler).
- HTML
- CSS
- JavaScript
Proyek ini mengikuti struktur direktori yang rapi dan terorganisir:
simple-todo-list/
├── css/
│ └── style.css
├── js/
│ └── script.js
└── index.html
Ikuti langkah-langkah sederhana ini untuk membuat aplikasi berjalan di mesin lokal Anda:
-
Kloning repositori (Opsional, jika Anda memilikinya di Git):
git clone https://github.com/msalmanrafadhlih/ToDo-List-App.git
-
Navigasi ke direktori proyek:
cd ToDo-List-App -
Buka
index.html: Cukup buka fileindex.htmldi browser web. kamu dapat melakukannya dengan mengklik perintahctrl - shit - p
dan carilah "live server: Open with Live Server"
Aplikasi seharusnya sekarang sudah aktif di browser Anda!
Proyek ini bersifat open source dan tersedia di bawah Lisensi MIT.