Web Dev Playground adalah environment belajar interaktif yang mencover 17 Unit Kompetensi BNSP melalui implementasi nyata — bukan sekadar teori.
Dari assessment hingga sistem order penuh — semua tersedia dalam satu platform terintegrasi.
65 soal terstruktur lintas 5 domain (HTML/CSS/JS, PHP, Laravel, Database, Deployment). Timer per halaman, scoring otomatis, dan level hasil.
65 Soal · 5 Kategori · TimerPanduan lengkap syarat dan persiapan sebelum mengikuti uji kompetensi BNSP Web Developer — dari dokumen hingga skill yang wajib dikuasai.
Persiapan Sertifikasi BNSPEksplorasi 17 Unit Kompetensi resmi BNSP Web Developer secara interaktif — setiap unit dilengkapi deskripsi, KUK, dan implementasi nyata di app.
17 Unit · InteraktifPanduan step-by-step migrasi dari PHP murni ke Laravel — perbandingan kode side-by-side, penjelasan konsep MVC, routing, dan Eloquent ORM.
Migration GuidePanduan karir Frontend vs Backend Developer — roadmap skill, tools yang digunakan, dan perbedaan tanggung jawab di dunia industri.
Frontend · Backend · FullstackAnalisis mendalam arsitektur aplikasi e-commerce sederhana — ERD, flow data, relasi tabel, dan implementasi bisnis logic dengan Laravel.
Case Study · ArchitectureCRUD produk lengkap — tambah, edit, hapus, upload gambar. Implementasi file storage, validasi form, dan Repository Pattern.
CRUD · Upload · RepositoryBuat order dengan kalkulasi total otomatis, manajemen detail order (nested resource), format Rupiah, dan filter per user/keycode.
Auto-calc · Nested ResourceRingkasan statistik order & produk, grafik tren penjualan per bulan, chart pie revenue per produk, dan top-5 produk terlaris.
Charts · Analytics · StatsInfo tools/tech-stack yang digunakan dalam platform — Laravel version, PHP version, database driver info, dan detail environment.
Tech Stack InfoHalaman demo login interaktif — implementasi form validation, CSRF protection, session, dan error handling sesuai standar Laravel.
CSRF · Session · ValidationDemo registrasi user dengan validasi front-end & back-end, password hashing (bcrypt), dan email verification flow.
Bcrypt · ValidationSistem pesan in-app — notifikasi dari admin, unread badge, markRead otomatis, dan manajemen pesan per user terautentikasi.
Messaging · NotificationsKirim feedback, saran, atau bug report langsung ke admin. Thread-based reply system dengan notifikasi status baca.
Feedback Loop · Thread ReplyBaca dan monitor laravel.log secara real-time langsung dari browser — filter error/warning, syntax highlight, dan tail mode.
Real-time · Error TrackingPantau resource PHP server — memory usage, CPU load, PHP version, active extensions, dan info environment VPS secara live.
Performance · Resource MonitorRiwayat lengkap semua perubahan dan pembaruan platform — versi, tanggal release, fitur baru, bug fix, dan catatan teknis.
Changelog · Version HistorySetiap fitur dalam Web Dev Playground di-mapping langsung ke KUK (Kriteria Unjuk Kerja) resmi BNSP sehingga belajar = berlatih untuk ujian.
Akses PlatformDari pertama kali akses hingga siap ujian sertifikasi BNSP.
Akses halaman utama, masukkan keycode yang diberikan instruktur atau register akun untuk akses penuh.
Pahami syarat dan ekspektasi uji kompetensi BNSP — pastikan kamu memenuhi semua syarat sebelum lanjut.
65 soal, 13 halaman, timer per halaman. Lihat skor, level, dan breakdown per kategori kompetensi.
Latih semua KUK melalui fitur interaktif — CRUD, order, auth demo, log viewer, monitoring, dan lebih banyak lagi.
Dibangun dengan