# 📚 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

- [x] **Autentikasi (Login & Register)**  
  Sistem login siswa menggunakan **NISN** dan registrasi sederhana.

- [x] **Dashboard**  
  Menampilkan ringkasan aktivitas siswa/guru seperti statistik pinjaman, grafik, dan pengumuman.
  
- [x] **Peminjaman Buku Offline**  
  Simulasi peminjaman buku fisik di perpustakaan.

- [x] **Peminjaman Buku Online**  
  Simulasi membaca atau meminjam buku digital langsung di aplikasi.

- [x] **Riwayat Peminjaman Offline**  
  Daftar histori buku fisik yang pernah dipinjam.

- [x] **Riwayat Peminjaman Online**  
  Daftar histori buku digital yang pernah dipinjam atau dibaca.

- [ ] **Role Management**  
  Manajemen peran (siswa & guru) untuk akses fitur yang berbeda.
  - Siswa : [x]
  - Penjaga Perpus : [x]
  - Guru : []


- [x] **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](https://www.php.net/) **8.2+**
- [Composer](https://getcomposer.org/) (manajer paket PHP)
- [Node.js & NPM](https://nodejs.org/) (manajer paket JavaScript)

---

## 🚀 Instalasi & Cara Menjalankan

### 1. Clone atau Unduh Proyek
Jika proyek ada di repositori Git:
```bash
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

```bash
composer install
```

---

### 3. Buat File Environment

```bash
cp .env.example .env
```

---

### 4. Hasilkan Kunci Aplikasi

```bash
php artisan key:generate
```

---

### 5. Instal Dependensi Frontend

```bash
npm install
```

---

### 6. Compile Aset Frontend & Jalankan Server

**A. Development (auto-refresh browser)**
Gunakan 2 terminal terpisah:

* Terminal 1:

  ```bash
  npm run dev
  ```
* Terminal 2:

  ```bash
  php artisan serve
  ```

**B. Simulasi Produksi**

```bash
npm run build
php artisan serve
```

---

### 7. Buka Aplikasi

```text
http://127.0.0.1:8000
```

---

## 🔑 Informasi Login (Dummy Data)

Gunakan kredensial berikut untuk masuk sebagai siswa:

* **NISN**: `1234567890`
* **Password**: `password`

Gunakan kredensial berikut untuk masuk sebagai guru:

* **email**: `rina.marlina@smkn1perpus.sch.id`
* **Password**: `password`

Gunakan kredensial berikut untuk masuk sebagai penjaga perpus:

* **email**: `budi.santoso@smkn1perpus.sch.id`
* **Password**: `password`

---

## 📚 Belajar Laravel

Untuk dokumentasi resmi Laravel:
👉 [https://laravel.com/docs](https://laravel.com/docs)

---
# skripsi-perpus-fe
# skripsi-perpus-fe
# skripsi-perpus-fe-main
