Download CRUD PHP MySQL Sederhana untuk Tugas Kuliah

Memasuki semester awal di jurusan rumpun komputer seperti Teknik Informatika, Sistem Informasi, atau Teknik Komputer, ada satu materi wajib yang dipastikan muncul di lembar tugas atau modul praktikum: Membuat Aplikasi CRUD. Di Postingan ini kamu bisa Download CRUD PHP Mysql Sederhana ini dan pastikan untuk mempelajari kode yang kamu buat. Di bawah juga telah dijelaskan langkah-langkah untuk membuat aplikasi CRUD Sederhana ini.

CRUD yang merupakan singkatan dari Create, Read, Update, dan Delete adalah fondasi paling mendasar dalam pengembangan aplikasi berbasis web. Konsep ini mengatur bagaimana sebuah program web berinteraksi dengan database mulai dari memasukkan data, menampilkan data ke tabel, mengubah isi data, hingga menghapusnya secara permanen.

Bagi pemula yang baru belajar pemrograman web, memahami aliran data dari PHP murni (Native) ke database MySQL terkadang bisa terasa membingungkan. Banyak tutorial di luar sana yang langsung mencampurkan logika PHP dengan framework rumit atau kelas CSS yang panjang, sehingga esensi dasar kodingannya justru sulit dipahami.

Oleh karena itu, di artikel kali ini, kita akan membedah secara runut Source Code CRUD Data Mahasiswa yang dibuat menggunakan PHP Native Prosedural. Pendekatan prosedural sengaja dipilih karena alur logikanya dibaca baris demi baris dari atas ke bawah, menjadikannya metode belajar terbaik bagi mahasiswa sebelum nantinya melompat ke konsep OOP atau Framework.

Apa Saja yang Akan Kita Buat?

Sistem manajemen data mahasiswa sederhana ini akan dibagi menjadi 5 file esensial yang saling terhubung:

koneksi.php – Menangani jalur komunikasi aman antara aplikasi PHP dan server database MySQL.
index.php – Halaman utama (Read) untuk menampilkan visualisasi data mahasiswa dalam bentuk tabel yang rapi.
tambah.php – Formulir khusus (Create) untuk menerima input mahasiswa baru dan menyimpannya ke database.
edit.php – Halaman dinamis (Update) untuk memuat data lama berdasarkan ID dan memperbaruinya.
hapus.php – File eksekutor (Delete) yang bekerja di balik layar untuk menghapus record data secara instan.
style.css – File CSS untuk membuat tampilan lebih keren.

Kamu bisa mendownload source code melalui link di bawah artikel.

Keunggulan Source Code Ini:

PHP Murni Tanpa Framework: 100% menggunakan fungsi bawaan mysqli asli yang sesuai dengan standar penilaian dosen praktikum.
Sentuhan Desain Tanpa Menyentuh HTML: Kode HTML dibiarkan sangat polos dan bersih agar kamu mudah mempelajari logikanya. Namun, di akhir kita akan menyuntikkan file CSS modern yang memanfaatkan Advanced CSS Selector untuk mengubah tampilan jadul menjadi minimalis dan profesional secara instan.
Siap Uji Coba di Lokal: Sangat aman dijalankan di lingkungan localhost menggunakan XAMPP, MAMP, atau Local.
File .sql lengkap Dummy Data: Dalam file yang kamu download terdapat file sql yang telah berisi beberapa dummy data.

Langkah-langkah membuat aplikasi CRUD PHP MySQL

Langkah 1: Siapkan Database MySQL

Buat database bernama kampus dan mengeksekusi perintah SQL berikut di phpMyAdmin untuk membuat tabel mahasiswa:

CREATE DATABASE kampus;
USE kampus;

CREATE TABLE mahasiswa (
    id INT AUTO_INCREMENT PRIMARY KEY,
    nim VARCHAR(15) NOT NULL,
    nama VARCHAR(100) NOT NULL,
    jurusan VARCHAR(50) NOT NULL,
    alamat TEXT
);

