MODUL PEMROGRAMAN WEBSITE 2

Mata Kuliah: Pemrograman Website 2
Kode MK: INF2419
SKS: 3 (Praktikum)
Semester: Genap 2025/2026
Program Studi: Informatika
Fakultas: FEBI / Saintek
Universitas: UIN K.H. Abdurrahman Wahid Pekalongan

Dosen Pengampu: Mohammad Reza Maulana, M.Kom
NIP: 199110082025051002

Pertemuan: 1 dari 16
Durasi: 150 menit (3 × 50 menit)
Studi Kasus Berkelanjutan: Sistem Manajemen Perpustakaan

PERTEMUAN 1

KONTRAK KULIAH & PENGANTAR BACKEND WEB

A. KONTRAK KULIAH

1 Identitas Mata Kuliah

2 Deskripsi Mata Kuliah

Mata kuliah Pemrograman Website 2 merupakan kelanjutan dari Pemrograman Website 1, berfokus pada pengembangan sisi backend aplikasi web. Mahasiswa akan mempelajari konsep server-side programming menggunakan PHP, pengelolaan database dengan MySQL, serta pengembangan terstruktur menggunakan framework Laravel dengan pendekatan MVC.

Seluruh pembelajaran dibangun di atas satu studi kasus berkelanjutan — Sistem Manajemen Perpustakaan — yang dikembangkan secara bertahap dari PHP Native (fase 1) hingga Laravel (fase 2), sehingga mahasiswa memahami evolusi nyata pengembangan aplikasi web dari sederhana menuju terstruktur.

3 Capaian Pembelajaran Lulusan (CPL) Program Studi

Mata kuliah ini mendukung pencapaian CPL-Prodi berikut:

• CPL04: Menguasai konsep teoretis bidang ilmu komputer/informatika dan mampu memformulasikan penyelesaian masalah prosedural.

4 Capaian Pembelajaran Mata Kuliah (CPMK)

• CPMK04.1: Memahami konsep dasar pengembangan web backend menggunakan PHP dan database.

5 Metode Pembelajaran

1. Ceramah Interaktif — Penjelasan konsep dengan partisipasi aktif mahasiswa
2. Demonstrasi Live Coding — Dosen mendemonstrasikan kode secara langsung
3. Praktikum Terbimbing — Mahasiswa mengerjakan langkah-langkah praktikum dengan panduan
4. Studi Kasus Berkelanjutan — Seluruh pertemuan terhubung dalam satu proyek nyata
5. Tugas Mandiri — Eksplorasi dan pengembangan fitur secara independen

6 Sistem Penilaian

7 Ketentuan Perkuliahan

a. Kehadiran

• Mahasiswa wajib menghadiri minimal 75% dari total pertemuan untuk dapat mengikuti UAS
• Keterlambatan maksimal 15 menit masih diperkenankan mengikuti perkuliahan
• Lebih dari 15 menit dianggap tidak hadir
• Mahasiswa yang berhalangan hadir wajib memberitahukan dosen sebelum perkuliahan dimulai

b. Tugas dan Pengumpulan

• Semua tugas dikumpulkan via Ngaji UIN Gusdur sesuai deadline yang ditentukan
• Keterlambatan pengumpulan akan mengurangi nilai:
  • Terlambat 1–24 jam: pengurangan 10%
  • Terlambat 1–3 hari: pengurangan 25%
  • Lebih dari 3 hari: tidak diterima (nilai 0)
• Format pengumpulan tugas menggunakan link repository GitHub

c. Integritas Akademik

• Plagiarisme dalam bentuk apapun tidak ditoleransi, sanksi nilai 0 untuk komponen terkait
• Kode yang dikumpulkan harus merupakan hasil pekerjaan sendiri
• Diskusi antar mahasiswa diperbolehkan, namun hasil akhir wajib dikerjakan secara mandiri
• Penggunaan AI generatif (ChatGPT, Copilot, dll.) wajib diungkapkan secara transparan dalam keterangan pengumpulan

d. Komunikasi

