Ini adalah aplikasi Todo List sederhana yang dibangun menggunakan React, React Bootstrap, React Redux, dan di-deploy menggunakan Vercel. Aplikasi ini memungkinkan pengguna untuk menambah, mengedit, menghapus, dan memfilter tugas-tugas yang perlu dilakukan.
Anda dapat mengakses aplikasi Todo List secara langsung melalui tautan berikut: Todo List App
Aplikasi Todo List memiliki beberapa fitur utama:
Anda dapat menambahkan tugas baru ke dalam daftar Todo dengan mengikuti langkah-langkah berikut:
- Ketikkan deskripsi tugas yang ingin ditambahkan pada kolom input yang tersedia.
- Klik tombol "ADD" atau tekan tombol "Enter" pada keyboard.
Anda dapat mengedit tugas yang sudah ada dalam daftar Todo dengan langkah-langkah berikut:
- Klik icon pensil pada tugas yang ingin Anda edit.
- Perbarui deskripsi tugas pada kolom input yang muncul.
- Klik tombol "Simpan" untuk menyimpan perubahan
Anda dapat menghapus tugas yang sudah tidak diperlukan lagi dari daftar Todo dengan langkah-langkah berikut:
- Klik pada tugas yang ingin Anda hapus.
- Klik icon tempat sampah untuk menghapus tugas tersebut.
Anda dapat menggunakan fitur filter untuk menampilkan tugas yang sesuai dengan kriteria tertentu. Terdapat beberapa pilihan filter yang tersedia:
- all: Menampilkan semua tugas.
- Completed: Menampilkan tugas yang sudah selesai.
- Active: Menampilkan tugas yang belum selesai.
Anda dapat memilih filter yang diinginkan dengan mengklik salah satu opsi yang tersedia.
Aplikasi Todo List ini dibangun menggunakan beberapa teknologi utama:
- React: Library JavaScript untuk membangun antarmuka pengguna.
- React Bootstrap: Framework UI yang mempermudah pengembangan aplikasi dengan komponen UI yang sudah siap pakai.
- React Redux: Library untuk mengelola state aplikasi dengan menggunakan arsitektur Flux.
- Vercel: Platform untuk deployment aplikasi web secara mudah dan cepat.
- React Thunk: middleware yang digunakan bersama dengan Redux di aplikasi React untuk mengelola pemanggilan API atau tindakan asinkron lainnya
Aplikasi Todo List menggunakan Mock API untuk menyimpan data tugas sementara. Mock API ini menggunakan Redux Thunk untuk mengelola permintaan HTTP simulasi