# Rencana Implementasi SekolahKu

## Ruang lingkup

SekolahKu adalah paket source code self-hosted untuk aplikasi manajemen sekolah. Versi awal mencakup website sekolah publik sederhana, login berbasis peran untuk Admin, Guru, Siswa, dan Orang Tua/Wali, dashboard operasional, absensi QR, SPP/pembayaran, LMS/e-learning, perpustakaan digital, data siswa, dan pengumuman. Backend utama ditulis dengan PHP 8+ dan PDO MySQL; schema serta seed demo disediakan dalam SQL sehingga dapat dipasang di localhost maupun hosting mandiri.

## Pendekatan teknis

- PHP 8.1+ tanpa framework berat agar mudah dipasang pada shared hosting.
- Front controller di `public/index.php`, helper terpisah untuk konfigurasi, database, autentikasi, CSRF, dan format output.
- PDO dengan prepared statements untuk akses MySQL/MariaDB.
- Session cookie aplikasi bernama `webdev_app_session` pada preview, dengan `SameSite=None; Secure` untuk iframe HTTPS dan fallback aman untuk localhost.
- SQL schema non-destruktif berisi tabel users, students, teachers, guardians, guardian_students, attendance, invoices, payments, courses, course_enrollments, assignments, library_books, announcements, dan audit_logs; seed demo dipisahkan agar tidak menghapus data existing.
- CSS/JavaScript vanilla yang responsif; preview memakai Node static server karena runtime sandbox tidak memiliki PHP, tetapi source PHP adalah artefak utama untuk deployment.
- Deployment production menggunakan Dockerfile PHP 8.3 + Apache, document root `public/`, PDO MySQL, dan endpoint readiness `/_app/health`; `DATABASE_URL` managed dibaca saat runtime.
- Modul berikutnya dapat menambahkan endpoint CRUD tanpa mengubah struktur dashboard dan database inti.

## Struktur proyek

- `public/` — document root hosting, front controller PHP, aset CSS/JS.
- `app/Config/` — pembacaan `.env` dan konfigurasi aplikasi.
- `app/Support/` — koneksi PDO, autentikasi, CSRF, helper response.
- `database/` — schema dan data awal SQL.
- `preview/` — mock preview HTML untuk inspeksi UI di sandbox.
- `docs/` — panduan instalasi, konfigurasi, dan rencana pengembangan.
- `scripts/` — utilitas ekspor paket source code.

## Arah desain

### Alternatif gaya

1. **Civic editorial** (0,08) — panel gelap, aksen teal, tipografi editorial untuk memberi rasa institusi modern.
2. **Campus glass** (0,06) — kartu transparan dan gradien neon untuk nuansa edutech eksperimental.
3. **Paper & ink** (0,07) — kanvas krem, garis tinta, dan aksen marun yang terasa seperti buku akademik.

### Gaya terpilih: Civic editorial

- **Design Movement:** editorial civic-tech yang tenang, tepercaya, dan berorientasi layanan.
- **Core Principles:** hierarki informasi jelas, tindakan utama selalu terlihat, data dibaca sebagai cerita, dan akses role terasa personal.
- **Color Philosophy:** navy gelap menjadi landasan institusional; teal mint menandai tindakan dan kesehatan operasional; amber hanya untuk perhatian/penagihan; kanvas putih hangat mengurangi kesan sistem administrasi yang kaku.
- **Layout Paradigm:** rail navigasi kiri yang kokoh dengan kanvas kerja asimetris; panel ringkasan di atas, lalu split antara insight dan agenda, bukan grid kartu seragam.
- **Signature Elements:** rail dengan penanda aksen aktif, chip status berbentuk pil, serta chart batang dengan baseline tipis seperti garis editorial.
- **Interaction Philosophy:** setiap klik memberikan feedback ringkas; aksi penting memakai bahasa kerja nyata seperti “Scan QR” dan “Buat pengumuman”, bukan CTA generik.
- **Animation:** transisi 180–240ms, bar chart naik perlahan saat masuk, hover panel mengangkat maksimum 2px, tanpa animasi dekoratif berulang.
- **Typography System:** Manrope untuk interface dan angka, DM Sans sebagai fallback untuk teks panjang; heading rapat dan tegas, label kecil memakai tracking positif.
- **Brand Essence:** satu ruang kerja yang membuat sekolah bergerak rapi—tepercaya, jernih, dan sigap.
- **Brand Voice:** headline langsung ke konteks (“Pusat kendali sekolah hari ini”); microcopy hangat dan operasional (“3 pembayaran perlu ditindaklanjuti sebelum Jumat”).
- **Wordmark & Logo:** monogram “S” yang dibentuk dari dua jalur checklist berpotongan, melambangkan alur sekolah yang saling terhubung.
- **Signature Brand Color:** School Teal `#18B6A4`.

## Alur build dan handoff

1. Jalankan `composer install` jika dependency Composer dipakai oleh pengembangan lanjutan.
2. Salin `.env.example` menjadi `.env`, isi koneksi MySQL/MariaDB.
3. Import `database/sekolahku.sql` melalui phpMyAdmin atau CLI MySQL; untuk data contoh, lanjutkan dengan `database/seed-demo.sql` pada database baru.
4. Arahkan document root hosting ke folder `public/` dan aktifkan rewrite `.htaccess`.
5. Untuk preview lokal tanpa PHP di sandbox, jalankan `node preview-server.mjs`; untuk deployment lokal sebenarnya jalankan `php -S localhost:8000 -t public`.
6. Buat ZIP distribusi dari seluruh source tanpa folder `.git` dan dependency vendor.