• Pengumuman resmi perkuliahan melalui Ngaji UIN Gusdur
• Komunikasi cepat dan informal melalui WhatsApp Group
• Pertanyaan teknis disarankan diposting di forum diskusi Ngaji UIN Gusdur agar bermanfaat untuk semua mahasiswa
• Response time dosen maksimal 1×24 jam

e. Etika Kelas

• Laptop/komputer wajib dibawa setiap pertemuan praktikum
• Tidak menggunakan perangkat untuk hal di luar perkuliahan selama sesi berlangsung
• Menggunakan bahasa yang santun dalam komunikasi
• Aktif bertanya dan membantu sesama mahasiswa

f. Revisi dan Update

• Kontrak kuliah ini dapat direvisi jika diperlukan dengan persetujuan bersama
• Perubahan akan dikomunikasikan melalui Ngaji UIN Gusdur dan WhatsApp Group

8 Rencana Pertemuan (16 Minggu)

9 Tools dan Software yang Digunakan

10 Referensi Utama

1. Welling, L. & Thomson, L. (2016). PHP and MySQL Web Development (5th Edition). Addison-Wesley. ISBN: 978-0321833891
2. Stauffer, M. (2023). Laravel: Up & Running (3rd Edition). O'Reilly Media. ISBN: 978-1098153267
3. PHP Manual — https://www.php.net/manual/en/ (opens in a new tab)
4. Laravel Official Documentation — https://laravel.com/docs (opens in a new tab)
5. MySQL Documentation — https://dev.mysql.com/doc/ (opens in a new tab)

11 Catatan Penting untuk Mahasiswa

📌 Environment yang diinstall di pertemuan ini digunakan sepanjang semester. Pastikan instalasi berhasil sebelum pertemuan berakhir.

📌 Studi kasus Perpustakaan bukan sekadar latihan — ini simulasi proyek nyata. Biasakan mendokumentasikan progress dan melakukan backup kode secara berkala.

📌 Pahami konsepnya sebelum copy-paste kode. Kemampuan debugging dan pemahaman alur logika jauh lebih berharga dari kode yang bekerja tanpa dimengerti.

📌 Fase PHP Native adalah fondasi fase Laravel. Jangan skip atau menganggap enteng pertemuan 2–7.

B. INFORMASI PERTEMUAN

1 Sub-CPMK Pertemuan 1

Sub-CPMK04.1.1: Mahasiswa mampu menjelaskan konsep dasar arsitektur web backend dan menyiapkan lingkungan pengembangan (development environment) untuk keperluan praktikum selama satu semester.

2 Tujuan Pembelajaran (Learning Objectives)

Setelah mengikuti pertemuan ini, mahasiswa akan mampu:

1. Menjelaskan perbedaan frontend dan backend dalam pengembangan web (C2 — Memahami)
2. Menggambarkan alur request-response HTTP dan arsitektur 3-tier secara diagramatik (C2 — Memahami)
3. Mengidentifikasi peran PHP, MySQL, dan Laravel dalam ekosistem backend web (C1 — Mengingat)
4. Menginstal dan mengkonfigurasi XAMPP atau Laragon sebagai development environment (P3 — Presisi)
5. Membuat file PHP pertama yang menampilkan data server dan statistik perpustakaan statis (P4 — Artikulasi)

3 Kompetensi yang Dikembangkan

4 Indikator Pencapaian

Setelah mengikuti pertemuan ini, mahasiswa diharapkan mampu:

1. Menjelaskan minimal 3 perbedaan antara frontend dan backend
2. Menggambarkan alur request-response HTTP dari browser hingga database
3. Menyebutkan peran masing-masing teknologi (PHP, MySQL, Laravel) dalam sistem yang akan dibangun
4. Menjalankan Apache dan MySQL melalui XAMPP/Laragon dengan sukses
5. Menampilkan halaman index.php di browser melalui localhost

5 Alokasi Waktu

C. PENDAHULUAN

1. Deskripsi Singkat

