1. Home
  2. read
  3. Tutorial Membuat CRUD Native PHP dengan PDO MySQL

Tutorial Membuat CRUD Native PHP dengan PDO MySQL



Tutorial Membuat CRUD Native PHP dengan PDO MySQL


Tutorial Membuat CRUD Native PHP dengan PDO MySQL.  Halo sobat codekop.com, tak terasa sudah lama saya tidak ngepost artikel hehehe, Nah pada kesempatan kali ini saya akan membuat sebuah tutorial bagaimana caranya membuat sebuah CRUD sederhana yaitu Membuat CRUD Native PHP dan user interface nya kita pakai Framework Bootstrap.

Apa itu CRUD ?

CRUD adalah singkatan dari Create Read Update Delete, yaitu istilah untuk perintah ke database yaitu Create=INSERT, Read=SELECT, Update=UPDATE dan Delete=DELETE. Jadi di tutorial ini akan di jelaskan bagaimana membuat sebuah sistem yang nantinya bisa digunakan untuk INSERT, SELECT, UPDATE dan DELETE ke database MySQL dengan menggunakan Query SQL dan Bahasa Pemrograman PHP, dan dengan Framework Bootstrap agar tampilannya lebih bagus.

Untuk tutorial kali ini pada Bootstrap saya pakai online ya, jadi tidak saya download file bootstrapnya, langsung panggil source nya di online, kalau mau sobat bisa download sendiri dan memasukkan nya ke script.

XAMPP

Nah Pertama2 Seperti biasa buka XAMPP dan nyalakan Apache dan MySQL nya :

 

Database

langkah berikutnya anda buat database di phpmyadmin dan buat misalkan tbl_barang :

   

File PHP

lalu buat folder dan file struktur file phpnya :

   

Script koneksi.php

Buka file koneksi.php, disini kita akan buat koneksi dulu dari php ke database ya bro, jadi file ini akan di includekan kesemua file php nanti nya agar dapat terhubung ke database :

<?php
	$user  = 'root';
	$pass = '';
	try {
		// buat koneksi dengan database
		$koneksi = new PDO('mysql:host=localhost;dbname=tutorial_barang;',$user,$pass);
		// set error mode
		$koneksi->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );
	}catch (PDOException $e) {
		// tampilkan pesan kesalahan jika koneksi gagal
		print "Koneksi atau query bermasalah : " . $e->getMessage() . "<br/>";
		die();
	}
	
?>

 

Script index.php CRUD

Setelah kita membuat database dan koneksi ke database mysql server, langkah selanjutnya isi script file index.php yang digunakan untuk menampilkan list data dari tbl_barang. Untuk skripnya adalah sebagai berikut :

<?php
	require_once('koneksi.php');
?>
<!DOCTYPE HTML>
<html>
	<head>
		<title>Tutorial Membuat CRUD Native PHP dengan PDO MySQL</title>
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
	</head>
	<body>
		<div class="container">
			<div class="row">
				 <div class="col-lg-12">
				 <br/>
				 <a href="tambah.php" class="btn btn-success btn-md"><span class="fa fa-plus"></span> Tambah</a>
				 <table class="table table-hover table-bordered" style="margin-top: 10px">
					<tr class="success">
						<th width="50px">No</th>
						<th>Nama Barang</th>
						<th>Stok</th>
						<th>Harga Barang</th>
						<th>Tanggal Masuk</th>
						<th style="text-align: center;">Actions</th>
					</tr>
					 <?php
						$sql = "SELECT * FROM tbl_barang";
						$row = $koneksi->prepare($sql);
						$row->execute();
						$hasil = $row->fetchAll();
						$a =1;
						foreach($hasil as $isi){
					 ?>
					<tr>
						<td><?php echo $a ?></td>
						<td><?php echo $isi['nama_barang']?></td>
						<td><?php echo $isi['stok'];?></td>
						<td><?php echo $isi['harga_barang'];?></td>
						<td><?php echo $isi['tgl_masuk'];?></td>
						<td style="text-align: center;">
							<a href="edit.php?id=<?php echo $isi['id_barang'];?>" class="btn btn-success btn-md">
							<span class="fa fa-edit"></span></a>
							<a onclick="return confirm('Apakah yakin data akan di hapus?')" href="hapus.php?id=<?php echo $isi['id_barang'];?>" 
							class="btn btn-danger btn-md"><span class="fa fa-trash"></span></a>
						</td>
					</tr>
					<?php
						$a++;
						}
					?>
				 </table>
			  </div>
			</div>
		</div>
	</body>
</html>

hasil script index.php akan menghasilkan tampilan seperti ini :

   

Script tambah.php CRUD

Tahapan selanjutnya membuat script tambah.php, file ini berisi form untuk input data dan proses menambah data pada tbl_barang :

<?php
require_once('koneksi.php');

	// berikut script untuk proses tambah barang ke database 
	if(!empty($_POST['nama_barang'])){
		// menangkap data post 
		$nama_barang = $_POST['nama_barang'];
		$stok = $_POST['stok'];
		$harga = $_POST['harga'];
		$tanggal = $_POST['tanggal'];
		
		$data[] = $nama_barang;
		$data[] = $stok;
		$data[] = $harga;
		$data[] = $tanggal;
		
		// simpan data barang
		
		$sql = 'INSERT INTO tbl_barang (nama_barang,stok,harga_barang,tgl_masuk)VALUES (?,?,?,?)';
		$row = $koneksi->prepare($sql);
		$row->execute($data);
		
		// redirect
		echo '<script>alert("Berhasil Tambah Data");window.location="index.php"</script>';
	}
