# LMS-BGN — Indeks Dokumentasi Proyek (Brownfield)

Dihasilkan: 2025-11-12
Lintasan: quick-flow
Level: 2 (Proyek Menengah)
Jenis Bidang: brownfield

## Ikhtisar
LMS-BGN adalah frontend Next.js 14 + TypeScript untuk Sistem Manajemen Pembelajaran (LMS) dengan alur inti: katalog dan viewer kursus, kuis dan ujian, pelacakan progres, sertifikat, analitik admin, serta modul reward payroll fase-1 (diaktifkan lewat feature flags).

## Teknologi
- Framework: `next@14` (App Router)
- Bahasa: TypeScript
- Styling: Tailwind CSS (`tailwind.config.js`)
- Pengujian: Jest + Testing Library
- State: React Context (`AuthContext`, `ExamContext`) dan hooks
- Visualisasi: `recharts`, `framer-motion`
- Utilitas: `clsx`, `tailwind-merge`, `react-hook-form`

## Jalankan & Build
- Dev: `npm run dev`
- Pemeriksaan tipe: `npm run type-check`
- Test: `npm test`
- Build: `npm run build` lalu `npm start`

## Ringkasan Struktur Sumber (terpilih)
- `src/app/` — Halaman App Router Next.js
  - Learner: `page.tsx`, `course/`, `courses/`, `reports/`
  - Ujian: `exams/`, `exam-session/`, `exam-summary/`
  - Admin: `admin/analytics/`, `admin/exams/`, `admin/certificates/`
  - Lainnya: `assignments/`, `schedule/`, `ai-assistant/`, `help/`, `settings/`
- `src/components/` — Komponen UI (admin, course, dashboard, exam, quiz, video)
- `src/contexts/` — `AuthContext.tsx`, `ExamContext.tsx`
- `src/hooks/` — `useExamPersistence.ts`, `useProgressTracking.ts`
- `src/features/payroll-reward-system/` — modul reward fase-1 (dashboard, services, repositories, types)
- `src/core/events/SystemEvents.ts` — event bus bertipe untuk event sistem
- `src/config/featureFlags.ts` — toggle fitur
- `tailwind.config.js` — token desain BGN (warna, bayangan, tipografi)

## Alur & Komponen Kunci
- Viewer Kursus & Modul: `src/app/course/[courseId]/page.tsx` + `src/components/course/*`
- Demo Kuis: `src/app/interactive-quiz-demo/page.tsx`
- Sesi Ujian + Ringkasan: `src/app/exam-session/*`, `src/app/exam-summary/*`
- Sertifikat: `src/components/admin/CertificatePDF.tsx` dan halaman admin sertifikat
- Analitik Admin: `src/app/admin/analytics/*`
- Reward (Fase-1): `src/features/payroll-reward-system/*`

## Dokumentasi yang Sudah Ada
- PRD: `docs/mbg-lms-prd.md`
- Backlog: `docs/mbg-lms-backlog.md`
- Rencana Epik: `docs/mbg-lms-epic-plan.md`
- Rencana Sprint: `docs/mbg-lms-sprint-plan-nov-dec-2025.md`
- Sinkronisasi Codebase: `docs/mbg-lms-codebase-sync.md`
- Catatan Brainstorming: `docs/brainstorming-session-results-2025-11-11.md`
- Rencana UAT: `docs/mbg-lms-uat-plan.md`

## Snapshot Arsitektur
Aplikasi frontend satu bagian (Next.js) dengan modul fitur:
- Halaman learner/admin di `src/app`
- State berbasis Context untuk auth dan persistensi ujian
- Feature flags mengisolasi modul opsional (reward, AI)
- Event bus menyediakan event bertipe antar fitur

## Langkah Memulai
1. Install dependensi: `npm install`
2. Jalankan server dev: `npm run dev`
3. Buka `http://localhost:3000`
4. Jalankan pemeriksaan tipe dan test sebelum perubahan: `npm run type-check && npm test`

## Catatan
- Dokumentasi brownfield sudah cukup untuk lanjut ke langkah perencanaan `tech-spec`.
- Gunakan `docs/mbg-lms-codebase-sync.md` untuk rujukan path yang lebih dalam.