Pertemuan pertama ini terbagi menjadi dua bagian utama. Bagian pertama adalah Kontrak Kuliah, yaitu kesepakatan bersama tentang aturan, sistem penilaian, dan ekspektasi selama satu semester. Bagian kedua adalah Pengantar Backend Web, di mana mahasiswa akan mempelajari konsep dasar arsitektur web, peran PHP/MySQL/Laravel, dan mempersiapkan development environment yang akan digunakan sepanjang semester.

2. Keterkaitan dengan Pertemuan Lain

Pertemuan ini adalah fondasi dari seluruh pembelajaran:

• Pertemuan 1 (ini): Kontrak kuliah, konsep backend, dan setup environment
• Pertemuan 2–5: Environment yang disiapkan hari ini langsung digunakan untuk praktikum PHP
• Pertemuan 6–7: Database yang dibuat di phpMyAdmin hari ini akan diintegrasikan dengan PHP
• Pertemuan 9–15: Pemahaman konsep arsitektur 3-tier dan MVC yang ditanam hari ini menjadi landasan teori untuk Laravel

3. Manfaat Pembelajaran

1. Memahami konteks dan tujuan besar mata kuliah sebelum memulai coding
2. Menyiapkan environment yang digunakan sepanjang satu semester penuh
3. Membangun mental model yang benar tentang bagaimana web bekerja dari sisi server
4. Mengenal studi kasus Sistem Perpustakaan yang menjadi benang merah seluruh pertemuan

4. Relevansi dengan Studi Kasus

Di pertemuan ini, mahasiswa akan melihat gambaran besar Sistem Manajemen Perpustakaan yang akan dibangun secara bertahap. Sistem ini memiliki tiga entitas utama (Buku, Anggota, Transaksi) dengan business rules nyata, dan akan berkembang dari halaman statis sederhana hingga aplikasi web penuh dengan autentikasi menggunakan Laravel.

D. MATERI PEMBELAJARAN

1 Konsep Frontend dan Backend

a. Definisi Frontend (Client-Side)

Frontend adalah bagian aplikasi web yang berinteraksi langsung dengan pengguna, dijalankan di browser pengguna.

Karakteristik Frontend:

• Dieksekusi di sisi client (browser)
• Mengatur tampilan dan interaksi visual
• Dapat dilihat dan diinspeksi langsung oleh pengguna

Teknologi Frontend: HTML, CSS, JavaScript, React, Vue.js

b. Definisi Backend (Server-Side)

Backend adalah bagian aplikasi web yang mengelola logika bisnis, pemrosesan data, dan komunikasi dengan database, dijalankan di server.

Karakteristik Backend:

• Dieksekusi di sisi server
• Tidak terlihat langsung oleh pengguna
• Mengelola keamanan, autentikasi, dan integritas data

Teknologi Backend: PHP, Python, Node.js, Java, MySQL, PostgreSQL

c. Perbandingan Frontend dan Backend

Analogi Restoran:

• Frontend = Ruang makan dan pelayan (berinteraksi langsung dengan pelanggan)
• Backend = Dapur (memproses pesanan, mengolah bahan)
• Database = Gudang penyimpanan bahan makanan

2 Alur Request-Response HTTP

a. Penjelasan Alur

Setiap kali pengguna mengakses halaman web, terjadi komunikasi antara browser dan server melalui protokol HTTP:

1. User mengetik URL di browser
         ↓
2. Browser mengirim HTTP Request ke Web Server (Apache)
         ↓
3. Apache meneruskan ke PHP Engine
         ↓
4. PHP mengeksekusi kode dan query ke Database MySQL
         ↓
5. MySQL mengembalikan hasil query ke PHP
         ↓
6. PHP membangun HTML dari data yang diterima
         ↓
7. Apache mengirim HTTP Response (HTML) ke browser
         ↓
8. Browser merender dan menampilkan halaman ke pengguna

b. HTTP Methods

3 Arsitektur Web 3-Tier

Arsitektur Three-Tier membagi sistem aplikasi menjadi tiga lapisan yang memiliki tanggung jawab berbeda namun saling terhubung.

