Portal Panduan Praktikum UKK RPL

Sistem Informasi Perpustakaan Digital (SIPAS) - SMK Ardli Sela

Selamat datang di portal panduan praktikum interaktif pengembangan aplikasi perpustakaan sekolah berbasis CodeIgniter 3 + MySQL + Bootstrap 5. Modul ini telah disusun secara modular (terpisah menjadi 9 bab materi ringan) dengan Full Source Code dan 100% Offline Ready.

Institusi: SMK Ardli Sela Kompetensi Keahlian: Rekayasa Perangkat Lunak (RPL) Text Editor: Sublime Text 3 Sifat Ujian: Mandiri / Perorangan

📋

Bedah Lengkap Soal UKK & Alur Kerja Sistem Perpustakaan

Panduan terstruktur: Dari membaca soal, merancang database, koding, pengujian, hingga berkas yang harus dikumpulkan saat ujian.

💡 Prinsip Utama Siswa RPL: Jangan membaca soal ujian mentah-mentah lalu panik. Pecah soal menjadi 4 pertanyaan sederhana: "Kalian sebenarnya diminta membuat apa, fiturnya apa saja, alurnya bagaimana, dan apa saja bukti berkas yang wajib dikumpulkan ke penguji?"

1 Inti Tugas Ujian Praktik Kejuruan

Sederhananya: Kalian diminta membuat aplikasi Perpustakaan Sekolah berbasis web yang berjalan di localhost (tanpa koneksi internet).

Jadi bukan sekadar membuat brosur web statis yang hanya memajang daftar buku! Aplikasinya harus benar-benar memiliki database MySQL yang terhubung dan memiliki proses transaksi peminjaman & pengembalian buku nyata. Waktu ujian adalah 9 jam dan dikerjakan secara mandiri (perorangan).

2 Dua Jenis Hak Akses Pengguna (Role Authorization)

🛡️ ADMIN (Petugas Perpustakaan)

Memiliki hak akses penuh (CRUD Lengkap):

CRUD Buku: Tambah buku (upload cover/gambar), lihat katalog, edit data, dan hapus buku.
CRUD Anggota: Tambah anggota siswa (upload foto profil), pantau akun, edit status, dan hapus.
CRUD Transaksi: Memantau semua peminjaman siswa dan memvalidasi pengembalian buku fisik di meja layanan.

👨‍🎓 USER / SISWA (Peminjam)

Hak akses terfokus pada layanan peminjaman:

Daftar & Login: Registrasi akun mandiri dengan NIS dan username unik.
Katalog & Pencarian Buku: Mencari judul, filter kategori, melihat lokasi rak & sisa stok eksemplar.
Peminjaman Mandiri: Meminjam buku langsung dengan 1 klik (otomatis memotong stok buku -1).
Menu "Buku Saya": Memantau jatuh tempo dan mengembalikan buku secara mandiri (otomatis menambah stok +1).
Ganti Foto Profil: Mengunggah foto profil sendiri di halaman akun siswa.
Dilarang Keras: Siswa tidak boleh bisa mengedit/menghapus buku milik perpustakaan.

3 Tampilan Flowchart / Flowmap Sistem Usulan (Soal UKK Halaman 3)

Berikut adalah diagram alur kerja resmi (Flowchart Soal UKK Halaman 3) yang menunjukkan pembagian proses sistem antara Admin dan Siswa:

Bagan Alur: Flowchart Asli Petunjuk Soal Praktik Kejuruan (Halaman 3).

4 Matriks Halaman & Hak Akses (Sesuai Tabel Soal UKK Halaman 4)

📱 Tabel di bawah otomatis bertransformasi menjadi kartu rapi di layar ponsel (mobile-friendly tanpa perlu geser horizontal):

