Fitri Hy
Membuat Sistem CRUD Sederhana dengan Upload Gambar di PHP
Dalam pengembangan aplikasi berbasis web, CRUD (Create, Read, Update, Delete) adalah salah satu fungsi paling dasar yang harus ada. Di tutorial ini, kita akan belajar membuat sistem CRUD menggunakan PHP dan MySQL yang dilengkapi dengan fitur upload gambar.
Kita akan membuat sebuah aplikasi sederhana untuk menambahkan, menampilkan, mengedit, dan menghapus data, serta mengelola upload gambar menggunakan PHP. Mari kita mulai!
Prasyarat
Sebelum memulai, pastikan Anda memiliki:
- PHP dan MySQL yang sudah terinstal.
- Apache atau server lokal (seperti XAMPP, WAMP, atau LAMP).
- Pengetahuan dasar tentang PHP, HTML, dan MySQL.
Langkah 1: Membuat Database dan Tabel
Langkah pertama adalah membuat database di MySQL untuk menyimpan data beserta gambar.
Buka MySQL dan buat database baru:
CREATE DATABASE tutorial_crud;
Buat tabel di dalam database tersebut:
CREATE TABLE products (
id INT(11) AUTO_INCREMENT PRIMARY KEY,
name VARCHAR(100) NOT NULL,
description TEXT,
image VARCHAR(255) NOT NULL,
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);
Tabel products akan menyimpan informasi produk seperti nama, deskripsi, dan nama file gambar yang diupload.
Langkah 2: Setup Struktur Folder
Buat struktur folder proyek Anda seperti berikut ini:
crud_upload/
│
├── uploads/ # Folder untuk menyimpan gambar
├── index.php # Halaman utama (Read)
├── create.php # Halaman untuk menambah produk (Create)
├── edit.php # Halaman untuk mengedit produk (Update)
├── delete.php # Proses penghapusan produk (Delete)
└── db.php # Koneksi database
Langkah 3: Koneksi Database
Buat file db.php yang akan kita gunakan untuk menghubungkan PHP dengan MySQL.
<?php
$host = "localhost";
$user = "root";
$password = "";
$dbname = "tutorial_crud";
$conn = new mysqli($host, $user, $password, $dbname);
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
?>
Langkah 4: Membuat Fungsi Create (Menambahkan Data)
Buat halaman create.php untuk menambah produk baru dan mengupload gambar.
<?php
include 'db.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$name = $_POST['name'];
$description = $_POST['description'];
$image = $_FILES['image']['name'];
$target = "uploads/" . basename($image);
if (move_uploaded_file($_FILES['image']['tmp_name'], $target)) {
$sql = "INSERT INTO products (name, description, image) VALUES ('$name', '$description', '$image')";
if ($conn->query($sql)) {
echo "Product added successfully.";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
} else {
echo "Failed to upload image.";
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Add Product</title>
</head>
<body>
<h2>Add New Product</h2>
<form action="create.php" method="POST" enctype="multipart/form-data">
<label for="name">Product Name:</label><br>
<input type="text" name="name" required><br><br>
<label for="description">Description:</label><br>
<textarea name="description" required></textarea><br><br>
<label for="image">Image:</label><br>
<input type="file" name="image" required><br><br>
<input type="submit" value="Add Product">
</form>
</body>
</html>
Kode di atas memungkinkan pengguna mengunggah gambar produk ke folder uploads/ dan menyimpan nama gambar serta detail produk ke dalam database.
Langkah 5: Membuat Fungsi Read (Menampilkan Data)
Buat halaman index.php untuk menampilkan daftar produk yang sudah diupload.
<?php
include 'db.php';
$sql = "SELECT * FROM products";
$result = $conn->query($sql);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Product List</title>
</head>
<body>
<h2>Product List</h2>
<a href="create.php">Add New Product</a>
<table border="1">
<tr>
<th>ID</th>
<th>Product Name</th>
<th>Description</th>
<th>Image</th>
<th>Actions</th>
</tr>
<?php while ($row = $result->fetch_assoc()): ?>
<tr>
<td><?php echo $row['id']; ?></td>
<td><?php echo $row['name']; ?></td>
<td><?php echo $row['description']; ?></td>
<td><img src="uploads/<?php echo $row['image']; ?>" width="100"></td>
<td>
<a href="edit.php?id=<?php echo $row['id']; ?>">Edit</a>
<a href="delete.php?id=<?php echo $row['id']; ?>">Delete</a>
</td>
</tr>
<?php endwhile; ?>
</table>
</body>
</html>
Kode ini akan menampilkan data produk dalam bentuk tabel, termasuk gambar yang sudah diupload.
Langkah 6: Membuat Fungsi Update (Mengedit Data)
Buat halaman edit.php untuk mengedit data produk dan mengubah gambar jika diperlukan.
<?php
include 'db.php';
$id = $_GET['id'];
$sql = "SELECT * FROM products WHERE id=$id";
$result = $conn->query($sql);
$product = $result->fetch_assoc();
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$name = $_POST['name'];
$description = $_POST['description'];
$image = $product['image'];
if (!empty($_FILES['image']['name'])) {
$image = $_FILES['image']['name'];
$target = "uploads/" . basename($image);
move_uploaded_file($_FILES['image']['tmp_name'], $target);
}
$sql = "UPDATE products SET name='$name', description='$description', image='$image' WHERE id=$id";
if ($conn->query($sql)) {
echo "Product updated successfully.";
} else {
echo "Error: " . $conn->error;
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Edit Product</title>
</head>
<body>
<h2>Edit Product</h2>
<form action="edit.php?id=<?php echo $id; ?>" method="POST" enctype="multipart/form-data">
<label for="name">Product Name:</label><br>
<input type="text" name="name" value="<?php echo $product['name']; ?>" required><br><br>
<label for="description">Description:</label><br>
<textarea name="description" required><?php echo $product['description']; ?></textarea><br><br>
<label for="image">Image:</label><br>
<input type="file" name="image"><br><br>
<img src="uploads/<?php echo $product['image']; ?>" width="100"><br><br>
<input type="submit" value="Update Product">
</form>
</body>
</html>
Langkah 7: Membuat Fungsi Delete (Menghapus Data)
Buat file delete.php untuk menghapus produk dari database.
<?php
include 'db.php';
$id = $_GET['id'];
$sql = "DELETE FROM products WHERE id=$id";
if ($conn->query($sql)) {
echo "Product deleted successfully.";
} else {
echo "Error: " . $conn->error;
}
?>
Dengan demikian, kita sudah berhasil membuat sistem CRUD sederhana dengan fitur upload gambar menggunakan PHP dan MySQL.
Selamat mencoba!