┌─────────────────────────────────────┐
│         PRESENTATION TIER           │
│    HTML, CSS, JavaScript (Browser)  │  ← Pengguna berinteraksi di sini
└──────────────────┬──────────────────┘
                   ↕ HTTP Request / Response
┌──────────────────┴──────────────────┐
│          APPLICATION TIER           │
│        PHP / Laravel (Server)       │  ← Logika bisnis diproses di sini
└──────────────────┬──────────────────┘
                   ↕ SQL Query / Result
┌──────────────────┴──────────────────┐
│             DATA TIER               │
│          MySQL Database             │  ← Data disimpan dan dikelola di sini
└─────────────────────────────────────┘

Pemisahan lapisan ini membuat sistem lebih terstruktur, mudah dikembangkan, dan aman, karena setiap tier dapat dimodifikasi secara independen tanpa mengganggu lapisan lainnya.

4 Peran Teknologi dalam Studi Kasus Perpustakaan

PHP (Hypertext Preprocessor)

• Peran: Memproses request, menjalankan logika bisnis, berkomunikasi dengan database
• Digunakan: Pertemuan 2–7 (PHP Native) dan 9–15 (Laravel)
• Contoh penggunaan: Mengecek apakah stok buku tersedia, menghitung denda keterlambatan

MySQL

• Peran: Menyimpan dan mengelola data buku, anggota, dan transaksi secara persisten
• Digunakan: Sepanjang semester
• Contoh penggunaan: SELECT * FROM buku WHERE stok > 0

Laravel

• Peran: Framework PHP yang menyediakan struktur MVC, ORM, routing, dan autentikasi secara terintegrasi
• Digunakan: Pertemuan 9–15 (refactoring dari PHP Native)
• Kapan digunakan: Project skala menengah-besar yang membutuhkan maintainability tinggi

5 Studi Kasus: Gambaran Sistem Perpustakaan

Sepanjang semester, kita akan membangun Sistem Manajemen Perpustakaan secara bertahap. Berikut gambaran besarnya:

Entitas Utama dan Strukturnya:

BUKU                         ANGGOTA
- id_buku (PK)               - id_anggota (PK)
- kode_buku (UNIQUE)         - nama
- judul                      - email
- kategori                   - telepon
- pengarang                  - alamat
- penerbit                   - tanggal_daftar
- tahun_terbit               - status
- isbn
- harga
- stok
           ↘                ↙
              TRANSAKSI
              - id_transaksi (PK)
              - id_buku (FK)
              - id_anggota (FK)
              - tanggal_pinjam
              - tanggal_kembali
              - status
              - denda

Catatan: Skema lengkap ini adalah target akhir yang akan dibangun secara bertahap. Di Pertemuan 1 kita hanya membuat versi sederhana untuk pengenalan. Skema penuh dengan SQL DDL lengkap akan dibuat di Pertemuan 6.

Business Rules:

• Anggota hanya bisa meminjam jika stok buku > 0
• Maksimal 3 buku per anggota dalam satu waktu
• Durasi pinjam: 7 hari
• Denda keterlambatan: Rp 1.000/hari
• Stok buku otomatis berkurang saat dipinjam dan bertambah saat dikembalikan

Roadmap Development:

• Fase 1 (PHP Native — P2 s/d UTS): Data statis → Form input → CRUD + Database
• Fase 2 (Laravel — P9 s/d UAS): Refactor ke MVC → ORM → Autentikasi → Transaksi lengkap

E. PRAKTIKUM

1 Tujuan Praktikum

• Menginstal dan mengkonfigurasi development environment (XAMPP atau Laragon)
• Memverifikasi bahwa PHP dan MySQL berjalan dengan benar
• Membuat file PHP pertama dan menampilkannya di browser
• Mengenal antarmuka phpMyAdmin untuk manajemen database

2 Instalasi Development Environment

Opsi A — XAMPP (Windows / Mac / Linux)

Langkah 1: Download

• Buka https://www.apachefriends.org (opens in a new tab)
• Download XAMPP versi terbaru (PHP 8.x) sesuai sistem operasi

