Pada hari keempat minggu ke-10, pengembangan difokuskan pada implementasi fitur real-time build logs agar user dapat memantau proses build secara langsung tanpa perlu melakukan refresh halaman. Fitur ini meningkatkan pengalaman pengguna dalam memonitor pipeline CI/CD.
Beberapa hal yang dilakukan pada tahap ini antara lain:
Mempelajari konsep Server-Sent Events (SSE) sebagai metode streaming data satu arah dari server ke client yang lebih sederhana dibandingkan WebSocket.
Mengimplementasikan endpoint backend
GET /api/builds/:id/logs untuk mengirimkan log build secara real-time menggunakan SSE.Menggunakan EventSource API di frontend untuk menerima stream data dan menampilkannya langsung ke UI.
Mendesain tampilan log seperti terminal dengan pemberian warna berbeda untuk setiap jenis log seperti ERROR (merah), WARN (kuning), dan INFO (biru).
Menambahkan fitur auto-scroll agar tampilan otomatis mengikuti log terbaru, serta tombol “scroll to bottom” saat user melakukan scroll ke atas.
Dengan implementasi ini, log proses build sudah dapat ditampilkan secara real-time di UI tanpa perlu refresh, sehingga memudahkan user dalam memantau jalannya pipeline secara langsung.
0 Komentar