Skip to main content

Tugas 6: JavaScript dan AJAX

Pemrograman Berbasis Platform (CSGE602022) - diselenggarakan oleh Fakultas Ilmu Komputer Universitas Indonesia, Semester Ganjil 2022/2023

Deskripsi Tugas​

Pada tugas ini, kamu akan mengimplementasikan AJAX pada fungsionalitas todolist yang telah kamu buat saat Tugas 4 dan 5.

Checklist untuk tugas ini adalah sebagai berikut:

  • Mengubah tugas 4 yang telah dibuat sebelumnya menjadi menggunakan AJAX.

    • AJAX GET

      • Buatlah view baru yang mengembalikan seluruh data task dalam bentuk JSON.
      • Buatlah path /todolist/json yang mengarah ke view yang baru kamu buat.
      • Lakukan pengambilan task menggunakan AJAX GET.

    • AJAX POST

      • Buatlah sebuah tombol Add Task yang membuka sebuah modal dengan form untuk menambahkan task.

        Untuk mempelajari lebih lanjut mengenai modal Bootstrap (v5.2), silakan baca dokumentasi berikut: Modal · Bootstrap v5.2.

      • Buatlah view baru untuk menambahkan task baru ke dalam database.

      • Buatlah path /todolist/add yang mengarah ke view yang baru kamu buat.

      • Hubungkan form yang telah kamu buat di dalam modal kamu ke path /todolist/add

      • Tutup modal setelah penambahan task telah berhasil dilakukan.

      • Lakukan refresh pada halaman utama secara asinkronus untuk menampilkan list terbaru tanpa reload seluruh page.

  • Menjawab beberapa pertanyaan berikut pada README-TWO.md pada folder todolist.

    • Jelaskan perbedaan antara asynchronous programming dengan synchronous programming.
    • Dalam penerapan JavaScript dan AJAX, terdapat penerapan paradigma Event-Driven Programming. Jelaskan maksud dari paradigma tersebut dan sebutkan salah satu contoh penerapannya pada tugas ini.
    • Jelaskan penerapan asynchronous programming pada AJAX.
    • Jelaskan bagaimana cara kamu mengimplementasikan checklist di atas.

Tenggat Waktu Pengerjaan​

Tenggat waktu pengerjaan Tugas 6:

13 Oktober 2022 05.00.00 UTC (0 days 0 hours 0 minutes 0 seconds left)

Asisten dosen akan mengecek last commit dari repositori tugas lab, sehingga kamu tidak perlu mengumpulkan tautan repositori ke dalam slot submisi.

Bonus​

Kamu akan mendapatkan nilai bonus pada penilaian tugas ini apabila kamu membuat fitur berikut.

  • Menambahkan fungsionalitas hapus dengan menggunakan AJAX DELETE.
    • Buatlah kolom baru pada task dengan tombol Hapus.
    • Buatlah view baru yang menghapus task dengan ID tertentu.
    • Buatlah path /todolist/delete/{id} yang menerima ID dari path dan meneruskannya kepada view.
    • Buatlah fungsi JavaScript yang memanggil endpoint penghapusan task.
    • Lakukan refresh pada halaman utama secara asinkronus untuk menampilkan list terbaru tanpa reload seluruh page.