Jobsheet 01
Static HTML
HTML Dasar & Tag Semantik
Pondasi dasar struktur dokumen web SIMPUS-Mini menggunakan elemen semantik HTML5 murni tanpa format CSS.
Kompilasi dan repositori pengerjaan praktikum modul perpustakaan (SIMPUS-Mini) mulai dari HTML dasar hingga integrasi basis data PostgreSQL ter-deploy di Vercel.
12 Selesai
3
2
Live on Vercel
Pilih salah satu modul di bawah untuk menguji fungsionalitas dan tampilan aplikasi.
Pondasi dasar struktur dokumen web SIMPUS-Mini menggunakan elemen semantik HTML5 murni tanpa format CSS.
Pengaplikasian CSS eksternal, aturan hierarki pewarnaan, tipografi, box model, dan styling elemen antarmuka.
Desain responsif multi-perangkat menggunakan Bootstrap 5, navbar kolaps, dan pengaturan tata letak form modern.
Perancangan arsitektur antarmuka, infografis alur sistem perpustakaan, dan spesifikasi wireframe terstruktur.
Interaktivitas form sisi klien menggunakan JavaScript, validasi input waktu nyata, dan feedback error interaktif.
Pemuatan data katalog dan anggota secara asinkron dari berkas JSON eksternal dengan indikator pemuatan (loading state).
Arsitektur server-side dengan modular header/footer PHP, validasi form sisi server, dan penyimpanan data via Session.
Integrasi basis data relasional penuh menggunakan PDO, penyimpanan persisten Supabase cloud, streaming biner gambar.php teroptimasi, dan multi-driver serverless.
Pengembangan operasi CRUD lengkap (Edit/Update gambar dan metadata, Hapus via HTTP POST dengan konfirmasi JS), pencarian server-side, dan pagination dinamis.
Sistem autentikasi pengguna lengkap (Register, Login dengan enkripsi password_hash, Logout), Guard Clause sesi middleware, dan otorisasi kontrol akses peran (Admin vs User).
Audit dan hardening keamanan menyeluruh: 100% Prepared Statements (anti-SQLi), sanitasi XSS dengan htmlspecialchars, token CSRF berbasis sesi dengan hash_equals, dan Session Fixation protection.
Puncak integrasi sistem end-to-end: Transaksi ACID peminjaman & pengembalian lisensi aset foto digital, relasi 3 tabel (peminjaman, galeri, users), aturan bisnis peminjaman > 14 hari, dan dashboard statistik real-time.