Fitur / Halaman	User / Siswa	Admin Petugas	Keterangan pada Aplikasi SIPAS
Daftar Akun	✓ (Bisa)	✓ (Bisa)	Siswa daftar mandiri; Admin dapat menambahkan anggota baru langsung dari panel admin.
Login Multi-Role	✓ (Bisa)	✓ (Bisa)	1 halaman login terintegrasi, otomatis membedakan dashboard Admin vs Siswa via session.
Dashboard Interaktif	✓ (Bisa)	✓ (Bisa)	Admin memantau total buku, stok, & transaksi; Siswa memantau kuota pinjaman aktif.
Pencarian Buku (Kondisi Tertentu)	✓ (Bisa)	✓ (Bisa)	Pencarian multi-kolom kata kunci (judul, penulis, kode) & filter kategori buku.
Peminjaman & Pengembalian Buku	✓ (Bisa)	✓ (Bisa)	Siswa bisa meminjam & mengembalikan mandiri di portal; Admin memproses di meja sirkulasi.
CRUD Transaksi	✓ (Bisa)	✓ (Bisa)	Tercatat di tabel `transaksi` lengkap dengan tanggal pinjam, batas tempo, & status.
CRUD Kelola Data Buku	✕ (Dilarang)	✓ (Bisa)	Hanya Admin: Tambah buku, upload cover, edit data buku, serta menghapus buku.
CRUD Kelola Data Anggota	✕ (Dilarang)	✓ (Bisa)	Hanya Admin: Tambah akun siswa, upload foto profil, aktivasi/nonaktifkan status akun.

5 Struktur Database: Menyimpan Apa Saja?

Aplikasi SIPAS dirancang dengan skema relasional 3 tabel yang solid, efisien, dan memiliki integritas data:

1. Tabel users id, username, password, nama, nis, kelas, foto, role, status

Menampung akun admin dan seluruh data siswa beserta foto profil.

2. Tabel buku id, kode_buku, judul, penulis, penerbit, tahun_terbit, kategori, stok, rak, deskripsi, gambar

Katalog lengkap judul, lokasi rak fisik, kuantitas stok, dan berkas/URL cover buku.

3. Tabel transaksi id, kode_transaksi, user_id, buku_id, tanggal_pinjam, batas_kembali, tanggal_kembali, status

Jembatan relasi FK antara siswa dan buku yang dipinjam.

6 Logika Peminjaman & Manipulasi Stok Fisik (Business Logic)

Inilah yang membedakan aplikasi nyata dengan tampilan web palsu:

Siswa Meminjam: Andi login → melihat buku Dasar Pemrograman PHP (Stok: 5) → klik tombol Pinjam Buku.
Sistem Memproses Transaksi: Mengurangi stok buku secara otomatis (5 → 4), mencatat transaksi dengan kode TRX..., status dipinjam, dan tanggal tempo 7 hari ke depan.
Validasi Pencegahan: Jika stok habis (0), tombol pinjam dinonaktifkan otomatis. Jika Andi sudah meminjam buku tersebut dan belum kembali, sistem menolak peminjaman ganda.
Siswa Mengembalikan: Saat buku dikembalikan di portal siswa atau meja admin, status berubah menjadi dikembalikan dan stok buku bertambah kembali (4 → 5).

7 Fitur Wajib: "Pencarian untuk Kondisi Tertentu"

Di lembar soal halaman 4 tertulis jelas fitur "Pencarian untuk Kondisi Tertentu (User: V, Admin: V)". Di aplikasi SIPAS, fitur ini telah diterapkan secara maksimal:

Pencarian Buku: Bisa mencari berdasarkan kata kunci judul, nama penulis, kode buku, atau filter dropdown kategori buku.
Pencarian Anggota: Petugas admin bisa mencari siswa berdasarkan nama, NIS, atau memfilter status aktif/nonaktif.
Pencarian Transaksi: Mencari nomor resi transaksi, nama siswa peminjam, atau judul buku dengan filter status dipinjam/kembali.

8 Langkah Kerja Debugging & Pengujian Sistem

Di lembar penilaian, penguji akan mengamati apakah siswa paham cara menguji aplikasi mereka sendiri. Siapkan 5 skenario uji berikut di hadapan penguji:

Test 1: Proteksi Login
Coba masukkan password yang salah. Hasil: Aplikasi menolak login dan memunculkan pesan peringatan merah.

Test 2: Keamanan Akses Role
Siswa login lalu mencoba buka URL admin/buku. Hasil: Sistem otomatis menolak dan mengarahkan kembali ke dashboard siswa.

Test 3: Validasi Form & Input
Kosongkan field wajib atau masukkan kode buku yang sudah ada. Hasil: Form menampilkan error validasi tanpa merusak database.

Test 4: Konsistensi Stok Buku
Lakukan peminjaman dan pengembalian. Cek apakah angka stok di database dan tabel berubah akurat.