Langkah 2: Buat Kodingan Sistem (5 File Esensial)

Buat folder baru bernama crud-mahasiswa di dalam direktori htdocs Anda (XAMPP). Lalu isi dengan file-file berikut:

1. `koneksi.php` (Penghubung ke Database)

File ini akan di-include di setiap halaman untuk membuka jalur komunikasi ke MySQL.

<?php
$host = "localhost";
$user = "root";
$pass = "";
$db   = "kampus";

$koneksi = mysqli_connect($host, $user, $pass, $db);

if (!$koneksi) {
    die("Koneksi ke database gagal: " . mysqli_connect_error());
}
?>

2. `index.php` (Read – Menampilkan Data)

Halaman utama yang berisi tabel data mahasiswa beserta tombol Tambah, Edit, dan Hapus.

<?php include 'koneksi.php'; ?>
<!DOCTYPE html>
<html>
<head>
    <title>CRUD Data Mahasiswa</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h2>Daftar Mahasiswa</h2>
    <a href="tambah.php">+ Tambah Mahasiswa Baru</a><br><br>

    <table border="1" cellpadding="10" cellspacing="0">
        <tr>
            <th>No</th>
            <th>NIM</th>
            <th>Nama</th>
            <th>Jurusan</th>
            <th>Alamat</th>
            <th>Aksi</th>
        </tr>
        <?php
        $no = 1;
        $query = mysqli_query($koneksi, "SELECT * FROM mahasiswa ORDER BY id DESC");
        while($data = mysqli_fetch_array($query)) {
            ?>
            <tr>
                <td><?php echo $no++; ?></td>
                <td><?php echo $data['nim']; ?></td>
                <td><?php echo $data['nama']; ?></td>
                <td><?php echo $data['jurusan']; ?></td>
                <td><?php echo $data['alamat']; ?></td>
                <td>
                    <a href="edit.php?id=<?php echo $data['id']; ?>">Edit</a> | 
                    <a href="hapus.php?id=<?php echo $data['id']; ?>" onclick="return confirm('Yakin ingin menghapus data ini?')">Hapus</a>
                </td>
            </tr>
            <?php 
        } 
        ?>
    </table>
</body>
</html>

3. `tambah.php` (Create – Formulir Tambah Data)

Menangani input data baru melalui formulir HTML dan menyimpannya ke MySQL.

<?php 
include 'koneksi.php'; 

if (isset($_POST['submit'])) {
    $nim     = $_POST['nim'];
    $nama    = $_POST['nama'];
    $jurusan = $_POST['jurusan'];
    $alamat  = $_POST['alamat'];

    $insert = mysqli_query($koneksi, "INSERT INTO mahasiswa (nim, nama, jurusan, alamat) VALUES ('$nim', '$nama', '$jurusan', '$alamat')");

    if ($insert) {
        header("Location: index.php");
    } else {
        echo "Gagal menambahkan data: " . mysqli_error($koneksi);
    }
}
?>
<!DOCTYPE html>
<html>
<head>
    <title>Tambah Mahasiswa</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h2>Tambah Data Mahasiswa</h2>
    <form method="POST" action="">
        <label>NIM:</label><br><input type="text" name="nim" required><br><br>
        <label>Nama:</label><br><input type="text" name="nama" required><br><br>
        <label>Jurusan:</label><br><input type="text" name="jurusan" required><br><br>
        <label>Alamat:</label><br><textarea name="alamat" required></textarea><br><br>
        <button type="submit" name="submit">Simpan Data</button>
        <a href="index.php">Kembali</a>
    </form>
</body>
</html>

4. `edit.php` (Update – Formulir Ubah Data)

Mengambil data lama berdasarkan id di URL ($_GET), menampilkannya di form, lalu memperbaruinya jika tombol ditekan.

<?php
include 'koneksi.php';

$id = $_GET['id'];
$query = mysqli_query($koneksi, "SELECT * FROM mahasiswa WHERE id='$id'");
$data = mysqli_fetch_array($query);

