I. Standar Git dan CI/CD (Continous Integration/Continous Deployment)

Pola pesan commit yang konsisten sangat penting untuk otomatisasi changelog, versioning, dan pemicu alur kerja CI/CD (terutama Gitlab CI/CD).

1.1. Aturan Prefix Commit Utama (CI/CD Trigger)

Setiap commit wajib dimulai dengan prefix yang sesuai.

Prefix	Deskripsi Pemicu	Kapan Digunakan
`[RELEASE]`	Pemicu standar untuk build dan deployment ke lingkungan staging/development.	Perubahan kode umum (fitur, perbaikan bug, refactor).
`[CLEAN]`	Pemicu tambahan untuk membersihkan cache atau artefact sebelum build.	Disarankan jika ada masalah caching saat build sebelumnya.
`[LIBRARY]`	Pemicu wajib ketika ada perubahan pada level dependensi atau library inti BCAF.	Perubahan pada `package.json`, penambahan/update modul Angular/NPM.
`[HOTFIX]`	Digunakan untuk perbaikan bug kritis yang akan di-deploy segera ke produksi (hanya untuk branch `main/master`).	Hanya dengan persetujuan Tech Lead.

1.2. Contoh Format Commit Message

Gunakan format ini untuk memastikan CI/CD berjalan dengan optimal dan changelog terisi dengan baik.

Skenario	Format Commit	Catatan
Perubahan Library & Dependensi Baru	`[RELEASE][CLEAN][LIBRARY] Add new library 'moment-js' for date handling`	Pemicu Rebuild Stage Keseluruhan.
Perubahan pada Library Inti BCAF	`[RELEASE][LIBRARY] Fix styling in @bcaf/bcaf-theme button component`	Perubahan di `@bcaf/bcaf-core`, `@bcaf/bcaf-theme`, dsb.
Perubahan Fitur Biasa	`[RELEASE] Implement validation for user registration form`	Perubahan di komponen aplikasi selain dari folder library inti.

PERINGATAN: Kegagalan menggunakan prefix yang benar dapat menyebabkan build gagal atau changelog tidak ter-generate.

II. Struktur Framework dan Komponen Inti

Litecore BCAF memiliki struktur modular. Folder inti yang wajib diketahui oleh pengembang:

2.1. Folder Library Inti BCAF (Framework Litecore)

Folder-folder ini membentuk kerangka kerja (framework) dasar dan harus dipertimbangkan sebagai Library.

@bcaf/bcaf-auth : Modul autentikasi dan otorisasi.
@bcaf/bcaf-core : Modul utilitas inti, services, dan helper global.
@bcaf/bcaf-shared : Komponen, pipe, atau directive yang digunakan oleh banyak modul (umum).
@bcaf/bcaf-theme : Styling, SASS/CSS, dan variabel tema (termasuk Dark Mode).
@bcaf/ebcaf-extra : Modul ekstensi atau integrasi pihak ketiga spesifik.

CATATAN: Semua folder di luar daftar di atas dianggap sebagai modul aplikasi (fitur) dan bukan bagian dari framework inti.

III. Manajemen State (NgRx)

Proyek ini mengimplementasikan NgRx (Redux Pattern) untuk manajemen state yang prediktif dan debuggable.

3.1. Alur Kerja NgRx (Redux Flow)

Pahami alur kerja ini; setiap perubahan state harus melalui siklus ini.

flowchart TD
A[Component] -->|1. dispatch event| B(ACTION)
B -->|2a. process data / side effect| E(EFFECTS)
B -->|2b. update immediate state| C(REDUCER)
E -->|3a. call API Service| F[API Service]
F -->|3b. API Response Success/Fail| E
E -->|4. dispatch new Action Success/Fail| B
C -->|5. update immutable| D[STORE State]
D -->|6. notify change via SELECTOR| G[Component]
G -->|7. render UI| A

3.2. Boilerplate NgRx dan File Wajib

Salah satu tantangan NgRx adalah boilerplate-nya. Untuk satu fitur, minimal dibutuhkan 4 file.

[feature-name].actions.ts : Mendefinisikan semua event yang mungkin terjadi.
[feature-name].reducers.ts : Mendefinisikan bagaimana state berubah berdasarkan action.
[feature-name].effects.ts : Menangani side effects (panggilan API, I/O, dll.).
[feature-name].selectors.ts : Cara yang aman dan memoized untuk mengambil data dari store.

Konsep onReloadNextState: Fungsi onReloadNextState dalam Reducer adalah helper untuk menandai bahwa data pada state perlu di-refresh (refetching) setelah side-effect (misalnya: POST, PUT, DELETE) berhasil dilakukan.

3.3. Alat Debugging State

Wajib instal Redux DevTools di browser Anda untuk memudahkan debugging alur state.

Link Instalasi Chrome Redux DevTools

IV. Standar Kualitas dan Performa Kode

Kode yang bersih, efisien, dan memiliki performa baik adalah prioritas utama.

4.1. Interceptor dan Penanganan Response API

Interceptor Angular sangat berguna untuk memproses respons dari API secara global.

Tugas Interceptor	Contoh Implementasi
Loading State	Mengaktifkan global loading indicator saat request dimulai dan menonaktifkannya saat selesai.
Penanganan Error	Menampilkan notifikasi error (Toast/Snackbar) untuk kode status 4xx atau 5xx.
Refresh Token	Melakukan silent refresh token saat mendeteksi status 401 (Unauthorized).

4.2. Pengujian Performa (Lighthouse)

Setiap fitur atau komponen baru harus diuji performanya.

Ketentuan Minimum Lighthouse: Untuk pengujian, selalu gunakan simulasi Desktop dengan throttling standar. Target Skor:

Performance: Minimal 90%
Best Practices: Minimal 95%
SEO: Minimal 95%

4.3. Kompatibilitas Perangkat dan Bahasa

Responsive Design: Pastikan semua komponen diuji pada mode Desktop dan Mobile (menggunakan DevTools Device Compatibility Mode).
Dark Mode: Uji tampilan Dark Mode untuk memastikan tidak ada elemen yang hilang atau tidak terbaca.
Internationalization (i18n): Pastikan setiap file terjemahan (.json) didaftarkan dengan benar di angular.json agar proses translation berjalan:
- Path: bcaf-app/src/assets/i18n (untuk aplikasi)
- Path: bcaf-collateral/src/i18n/collateral (untuk library collateral)

V. Workflow Finalisasi Task

Setelah semua pengembangan selesai dan pengujian lokal (unit test, integrasi, end-to-end ringan) berhasil.

Panduan Pengembangan Proyek BCAF (Litecore Microservice)