9 Bukti Berkas yang Wajib Dikumpulkan (Penting!)

Jangan habiskan 9 jam hanya untuk coding! Sisakan minimal 1,5 jam terakhir untuk menyiapkan 4 berkas pengumpulan resmi sesuai lembar soal halaman 4:

Folder Proyek Aplikasi: Berkas source code lengkap CodeIgniter 3 (folder htdocs/perpustakaan atau folder proyek mandiri Anda).
Database dengan Ekstensi .sql: Hasil export database dari phpMyAdmin (contoh: db_perpustakaan.sql).
Dokumentasi Tertulis (MS Word / PDF):
- a. ERD (Entity Relationship Diagram) relasi 3 tabel.
- b. Deskripsi program (latar belakang & fungsi aplikasi).
- c. Dokumentasi fungsi/prosedur utama (login, CRUD, transaksi).
- d. Bukti hasil uji Debugging (tabel pengujian & tangkapan layar).
Laporan Evaluasi Singkat: Ulasan kesimpulan pengerjaan dan kelebihan/kendala selama pembuatan aplikasi.

10 Visualisasi ERD (Entity Relationship Diagram) & Relasi Tabel

ERD memetakan relasi data secara visual antara users, transaksi, dan buku:

👥 USERS Tabel Akun & Anggota

PK id INT (11)

UQ username VARCHAR(50)

password VARCHAR(255)

nama VARCHAR(100)

UQ nis VARCHAR(30)

kelas VARCHAR(50)

foto VARCHAR(255)

role ENUM(admin,user)

status ENUM(aktif,nonaktif)

🔄 TRANSAKSI Tabel Sirkulasi Buku

PK id INT (11)

UQ kode_transaksi VARCHAR(30)

FK user_id → users.id

FK buku_id → buku.id

tanggal_pinjam DATE

batas_kembali DATE (+7 hari)

tanggal_kembali DATE (nullable)

status ENUM(dipinjam,...)

📚 BUKU Tabel Koleksi Buku

PK id INT (11)

UQ kode_buku VARCHAR(30)

judul VARCHAR(200)

penulis VARCHAR(150)

penerbit VARCHAR(150)

stok INT(11) Eksemplar

rak VARCHAR(50)

gambar VARCHAR(255) / URL

deskripsi TEXT

Keterangan Relasi & Kardinalitas:

USERS → TRANSAKSI (1 : N): Satu orang siswa bisa memiliki banyak riwayat transaksi peminjaman.
BUKU → TRANSAKSI (1 : N): Satu judul buku dapat dipinjam dalam banyak transaksi peminjaman dari waktu ke waktu.
Foreign Key Constraint: user_id terikat ke users.id (CASCADE), dan buku_id terikat ke buku.id (RESTRICT agar buku yang sedang dipinjam tidak terhapus sembarangan).

11 Cara Menuliskan Dokumentasi Fungsi / Prosedur

Siswa tidak perlu menyalin setiap baris sintaks kode! Tuliskan fungsi modul secara fungsional seperti berikut:

Fungsi login_process(): Memeriksa keabsahan username dan verifikasi kecocokan hash password Bcrypt. Jika valid, membuat session dan mendistribusikan pengguna ke dashboard sesuai role.
Fungsi create_peminjaman(): Menjalankan transaksi basis data untuk memvalidasi limit pinjaman, mencatat kode transaksi unik, dan mengurangi stok buku secara atomik.
Fungsi kembalikan_buku(): Mengubah status transaksi menjadi 'dikembalikan', mencatat waktu pengembalian, dan menambah kembali stok buku.

12 Urutan Pengerjaan Ideal (Rekomendasi Waktu 9 Jam)

Tahap 1 (0.5 Jam): Pahami soal, tentukan skema 3 tabel & role pengguna.
Tahap 2 (1.0 Jam): Buat database db_perpustakaan di phpMyAdmin dan hubungkan dengan CodeIgniter 3.
Tahap 3 (1.5 Jam): Siapkan Auth Helper, Layout Master, dan sistem Login + Registrasi multi-role.
Tahap 4 (2.0 Jam): Selesaikan modul Admin (Dashboard ringkasan statistik, CRUD Buku dengan upload cover, CRUD Anggota).
Tahap 5 (2.0 Jam): Selesaikan modul Siswa (Katalog buku dengan pencarian, peminjaman otomatis potong stok, halaman Buku Saya).
Tahap 6 (1.0 Jam): Pengujian menyeluruh (Debugging seluruh tombol, validasi error form, keamanan filter hak akses).
Tahap 7 (1.0 Jam): Ekspor database SQL, susun berkas ERD, dokumentasi prosedur, dan laporan evaluasi singkat.