if (isset($_POST['update'])) {
    $nim     = $_POST['nim'];
    $nama    = $_POST['nama'];
    $jurusan = $_POST['jurusan'];
    $alamat  = $_POST['alamat'];

    $update = mysqli_query($koneksi, "UPDATE mahasiswa SET nim='$nim', nama='$nama', jurusan='$jurusan', alamat='$alamat' WHERE id='$id'");

    if ($update) {
        header("Location: index.php");
    } else {
        echo "Gagal memperbarui data: " . mysqli_error($koneksi);
    }
}
?>
<!DOCTYPE html>
<html>
<head>
    <title>Edit Mahasiswa</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h2>Edit Data Mahasiswa</h2>
    <form method="POST" action="">
        <label>NIM:</label><br><input type="text" name="nim" value="<?php echo $data['nim']; ?>" required><br><br>
        <label>Nama:</label><br><input type="text" name="nama" value="<?php echo $data['nama']; ?>" required><br><br>
        <label>Jurusan:</label><br><input type="text" name="jurusan" value="<?php echo $data['jurusan']; ?>" required><br><br>
        <label>Alamat:</label><br><textarea name="alamat" required><?php echo $data['alamat']; ?></textarea><br><br>
        <button type="submit" name="update">Update Data</button>
        <a href="index.php">Kembali</a>
    </form>
</body>
</html>

5. `hapus.php` (Delete – Proses Eksekusi Hapus)

File ini tidak memiliki tampilan HTML. Begitu dipanggil lewat URL, ia langsung menghapus data dan melempar kembali (redirect) user ke halaman utama.

<?php
include 'koneksi.php';

$id = $_GET['id'];
$delete = mysqli_query($koneksi, "DELETE FROM mahasiswa WHERE id='$id'");

if ($delete) {
    header("Location: index.php");
} else {
    echo "Gagal menghapus data: " . mysqli_error($koneksi);
}
?>

6. `style.css` (Percantik tampilan aplikasi)

Agar tampilan CRUD kita menjadi berselera minimalis, bersih, dan profesional, kita perlu menambahkan racikan CSS yang telah kita panggil di file-file di atas dengan tag:

Di antara tag head.

/* ==========================================================================
   1. RESET & GLOBAL STYLE (Mengubah Font & Kanvas)
   ========================================================================== */

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: #333333;
    background-color: #f8f9fa;
    line-height: 1.6;
    margin: 0;
    padding: 40px 20px;
}

