3.0 KiB
📚 Perpus Digital - Prototipe Frontend Aplikasi Perpustakaan
Prototipe frontend untuk aplikasi perpustakaan digital yang ditujukan untuk siswa dan guru.
Aplikasi ini mencakup alur otentikasi (login & register) dan halaman dashboard yang komprehensif untuk menampilkan aktivitas perpustakaan.
⚠️ Prototipe ini dibangun tanpa backend atau database.
Semua data yang ditampilkan bersifat statis (dummy data) yang disimulasikan melalui Laravel Service untuk keperluan demonstrasi dan pengembangan antarmuka (UI/UX).
✨ Fitur Utama
-
Autentikasi (Login & Register)
Sistem login siswa menggunakan NISN dan registrasi sederhana. -
Dashboard
Menampilkan ringkasan aktivitas siswa/guru seperti statistik pinjaman, grafik, dan pengumuman. -
Peminjaman Buku Offline
Simulasi peminjaman buku fisik di perpustakaan. -
Peminjaman Buku Online
Simulasi membaca atau meminjam buku digital langsung di aplikasi. -
Riwayat Peminjaman Offline
Daftar histori buku fisik yang pernah dipinjam. -
Riwayat Peminjaman Online
Daftar histori buku digital yang pernah dipinjam atau dibaca. -
Role Management
Manajemen peran (siswa & guru) untuk akses fitur yang berbeda. -
Katalog Buku
Daftar buku dengan informasi detail dan cover.
🛠️ Teknologi yang Digunakan
- Framework: Laravel 12
- Frontend:
- Bootstrap 5
- Sass (SCSS) untuk theming kustom
- Vite.js untuk kompilasi aset
- Grafik (Charting): Chart.js
- Ikon: Bootstrap Icons
- Bahasa: PHP 8.4, JavaScript
📦 Prasyarat
Sebelum menjalankan proyek ini, pastikan sudah terinstal:
- PHP 8.2+
- Composer (manajer paket PHP)
- Node.js & NPM (manajer paket JavaScript)
🚀 Instalasi & Cara Menjalankan
1. Clone atau Unduh Proyek
Jika proyek ada di repositori Git:
git clone https://github.com/zhadaarsita/skripsi-perpus-fe.git
cd skripsi-perpus-fe
Atau ekstrak file ZIP jika tidak menggunakan Git.
2. Instal Dependensi PHP
composer install
3. Buat File Environment
cp .env.example .env
4. Hasilkan Kunci Aplikasi
php artisan key:generate
5. Instal Dependensi Frontend
npm install
6. Compile Aset Frontend & Jalankan Server
A. Development (auto-refresh browser) Gunakan 2 terminal terpisah:
-
Terminal 1:
npm run dev -
Terminal 2:
php artisan serve
B. Simulasi Produksi
npm run build
php artisan serve
7. Buka Aplikasi
http://127.0.0.1:8000
🔑 Informasi Login (Dummy Data)
Gunakan kredensial berikut untuk masuk sebagai siswa:
- NISN:
1234567890 - Password:
password
📚 Belajar Laravel
Untuk dokumentasi resmi Laravel: 👉 https://laravel.com/docs