🎯 KESIMPULAN INTI SOAL DALAM SATU PARAGRAF:

"Kalian diminta membuat aplikasi perpustakaan sekolah berbasis web di localhost. Ada dua pengguna: Admin (mengelola data buku, anggota, dan transaksi) dan Siswa (daftar/login, mencari buku, meminjam, dan mengembalikan buku). Sistem harus menggunakan database MySQL dengan pemotongan stok otomatis. Setelah program selesai diuji (debugging), kalian wajib menyerahkan source code lengkap, database .sql, ERD, dan laporan dokumentasi."

⚠️

PERINGATAN KRUSIAL: UKK BERSIFAT MANDIRI / PERORANGAN!

BELUM DIKONFIRMASI 🔒

Meskipun materi tutorial ini dapat dipelajari bersama selama sesi latihan, saat hari pelaksanaan ujian penilaian dilakukan secara perorangan (individu). Setiap siswa WAJIB memiliki proyek aplikasi masing-masing yang unik dan tidak diperkenankan sama persis dengan teman:

Nama Database & Folder Mandiri: Wajib gunakan prefix nama/NIS Anda (contoh: db_perpustakaan_andi, folder: C:\xampp\htdocs\perpustakaan_andi).
Data Riil Unik: Input data buku, penulis, penerbit, dan anggota yang berbeda dari teman sebelah.
Diferensiasi Tampilan: Sesuaikan judul web sekolah, slogan sambutan, atau sedikit aksen warna.

Saya telah membaca, memahami, dan siap membuat aplikasi mandiri untuk UKK perorangan saya.

📖

Daftar Modul Praktikum Terstruktur

Pilih modul di bawah ini atau navigasikan melalui menu sidebar sebelah kiri:

Playground Prototipe Statis (Simulasi Visual Siswa)

Coba langsung tampilan aplikasi jadi (Landing Page, Login, Admin Dashboard, Buku, dan Siswa) sebelum mulai mengetik koding!

Buka Prototipe Online (ukkperpus.rf.gd) →

Modul 00 Buka Materi →

Pengantar MVC & Localhost

Memahami pemisahan Model-View-Controller, RDBMS, direktori htdocs, dan port 80/3306.

Modul 01 Buka Materi →

XAMPP, htdocs & Database Manual

Start Apache/MySQL, ekstrak ZIP ke htdocs, buka Sublime, dan buat tabel users/buku/transaksi.

Modul 02 Buka Materi →

Konfigurasi Dasar CodeIgniter 3

Full code konfigurasi config.php (dynamic base_url), database.php, autoload.php, dan .htaccess.

Modul 03 Buka Materi →

Auth Helper & Master Layouts

Full code fungsi penjaga sesi (check_admin, check_user) dan views modular (header, navbar, footer).

Modul 04 Buka Materi →

Landing Page Publik & Autentikasi

Full code Controller Home, view home.php, User_model, Controller Auth (Bcrypt), dan form login/register.

Modul 05 Buka Materi →

Admin: Dashboard & CRUD Buku

Full code agregasi statistik perpustakaan, model kueri buku, pencarian, dan proteksi hapus buku.

Modul 06 Buka Materi →

Admin: Anggota & Sirkulasi Transaksi

Full code Transaksi_model atomik ($this->db->trans_start), Controller Anggota & Transaksi, serta seluruh Views formulir tambah/edit, kartu profil, dan sirkulasi.

Modul 07 Buka Materi →

Modul Portal Siswa

Full code katalog buku 3 kolom, modal pinjam, Buku Saya, riwayat peminjaman, serta profil siswa mandiri.

Modul 08 Buka Materi →

Prosedur Pengujian UKK

Skenario live demo pengujian hak akses admin, siswa, dan mutasi stok di depan guru penguji.

Modul 09 Buka Materi →

Panduan Mengatasi Error & Bantuan AI

Membaca Parse error, deteksi typo titik koma, dan template prompt meminta bantuan AI mencari bug.