Studi kasus
DemoCompany profile kantor hukum + CMS
Situs profil untuk kantor hukum fiktif, lengkap dengan panel admin supaya isinya bisa diperbarui sendiri tanpa menyentuh kode.
- Peran
- Perencanaan, pengembangan, pengujian, dan deploy
- Nama demo
- Kantor Hukum Nalar Saksama
- Stack
- Laravel 13
- Filament 5
- Livewire 4
- Blade
- Tailwind CSS 4
- SQLite
- PHP 8.3
- Caddy
- Kode sumber
- Lihat di GitHub: Company profile kantor hukum + CMS (membuka situs lain)tenmaryut/company-profile-hukum
Bisnis pada demo ini fiktif. Data di dalamnya bukan data asli.
Masalah
Kantor hukum kecil butuh website yang tepercaya dan informatif, tetapi isinya sering berubah: bidang praktik, profil advokat, artikel, dan FAQ. Kalau setiap perubahan harus lewat programmer, situsnya cepat usang.
Ada juga batasan etika profesi: promosi jasa advokat tidak boleh berlebihan, misalnya mengaku "terbaik" atau menjanjikan hasil perkara. Form konsultasinya pun menampung data pribadi calon klien yang wajib dijaga.
Solusi
Company profile dibangun dengan Laravel 13 dan panel admin Filament. Pengelola situs bisa mengubah bidang praktik, tim, artikel bergambar, FAQ, dan teks halaman, serta membaca permintaan konsultasi dari satu dasbor.
Kontennya informatif tanpa klaim berlebihan, termasuk enam artikel hukum orisinal yang rujukannya dicek ke sumber resmi. Form konsultasi dilengkapi pemberitahuan privasi, perlindungan anti-spam, dan penghapusan otomatis setelah 7 hari, mengikuti prinsip Undang-Undang Nomor 27 Tahun 2022 tentang Pelindungan Data Pribadi.
Fitur utama
- Beranda, profil firma, bidang praktik, tim, FAQ, dan kontak dengan peta ilustrasi statis
- Enam artikel hukum dengan kategori, pencarian, daftar isi, dan catatan kaki, termasuk KUHP Nasional dan KUHAP baru
- Form konsultasi dengan honeypot, jebakan waktu, pembatasan laju, dan persetujuan privasi
- Panel admin Filament untuk bidang praktik, tim, artikel bergambar, FAQ, teks halaman, dan permintaan konsultasi
- Akun demo di halaman login admin, dengan data yang direset otomatis tiap malam
- SEO: meta, Open Graph, sitemap, data terstruktur LegalService, Article, dan FAQPage, serta halaman error khusus
- Animasi CSS yang tenang tanpa JavaScript: hero bertahap dengan garis tinta, kartu muncul saat di-scroll, transisi antarhalaman, FAQ yang membuka halus, dan bilah progres baca
Cuplikan animasi
Tantangan teknis
Data pribadi yang tidak menumpuk
Permintaan konsultasi dihapus otomatis setelah 7 hari oleh tugas terjadwal yang berjalan tiap jam. Notifikasi ke admin dikirim tanpa data pribadi, dan akun demo hanya bisa melihat data contoh serta kiriman dari browsernya sendiri.
CSP ketat tanpa mengorbankan panel admin
Halaman publik dibuat tanpa JavaScript (menu ponsel dan FAQ memakai elemen details) dengan font yang di-host sendiri, sehingga bisa memakai Content Security Policy yang ketat. Panel Filament, yang butuh script inline, mendapat kebijakan terpisah.
Demo publik yang aman dipulihkan
Seluruh data demo direset tiap tengah malam lewat systemd timer. Perintah reset memeriksa semua konten lebih dulu sehingga gagal dengan aman kalau ada yang rusak, dan akun admin asli disimpan terpisah.
Server yang dikunci rapat
Laravel berjalan di pool PHP-FPM tersendiri sebagai www-data dengan open_basedir, socket-nya hanya bisa diakses Caddy, serta file .env dan folder database berizin ketat.
Hasil uji
Lighthouse (mobile)
Beranda
Halaman yang diukur: /
Artikel: pokok perubahan KUHP Nasional
Halaman yang diukur: /artikel/kuhp-nasional-pokok-perubahan
Diukur pada 3 Oktober 2026 dengan Lighthouse 13.5.0 dalam mode mobile, langsung terhadap situs live. Skor bisa sedikit berubah antar-pengukuran.
Test otomatis
- Test Laravel: halaman publik, validasi dan penyimpanan form, akses admin, reset demo, kesiapan domain PHPUnit59
- Test end-to-end: kirim form, login admin demo, tampilan responsif, dan animasi (termasuk reduced motion) Playwright13
Total 72 test, semuanya lulus menurut laporan pengujian proyek pada 3 Oktober 2026.