PanganAman Logo
⭐ Case Study

PanganAman

Sistem Pengendalian Keamanan Pangan Segar Asal Tumbuhan

Laravel 12 PHP 8.2 MySQL Blade Nginx
6
Role Pengguna
19+
Modul Sistem

Ringkasan Proyek

PanganAman adalah platform digital terpadu untuk mendukung pengendalian keamanan Pangan Segar Asal Tumbuhan (PSAT) di Indonesia. Sistem ini menghubungkan pelaku usaha, petugas pengawas OKKP daerah, dan masyarakat umum dalam satu ekosistem pangan segar yang aman, legal, dan terlacak.

Dikembangkan sebagai proof-of-concept untuk riset doktoral (S3) seorang analis di Badan Pangan Nasional. Dengan syarat dari profesor pembimbing: bukan hanya konsep teori, tetapi sistem yang benar-benar berjalan, teruji, dan siap digunakan.

Peran Saya

Sebagai solo full-stack developer, saya menangani seluruh siklus pengembangan: analisis kebutuhan bersama peneliti, perancangan arsitektur sistem (RBAC multi-role), desain database, implementasi backend dan frontend (Blade SSR), deployment ke VPS Ubuntu dengan Nginx, hingga pengujian menyeluruh dengan data demo nyata.

Screenshot Sistem

Landing Page — Publik

Halaman depan publik yang menjelaskan sistem, fitur utama, alur registrasi, dan layanan pengecekan keamanan produk via QR. Menjadi pintu masuk bagi masyarakat, pelaku usaha, dan petugas.

PanganAman Landing Page

Halaman Login — Multi-Role

Sistem autentikasi terpadu yang mengarahkan pengguna ke dashboard sesuai perannya: Administrator, Petugas OKKP Daerah, atau Pelaku Usaha.

PanganAman Login Page

Dashboard Petugas OKKP Daerah

Dashboard utama untuk petugas pengawas. Menampilkan ringkasan aktivitas, statistik registrasi, tabel QR Badan Pangan dengan status tracking (Pending / Reviewed), register SPPB, Izin Edar PL, PD, dan PDUK.

Dashboard Petugas OKKP

QR Badan Pangan — Workflow Lengkap

Salah satu fitur paling krusial: QR Code resmi Badan Pangan yang dipasang di kemasan produk. Berikut studi kasus nyata QR yang sudah APPROVED dan Published.

Detail QR — Tampilan Admin

Halaman detail QR Badan Pangan untuk komoditas Alpukat Hass milik PT Buah Internasional. Status: APPROVED, Published: YES. Menampilkan QR Code, info komoditas (nama latin, jenis PSAT), data pelaku usaha (NIB, alamat), dan referensi SPPB + Izin Edar yang sudah disetujui.

QR Badan Pangan Approved Detail

QR Scan — Tampilan Publik

Inilah yang dilihat konsumen saat memindai QR Code di kemasan produk. Informasi komoditas, pelaku usaha, SPPB, Izin Edar, dan foto produk — semuanya transparan untuk verifikasi keamanan pangan.

QR Scan Public View

Alur Kerja QR Badan Pangan

1️⃣ Pelaku Usaha Ajukan QR
2️⃣ Petugas Review
3️⃣ QR Approved & Published
4️⃣ Konsumen Scan & Verifikasi

Arsitektur Sistem

Sistem dibangun dengan arsitektur monolitik terstruktur menggunakan Laravel 12, pattern RBAC (Role-Based Access Control) untuk 3 role pengguna, dan MySQL sebagai database. SSR (Server-Side Rendering) via Blade template engine, di-deploy pada VPS Ubuntu 22.04 dengan Nginx sebagai reverse proxy.

🔐 Role-Based Access Control (6 Role)

  • Administrator — Manajemen sistem penuh, user management
  • Petugas Pusat — Pengawasan nasional, kebijakan & regulasi
  • Petugas OKKP Daerah — Review QR & izin edar, tindakan pengawasan, inspeksi lapangan
  • Pelaku Usaha — Registrasi produk, pengajuan QR & izin edar, tracking status
  • Pengunjung / Masyarakat — Scan QR verifikasi, laporan pengaduan, komplain
  • Kepala Dinas — Dashboard ringkasan, approval eskalasi, monitoring wilayah