/* Mengatur semua anak langsung body ke tengah, KECUALI tag anchor/tombol */
body > *:not(a) {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

/* Khusus tombol tambah, kita beri batasan margin manual agar sejajar dengan tabel */
a[href="tambah.php"] {
    display: inline-block;
    max-width: 1000px;
    margin-left: calc((100% - 1000px) / 2); /* Trik CSS untuk mendorong tombol sejajar tabel di layar lebar */
}

/* Jika layar di bawah 1000px, kembalikan margin tombol ke normal */
@media (max-width: 1040px) {
    a[href="tambah.php"] {
        margin-left: 0;
    }
}


/* Mempercantik Judul (h2) */
h2 {
    font-size: 28px;
    color: #1a1a1a;
    margin-bottom: 20px;
    border-bottom: 2px solid #e0e0e0;
    padding-bottom: 10px;
}

/* ==========================================================================
   2. NAVIGASI & TOMBOL (Mengubah Elemen Anchor )
   ========================================================================== */
/* Tombol "+ Tambah Mahasiswa Baru" */
a[href="tambah.php"] {
    font-size: 0.9em;
    display: inline-block;
    background-color: #007bff;
    color: #ffffff;
    text-decoration: none;
    padding: 5px 10px;
    border-radius: 6px;
    font-weight: 500;
    transition: background-color 0.2s;
    margin-bottom: 25px;
}

a[href="tambah.php"]:hover {
    background-color: #0056b3;
}

/* Tombol "Kembali" di halaman form */
a[href="index.php"] {
    display: inline-block;
    color: #6c757d;
    text-decoration: none;
    margin-left: 15px;
    font-weight: 500;
}

a[href="index.php"]:hover {
    text-decoration: underline;
}

/* ==========================================================================
   3. MODERNISASI TABEL (Menghapus Border Kuno HTML)
   ========================================================================== */
table {
    width: 100%;
    border-collapse: collapse !important; /* Memaksa border HTML bawaan lebur */
    background-color: #ffffff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    margin-top: 10px;
}

/* Menghilangkan sisa-sisa garis luar border bawaan HTML */
table, th, td {
    border: none !important;
}

/* Gaya Header Tabel (th) */
th {
    background-color: #f1f3f5;
    color: #495057;
    text-align: left;
    font-weight: 600;
    padding: 14px 16px;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
}

/* Gaya Baris Sel (td) */
td {
    padding: 14px 16px;
    border-bottom: 1px solid #eeeeee !important;
    vertical-align: middle;
    font-size: 15px;
}

/* Memberikan efek zebra (warna selang-seling) pada baris tabel */
tr:nth-child(even) {
    background-color: #fafbfc;
}

/* Efek Hover saat baris disorot mouse */
tr:hover {
    background-color: #f1f3f5;
}

/* Link Aksi di dalam tabel (Edit | Hapus) */
td a {
    text-decoration: none;
    color: #007bff;
    font-weight: 500;
}

td a:hover {
    text-decoration: underline;
}

/* Mengubah warna khusus untuk link Hapus */
td a[href*="hapus.php"] {
    color: #dc3545;
}

/* ==========================================================================
   4. FORMULIR MINIMALIS (Mengubah Input, Textarea, & Button)
   ========================================================================== */
form {
    background-color: #ffffff;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

/* Merapikan susunan Label */
label {
    display: block;
    font-weight: 600;
    margin-bottom: 5px;
    color: #495057;
    font-size: 14px;
}

/* Mempercantik kotak Input dan Textarea */
input[type="text"], textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    font-size: 15px;
    box-sizing: border-box; /* Memastikan padding tidak merusak lebar elemen */
    margin-bottom: 5px;
    transition: border-color 0.15s, box-shadow 0.15s;
    background-color: #fdfdfd;
}

/* Efek fokus saat kolom input diklik mahasiswa */
input[type="text"]:focus, textarea:focus {
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25);
    background-color: #ffffff;
}

/* Mengatur tinggi khusus untuk textarea alamat */
textarea {
    height: 100px;
    resize: vertical; /* Izinkan ditarik ke bawah saja */
}

/* Tombol Simpan / Update Data */
button[type="submit"] {
    background-color: #28a745;
    color: #ffffff;
    border: none;
    padding: 11px 24px;
    font-size: 15px;
    font-weight: 500;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.15s;
}

button[type="submit"]:hover {
    background-color: #218838;
}

Cara Menggunakan Aplikasi CRUD PHP MySQL

Ekstrak file yang di download di folder htdocs Xampp.
Buka phpmyadmin dan import database kampus.sql yang ikut dalam file yang kamu download
Jalankan di http://localhost/crud-mahasiswa (Sesuaikan alamatnya sesuai folder di htdocs tempat kamu menyimpan filenya)

Berikut link download CRUD PHP Mysql sederhana ini, semoga bermanfaat.

Download Source Code

Apa Saja yang Akan Kita Buat?

Keunggulan Source Code Ini:

Langkah-langkah membuat aplikasi CRUD PHP MySQL

Langkah 1: Siapkan Database MySQL

Langkah 2: Buat Kodingan Sistem (5 File Esensial)

1. koneksi.php (Penghubung ke Database)

2. index.php (Read – Menampilkan Data)

3. tambah.php (Create – Formulir Tambah Data)

4. edit.php (Update – Formulir Ubah Data)

5. hapus.php (Delete – Proses Eksekusi Hapus)

6. style.css (Percantik tampilan aplikasi)