Skip to content

Aplikasi ToDoList sederhana yang menggunakan React, React Bootstrap, React Redux, dan di-deploy menggunakan Vercel. Pengguna dapat menambah, mengedit, menghapus, dan memfilter tugas-tugas yang perlu dilakukan.

Notifications You must be signed in to change notification settings

AdlinMH/TPA-todoListApp

 
 

Repository files navigation

Technical Project Assignment - Todo List App with React.js & Redux

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

Tampilan Aplikasi Todo List

Penggunaan

Aplikasi Todo List memiliki beberapa fitur utama:

1. Menambah Todo

Anda dapat menambahkan tugas baru ke dalam daftar Todo dengan mengikuti langkah-langkah berikut:

  1. Ketikkan deskripsi tugas yang ingin ditambahkan pada kolom input yang tersedia.
  2. Klik tombol "ADD" atau tekan tombol "Enter" pada keyboard.

Menambah Todo

2. Mengedit Todo

Anda dapat mengedit tugas yang sudah ada dalam daftar Todo dengan langkah-langkah berikut:

  1. Klik icon pensil pada tugas yang ingin Anda edit.
  2. Perbarui deskripsi tugas pada kolom input yang muncul.
  3. Klik tombol "Simpan" untuk menyimpan perubahan

Mengedit Todo

3. Menghapus Todo

Anda dapat menghapus tugas yang sudah tidak diperlukan lagi dari daftar Todo dengan langkah-langkah berikut:

  1. Klik pada tugas yang ingin Anda hapus.
  2. Klik icon tempat sampah untuk menghapus tugas tersebut.

Menghapus Todo

4. Memfilter Todo

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.

Memfilter Todo

Teknologi yang Digunakan

Aplikasi Todo List ini dibangun menggunakan beberapa teknologi utama:

Build

  • 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

Mock API

Aplikasi Todo List menggunakan Mock API untuk menyimpan data tugas sementara. Mock API ini menggunakan Redux Thunk untuk mengelola permintaan HTTP simulasi

About

Aplikasi ToDoList sederhana yang menggunakan React, React Bootstrap, React Redux, dan di-deploy menggunakan Vercel. Pengguna dapat menambah, mengedit, menghapus, dan memfilter tugas-tugas yang perlu dilakukan.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 85.9%
  • CSS 9.0%
  • HTML 5.1%