Langkah 2: Instalasi (Windows)

1. Jalankan installer xampp-windows-xxx.exe
2. Klik Next hingga selesai
3. Pastikan komponen berikut tercentang: Apache, MySQL, PHP, phpMyAdmin

Langkah 3: Menjalankan XAMPP

1. Buka XAMPP Control Panel
2. Klik Start pada Apache dan MySQL
3. Status berubah menjadi hijau jika berhasil

Langkah 4: Verifikasi

• Buka browser, akses http://localhost (opens in a new tab)
• Harus muncul halaman selamat datang XAMPP
• Folder project: C:\xampp\htdocs

Opsi B — Laragon (Direkomendasikan untuk Windows)

Langkah 1: Download di https://laragon.org (opens in a new tab) → pilih Laragon Full Langkah 2: Install → Next hingga selesai Langkah 3: Buka Laragon → klik Start All Langkah 4: Verifikasi di http://localhost (opens in a new tab) → muncul halaman Laragon

• Folder project: C:\laragon\www

3 Membuat File PHP Pertama

Langkah 1: Buat Folder Project

• Masuk ke C:\xampp\htdocs atau C:\laragon\www
• Buat folder baru: perpustakaan

Langkah 2: Buat File index.php

Buat file baru bernama index.php di dalam folder perpustakaan, isi dengan kode berikut:

<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sistem Perpustakaan</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            max-width: 800px;
            margin: 50px auto;
            padding: 20px;
            background-color: #f4f4f4;
        }
        .card {
            background: white;
            padding: 25px;
            border-radius: 8px;
            margin: 15px 0;
            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
        }
        h1 { color: #2c3e50; border-bottom: 3px solid #27ae60; padding-bottom: 10px; }
        .info  { background: #e8f5e9; border-left: 4px solid #27ae60; padding: 12px; margin: 10px 0; }
        .server { background: #fff3cd; border-left: 4px solid #ffc107; padding: 12px; margin: 10px 0; }
    </style>
</head>
<body>
    <div class="card">
        <h1>🏛️ Sistem Manajemen Perpustakaan</h1>
 
        <div class="info">
            <h3>Selamat Datang!</h3>
            <p><strong>Dibuat oleh:</strong> <?php echo "Nama Mahasiswa Anda"; ?></p>
            <p><strong>Tanggal:</strong> <?php echo date('d F Y'); ?></p>
            <p><strong>Waktu Server:</strong> <?php echo date('H:i:s'); ?></p>
        </div>
 
        <div class="server">
            <h3>Informasi Server</h3>
            <p><strong>PHP Version:</strong> <?php echo phpversion(); ?></p>
            <p><strong>Server Software:</strong> <?php echo $_SERVER['SERVER_SOFTWARE']; ?></p>
            <p><strong>Document Root:</strong> <?php echo $_SERVER['DOCUMENT_ROOT']; ?></p>
        </div>
 
        <?php
        // Data statis — belum dari database
        $nama_perpus   = "Perpustakaan Universitas ABC";
        $total_buku    = 1250;
        $total_anggota = 450;
        $buku_dipinjam = 178;
        $buku_tersedia = $total_buku - $buku_dipinjam;
        $persen_pinjam = round(($buku_dipinjam / $total_buku) * 100, 1);
        ?>
 
        <div class="info">
            <h3>📊 Statistik <?php echo $nama_perpus; ?></h3>
            <p><strong>Total Buku:</strong> <?php echo number_format($total_buku); ?> buku</p>
            <p><strong>Total Anggota:</strong> <?php echo number_format($total_anggota); ?> orang</p>
            <p><strong>Sedang Dipinjam:</strong> <?php echo $buku_dipinjam; ?> buku (<?php echo $persen_pinjam; ?>%)</p>
            <p><strong>Tersedia:</strong> <?php echo number_format($buku_tersedia); ?> buku</p>
        </div>
    </div>
</body>
</html>

Langkah 3: Jalankan dan Verifikasi

1. Buka browser
2. Akses: http://localhost/perpustakaan/ (opens in a new tab)
3. Halaman statistik perpustakaan harus tampil dengan benar

Langkah 4: Pahami Struktur Kode

• <?php ... ?> — Tag pembuka dan penutup blok PHP
• echo — Menampilkan output ke halaman
• date() — Fungsi tanggal dan waktu bawaan PHP
• $_SERVER — Array superglobal berisi informasi server
• $variabel — Cara deklarasi variabel di PHP
• number_format() — Memformat angka dengan pemisah ribuan

4 Eksplorasi phpMyAdmin

Langkah 1: Akses phpMyAdmin

• Buka browser → akses http://localhost/phpmyadmin (opens in a new tab)
• Login (default: username = root, password = kosong)

Langkah 2: Buat Database

1. Klik tab Databases
2. Isi nama database: perpustakaan_db
3. Collation: utf8mb4_general_ci
4. Klik Create

Langkah 3: Buat Tabel buku (Versi Preview)

Catatan: Tabel yang dibuat di sini adalah versi sederhana untuk pengenalan antarmuka phpMyAdmin. Skema lengkap dengan semua kolom (kode_buku, kategori, penerbit, tahun_terbit, isbn, harga, dll.) akan dibuat menggunakan SQL DDL di Pertemuan 6. Jangan khawatir jika tabel ini terasa kurang lengkap — itu memang disengaja.

1. Pilih database perpustakaan_db
2. Isi nama tabel: buku, jumlah kolom: 4 → klik Go
3. Isi definisi kolom:

4. Klik Save

Langkah 4: Insert Data dan Uji Query

1. Klik tab Insert → tambahkan 3 data buku dummy
2. Klik tab SQL → jalankan query berikut:

SELECT * FROM buku WHERE stok > 0;

3. Perhatikan hasilnya — ini adalah dasar dari semua operasi Read yang akan kita bangun

F. TUGAS

1 Tugas 1: Dokumentasi Environment (40%)

Instruksi: Buat dokumen PDF berisi screenshot beserta penjelasan singkat dari setiap tampilan:

1. XAMPP Control Panel atau Laragon dengan Apache & MySQL berstatus running
2. Halaman http://localhost (opens in a new tab) (halaman default server)
3. Halaman http://localhost/perpustakaan/ (opens in a new tab) (file index.php Anda)
4. Antarmuka phpMyAdmin setelah tabel buku berhasil dibuat

Sertakan Nama, NIM, dan Kelas di bagian atas dokumen.

Deadline: Sebelum Pertemuan 2 Platform: Ngaji UIN Gusdur (opens in a new tab)

2 Tugas 2: Modifikasi index.php (60%)

Instruksi: Salin index.php menjadi index_v2.php, kemudian modifikasi dengan menambahkan:

1. Nama Anda sebagai pembuat di bagian selamat datang
2. Variabel $alamat_perpus dan $telepon_perpus, tampilkan di dalam card info
3. Variabel $jam_buka dan $jam_tutup untuk jam operasional
4. Card baru bertema Informasi Perpustakaan yang menampilkan: alamat, telepon, jam operasional, dan hari libur (Sabtu–Minggu)
5. Perhitungan dan tampilan persentase buku yang tersedia (bukan dipinjam):

$persen_tersedia = round(($buku_tersedia / $total_buku) * 100, 1);

Deadline: Sebelum Pertemuan 2 Platform: Ngaji UIN Gusdur (submit link repository GitHub)

G. EVALUASI

1 Kuis Singkat (Dikerjakan di Kelas)

Pilihan Ganda:

1. Apa kepanjangan dari PHP?

   • A. Personal Home Page
   • B. PHP: Hypertext Preprocessor
   • C. Private Hypertext Processor
   • D. Public HTML Processor

2. Teknologi berikut yang termasuk kategori frontend:

   • A. PHP
   • B. MySQL
   • C. JavaScript
   • D. Laravel

3. HTTP Method yang digunakan untuk mengambil data:

   • A. POST
   • B. GET
   • C. PUT
   • D. DELETE

4. Port default Apache Web Server:

   • A. 3306
   • B. 8080
   • C. 80
   • D. 443

5. Dalam arsitektur 3-tier, MySQL termasuk ke dalam tier:

   • A. Presentation Tier
   • B. Application Tier
   • C. Data Tier
   • D. Business Tier

Essay Singkat:

1. Jelaskan minimal 3 perbedaan antara frontend dan backend pengembangan web!
2. Gambarkan dan jelaskan alur request-response HTTP dari browser hingga database!
3. Sebutkan 3 entitas data utama dalam Sistem Perpustakaan yang akan kita bangun, beserta minimal 3 atributnya masing-masing!

H. REFERENSI

1 Referensi Utama

1. Welling, L. & Thomson, L. (2016). PHP and MySQL Web Development (5th Edition). Addison-Wesley. ISBN: 978-0321833891
2. Stauffer, M. (2023). Laravel: Up & Running (3rd Edition). O'Reilly Media. ISBN: 978-1098153267

2 Referensi Online

1. PHP Manual — https://www.php.net/manual/en/ (opens in a new tab)
2. W3Schools PHP Tutorial — https://www.w3schools.com/php/ (opens in a new tab)
3. Laravel Official Documentation — https://laravel.com/docs (opens in a new tab)
4. MySQL Documentation — https://dev.mysql.com/doc/ (opens in a new tab)
5. XAMPP Documentation — https://www.apachefriends.org/docs/ (opens in a new tab)

3 Video Resources

1. Traversy Media — "PHP For Beginners" (YouTube)
2. Laravel Daily — "Laravel for Beginners" (YouTube)
3. freeCodeCamp — "PHP Programming Language Tutorial" (YouTube)

I. LAMPIRAN

Lampiran A: Checklist Persiapan Mahasiswa

Gunakan checklist ini untuk memastikan kesiapan sebelum pertemuan 2:

• XAMPP atau Laragon berhasil diinstal
• Apache berjalan dan http://localhost (opens in a new tab) dapat diakses
• MySQL berjalan dan phpMyAdmin dapat diakses
• Folder perpustakaan sudah dibuat di dalam htdocs atau www
• File index.php tampil dengan benar di http://localhost/perpustakaan/ (opens in a new tab)
• Database perpustakaan_db berhasil dibuat di phpMyAdmin
• Tabel buku berhasil dibuat dengan 4 kolom
• Tugas 1 dan Tugas 2 sudah dikumpulkan di Ngaji UIN Gusdur

Lampiran B: Panduan Troubleshooting Umum

Lampiran C: Contoh Struktur Folder Project

C:\xampp\htdocs\
└── perpustakaan\
    ├── index.php         ← File utama (dibuat hari ini)
    ├── index_v2.php      ← Tugas 2
    └── (folder lain akan dibuat di pertemuan selanjutnya)

PENUTUP

Pertemuan 1 ini adalah fondasi dari seluruh perjalanan semester. Pemahaman tentang arsitektur backend dan keberhasilan setup environment akan menentukan kelancaran praktikum di pertemuan-pertemuan berikutnya.

Key Messages:

1. Backend bukan hanya soal coding — ini tentang memahami bagaimana data mengalir dari pengguna ke database dan kembali lagi
2. Studi kasus Perpustakaan adalah proyek nyata yang akan terus berkembang — jaga kode Anda dengan baik
3. Jangan ragu bertanya jika environment bermasalah — lebih baik selesaikan sekarang daripada tertinggal di pertemuan berikutnya

Persiapan Pertemuan 2:

• Pastikan environment sudah berjalan sempurna
• Baca materi PHP Dasar (variabel, tipe data, operator) dari referensi yang disediakan
• Kumpulkan Tugas 1 dan Tugas 2 sebelum Pertemuan 2 dimulai

Disusun oleh: Mohammad Reza Maulana, M.Kom Program Studi Informatika UIN K.H. Abdurrahman Wahid Pekalongan

Revisi: Februari 2026