aryddntaabbss / SI-HMTI

0 stars 0 forks source link

Project Pages #9

Open aryddntaabbss opened 1 week ago

aryddntaabbss commented 1 week ago

To Do

  1. Setup Proyek

    • Deskripsi: Inisialisasi proyek dengan ReactJS dan Tailwind, serta konfigurasi awal untuk integrasi dengan backend Laravel.
    • Detail: Buat struktur folder, pasang dependensi yang dibutuhkan, dan siapkan konfigurasi dasar untuk Tailwind dan axios (untuk API calls).
  2. Rancangan UI/UX

    • Deskripsi: Buat wireframe dan desain mockup untuk halaman daftar proyek dan detail proyek.
    • Detail: Gunakan alat seperti Figma atau Adobe XD untuk merancang layout dan skema warna yang konsisten dengan brand.

In Progress

  1. Komponen Daftar Proyek

    • Deskripsi: Kembangkan komponen ReactJS untuk menampilkan daftar proyek menggunakan TailwindCSS.
    • Detail: Buat komponen kartu proyek yang mencakup gambar, judul, ringkasan, status, dan tanggal mulai/selesai. Gunakan grid layout untuk menampilkan beberapa kartu proyek secara responsif.
  2. Pagination/Infinite Scroll

    • Deskripsi: Implementasikan pagination atau infinite scroll untuk memuat daftar proyek secara dinamis.
    • Detail: Gunakan teknik pagination tradisional atau infinite scroll untuk memberikan pengalaman pengguna yang lancar.
  3. Komponen Detail Proyek

    • Deskripsi: Kembangkan komponen ReactJS untuk menampilkan detail proyek menggunakan TailwindCSS.
    • Detail: Buat layout untuk menampilkan judul, gambar utama, deskripsi lengkap, timeline, tim yang terlibat, dan status proyek. Pastikan tata letak mudah dibaca dan responsif.

Review

  1. Integrasi API dengan Backend Laravel

    • Deskripsi: Hubungkan frontend dengan backend Laravel untuk mengambil data proyek dinamis.
    • Detail: Gunakan axios untuk melakukan fetch data dari endpoint Laravel untuk daftar proyek dan detail proyek berdasarkan ID proyek.
  2. Pengujian dan Debugging

    • Deskripsi: Uji halaman daftar proyek dan detail proyek untuk memastikan semua data ditampilkan dengan benar dan tidak ada bug.
    • Detail: Lakukan pengujian manual untuk memastikan integrasi API, responsivitas halaman, dan pengalaman pengguna yang baik.

Done

  1. Deploy dan Dokumentasi
    • Deskripsi: Deploy halaman proyek ke lingkungan staging/produksi dan buat dokumentasi pengguna serta pengembang.
    • Detail: Gunakan layanan hosting yang sesuai, misalnya Vercel untuk frontend dan Heroku atau DigitalOcean untuk backend. Buat dokumentasi cara penggunaan dan panduan pengembang.