?>
<!DOCTYPE HTML>
<html>
	<head>
		<title>Tambah Barang</title>
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
	</head>
	<body>
		<div class="container">
			 <br/>
			 <h3>Tambah Barang</h3>
			 <br/>
			<div class="row">
				 <div class="col-lg-6">
					 <form action="" method="POST">
						 <div class="form-group">
							 <label>Nama Barang</label>
							 <input type="text" value="" class="form-control" name="nama_barang">
						 </div>
						 <div class="form-group">
							 <label>Stok</label>
							 <input type="number" value="" class="form-control" name="stok">
						 </div>
						 <div class="form-group">
							 <label>Harga Barang</label>
							 <input type="text" value="" class="form-control" name="harga">
						 </div>
						 <div class="form-group">
							 <label>Tanggal</label>
							 <input type="date" value="" class="form-control" name="tanggal">
						 </div>
						 <button class="btn btn-primary btn-md" name="create"><i class="fa fa-plus"> </i> Create</button>
					 </form>
				  </div>
			</div>
		</div>
	</body>
</html>
	
	

Tampilan script tambah barang seperti ini :

   

Script edit.php CRUD

Selanjutnya kita buat file edit.php untuk menampilkan form edit data untuk tabel tbl_barang. Berikut adalah contoh skripnya.

<?php
require_once('koneksi.php');
	
	// berikut script untuk proses edit barang ke database 
	if(!empty($_POST['nama_barang'])){
		// menangkap data post 
		$nama_barang = $_POST['nama_barang'];
		$stok = $_POST['stok'];
		$harga = $_POST['harga'];
		$tanggal = $_POST['tanggal'];
		$id = $_POST['id_barang'];
		
		$data[] = $nama_barang;
		$data[] = $stok;
		$data[] = $harga;
		$data[] = $tanggal;
		$data[] = $id;
		
		// simpan data barang
		
		$sql = 'UPDATE tbl_barang SET nama_barang=?,stok=?,harga_barang=?,tgl_masuk=? WHERE id_barang=?';
		$row = $koneksi->prepare($sql);
		$row->execute($data);
		
		// redirect
		echo '<script>alert("Berhasil Edit Data");window.location="index.php"</script>';
	}
	// untuk menampilkan data barang berdasarkan id barang
	$id = $_GET['id'];
	$sql = "SELECT *FROM tbl_barang WHERE id_barang= ?";
	$row = $koneksi->prepare($sql);
	$row->execute(array($id));
	$hasil = $row->fetch();
?>
<!DOCTYPE HTML>
<html>
	<head>
		<title>Edit Barang - <?php echo $hasil['nama_barang'];?></title>
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
	</head>
	<body>
		<div class="container">
			 <br/>
			 <h3>Edit Barang - <?php echo $hasil['nama_barang'];?></h3>
			 <br/>
			<div class="row">
				 <div class="col-lg-6">
					 <form action="" method="POST">
						 <div class="form-group">
							 <label>Nama Barang</label>
							 <input type="text" value="<?php echo $hasil['nama_barang'];?>" class="form-control" name="nama_barang">
						 </div>
						 <div class="form-group">
							 <label>Stok</label>
							 <input type="number" value="<?php echo $hasil['stok'];?>" class="form-control" name="stok">
						 </div>
						 <div class="form-group">
							 <label>Harga Barang</label>
							 <input type="text" value="<?php echo $hasil['harga_barang'];?>" class="form-control" name="harga">
						 </div>
						 <div class="form-group">
							 <label>Tanggal</label>
							 <input type="date" value="<?php echo $hasil['tgl_masuk'];?>" class="form-control" name="tanggal">
						 </div>
						 <input type="hidden" value="<?php echo $hasil['id_barang'];?>" name="id_barang">
						 <button class="btn btn-primary btn-md" name="create"><i class="fa fa-edit"> </i> Update</button>
					 </form>
				  </div>
			</div>
		</div>
	</body>
</html>
	
	

Berikut tampilan untuk edit.php barang :

   

Script hapus.php CRUD

Selanjutnya kita buat file hapus.php untuk menghapus data pada tabel tbl_barang. Berikut adalah contoh skripnya.

<?php
require_once('koneksi.php');
	// untuk Hapus data barang berdasarkan id barang
	$id = $_GET['id'];
	$sql = "DELETE FROM tbl_barang WHERE id_barang= ?";
	$row = $koneksi->prepare($sql);
	$row->execute(array($id));
	
	echo '<script>alert("Berhasil Hapus Data");window.location="index.php"</script>';
?>

Uji Coba

Setelah kita membuat skrip di atas, kita mulai uji coba project ini. Pertama kita buka file index dengan penampakan sebagai berikut.

   

Lalu kita uji coba Tambah Barang :

   

Lalu kita uji coba edit barang.

   

Dan Kita tes juga Hapus data nya :

   

Selesai, Silahkan di praktekan sendiri ya bro, usahakan scriptnya di ketik saja agar lebih mudah dipahami :D

Sekian tutorial dari saya ini, semoga dapat bermanfaat. Terima Kasih sudah mampir di blog codekop.

 

Salam hangat,

https://www.codekop.com/

 



Fauzan Falah

Penulis https://codekop.com/ , http://maswin.id/ | Github : https://github.com/fauzan1892/ | portfolio : https://fauzan.codekop.com/

Profil Penulis Semua Postingan


Komentar