📊 Modul Utama

  • ✅ QR Badan Pangan — workflow pengajuan → review → approve
  • ✅ Register SPPB — Surat Persetujuan Pemasukan
  • ✅ Izin Edar PL / PD / PDUK — multi-izin
  • ✅ Laporan Pengaduan — masyarakat → petugas
  • ✅ Peringatan Dini — early warning system
  • ✅ Data Pengawasan — monitoring & enforcement

Seluruh Modul Sistem

📋 Dashboard
👤 Data Saya
⚠️ Peringatan Dini
🏢 Data Pelaku Usaha
📬 Notifikasi Surveilan
🔍 Data Pengawasan
📈 Rekap Pengawasan
⚡ Tindakan Pengawasan
📝 Laporan Pengaduan
📱 QR Badan Pangan
📄 Register SPPB
📋 Izin Edar PL
📋 Izin Edar PD
📋 Izin Edar PDUK
⚙️ Settings

Fitur Landing Page (Publik)

🔍 Cek Keamanan Produk — scan QR
📖 Alur Registrasi QR Badan Pangan
📊 Pelaporan & Pengawasan Terpadu
🎓 Pembinaan & Konsultasi
🧪 Batas Cemaran & Residu
🎯 Titik Kritis Penanganan PSAT

Technology Stack

Backend

Laravel 12, PHP 8.2, MySQL 8.0, Blade SSR

Frontend

Blade Templates, Vanilla JavaScript, Custom CSS3, Font Awesome 6

Infrastruktur

Ubuntu 22.04 VPS, Nginx reverse proxy, Let's Encrypt SSL

Keamanan

RBAC multi-role, CSRF protection, SQL injection prevention, XSS filtering

Data Demo & Realitas Sistem

Sistem diuji dengan data demo yang mencerminkan penggunaan nyata. Dua pelaku usaha terdaftar dengan produk dan izin edar aktif:

🏢 Pelaku Usaha Terdaftar

PT Buah Internasional

Komoditas: Melon, Kentang
Registrasi SPPB & Izin Edar aktif

UD Mitra Tani

Komoditas: Wortel, Bawang Merah, Kubis, Labu, Kacang Panjang, Tomat
8 produk terdaftar QR Badan Pangan

📊 Status Registrasi (saat eksplorasi)

8 QR Pending
3 Register SPPB
7 Izin Edar PL
3+ Izin Edar PD

* Data demo untuk keperluan pengujian dan riset. Tidak mencerminkan data Badan Pangan Nasional yang sebenarnya.

Galeri Screenshot Tambahan

Lebih banyak tangkapan layar dari berbagai role dalam sistem.

Dashboard Pelaku Usaha — PT Buah Internasional

Dashboard untuk pelaku usaha. Sidebar: Profil Bisnis, QR Badan Pangan, Register SPPB, Izin Edar PL, Izin Edar PD. Statistik: QR Pending, SPPB Diajukan/Diperiksa, Izin Edar Diajukan/Diperiksa.

Dashboard Pengusaha

Halaman Login — Semua Role

Autentikasi terpadu dengan redirect sesuai role (6 role).

Login Page

Dashboard Petugas OKKP Daerah

Statistik, tabel QR, register SPPB & izin edar.

Dashboard Petugas

QR Detail — Produk Approved

Detail QR Badan Pangan untuk produk yang sudah disetujui.

QR Detail Approved

Form Pengajuan QR

Formulir pengajuan QR Badan Pangan oleh pelaku usaha.

Form QR

Tampilan Dashboard

Ringkasan sistem dari sisi petugas pengawas.

Dashboard View

Tertarik dengan pendekatan ini?

Saya terbuka untuk diskusi tentang bagaimana pendekatan serupa dapat diterapkan pada sistem lain — terutama yang melibatkan multi-stakeholder workflow dan kebutuhan regulasi.

🔗 Kunjungi PanganAman 💬 Diskusi Proyek