Sekolah Kode: CSS

Showing posts with label CSS. Show all posts

Membuat Hover Effect pada button di CSS

By Bagas Topati

Read

0 Comments

Read More Add comment

Membuat CRUD dengan OOP pada PHP dan MySQL

By Bagas Topati

Read

0 Comments

Selamat Malam Semua,

Pada malam yang cerah ini kita akan membahas tentang CRUD dengan OOP pada PHP dan MySQL berikut adalah sekilas penampakan aplikasi yang akan kita buat

Bagi yang belum tau apa itu OOP , akan saya jelaskan sedikit,

OOP ada singkatan dari OBJECT ORIENTED PROGRAMMING , tujuan dari OOP adalah memudah kan pengembangan suatu program.

Itu adalah penjelasan singkat tentang OOP dari saya.

sebelum kita mulai mari kita buat database terlebih dahulu yaitu dbtutor dan selanjut buat table untuk database tersebut dengan nama tbuser dengan struktur sebagai berikut.

Bila sudah membuat database diatas mari kita buat struktur file untuk topik kali kita ini, seperti berikut

Saya akan jelaskan sedikit tentang, stuktur file diatas,

Folder utama kita ada CRUD jadi nnti kita akan masukan url sebagai berikut http://localhost/CRUD.

Folder css adalah tempat meletakkan file css.

Folder Inc adalah tempat meletakkan file yang berhubungan dengan konfigurasi database.

Folder page adalah tempat meletakkan file file yang akan di tampilkan secara dinamis.

Folder images adalah tempat menempatkan gambar - gambar.

Dengan struktur file yang rapi memudah kan kita untuk mengembangkan aplikasi, dan menejemen file.

bila sudah dibuat pertama yang kita lakukan adalah mengisi file koneksi.php yang berada di folder inc.

koneksi.php

<?php

//mendeklarasikan HOST

define('HOST', 'localhost');

//mendeklarasikan user database

define('USERDB', 'root');

//mendeklarasikan password database

define('PASSDB', '');

//mendeklarasikan nama database

define('DB', 'dbtutor');

//membuat class database

class Database{

private $mysql;

public function __construct()

{

// menghubungkan PHP dengan MySQL

return $this->mysql = new mysqli(HOST, USERDB, PASSDB, DB);

}

// meengambil seluruh data pada table

public function getData($table = "")

{

$sql = "SELECT * FROM " . $table;

$query = $this->mysql->query($sql);

$reply = [];

while($data = $query->fetch_assoc())

{

$reply[] = $data;

}

return $reply;

}

// mengambil satu data pada table

public function getSingleData($table = "", $field = "", $keyword = "")

{

$sql = "SELECT * FROM " . $table . " WHERE " . $field . "='" . $keyword . "'";

$query = $this->mysql->query($sql);

$data = $query->fetch_assoc();

return $data;

}

// memasukan data ke dalam database

public function insertData($table = "", $username = "", $password = "", $level = "")

{

$sql = "INSERT INTO " . $table . " VALUES ('','" . $username . "', '" . $password . "', '" . $level . "')";

$query = $this->mysql->query($sql);

if(!$query)

{

echo "tidak dapat menyimpan, <a href='index.php'> Kembali</a>";

}

else

{

header('location: index.php');

}

// menghapus data

public function updateData($table = "", $username = "", $password = "", $level = "", $field = "", $keyword = "")

{

$sql = "UPDATE " . $table . " SET username='" . $username . "', password='" . $password . "', level='" . $level . "' WHERE " . $field . "='" . $keyword . "'";

$query = $this->mysql->query($sql);

if(!$query)

{

echo "tidak dapat memperbaharui, <a href='index.php'> Kembali</a>";

}

else

{

header('location: index.php');

}

public function deleteData($table = "", $field = "", $keyword = "")

{

$sql = "DELETE FROM " . $table . " WHERE " . $field . "='" . $keyword . "'";

$query = $this->mysql->query($sql);

if(!$query)

{

echo "tidak dapat Menghapus, <a href='index.php'> Kembali</a>";

}

else

{

header('location: index.php');

}

kode didalam koneksi.php adalah kode yang berhubungan dengan konfigurasi database dan fungs CRUD yang telah kita buat dalam class Database.

bila sudah selanjutnya kita akan mengisi file index.php

index.php

<?php

// masukan koneksi.php kedalam index.php

require_once('inc/koneksi.php');

// inisialisasi class Database kedalam variable

$db = new Database();

<!DOCTYPE html>

<html>

<head>

<title>Belajar CRUD dengan OOP pada PHP</title>

</head>

<body>

<h2 class="title">Belajar CRUD dengan OOP pada PHP</h2>

<ul>

<li><a href="index.php?action=add">Tambah Data</a></li>

</ul>

</div>

<?php

// masukan default.php kedalam index.php

require_once 'page/default.php';

</div>

</body>

</html>

sampai disitu masih belum selesai karna kita belum memanggil table untuk menampilkan data yang ada pada database, halaman tambah data dan halaman edit data.

untuk menampilkan table yang menampilkan data pada databse silahkan di isi file default.php denga kode berikut.

default.php

<?php

// deklarasi variabel untuk switch

$action = @$_GET['action'];

switch ($action) {

// tambah ada

case 'add':

require_once 'add.php';

break;

// edit data

case 'edit':

require_once 'edit.php';

break;

// hapus data

case 'delete':

$id = $_GET['id'];

$db->deleteData("tbuser", "id_user", $id);

break;

// tampilan default bila parameter $_GET['action'] tidak ada

default:

<tr>

<th>Password</th>

<th>Action</th>

</tr>

<?php

// variabel untuk nomor barus

$no = 1;

// mengambil data dari database

foreach ($db->getData("tbuser") as $data):

<tr>

<a href="index.php?action=edit&id=<?php echo $data['id_user']; ?>" class="btn btn-yellow">Edit</a>

<a href="index.php?action=delete&id=<?php echo $data['id_user']; ?>" class="btn btn-orange">Delete</a>

</td>

</tr>

<?php

// tambahkan nilai variabel no dengan satu selama nilai data sama dengan true

// bila seluruh data telah di load berhenti menambah kan nilai variabel no

$no++;

endforeach;

</table>

<?php

break;

}

nah jika sudah selanjutnya mari kita buat form tambah data dan edit data

add.php

<label>Username</label>

</div>

<label>Password</label>

</div>

<label>Status</label>

<option value="administrator">Administrator</option>

</select>

</div>

</form>

<?php

// jika tombil add data ditekan lakukan proses penyimpanan

if(isset($_POST['add']))

{

$username = $_POST['username'];

$password = $_POST['password'];

$level = $_POST['level'];

// menyimpan

$db->insertData('tbuser', $username, $password, $level);

}

edit.php

<?php

// inisialisasi id

$id = $_GET['id'];

//ambil hanya satu data pada database

$data = $db->getSingleData('tbuser', 'id_user', $id);

<label>Username</label>

</div>

<label>Password</label>

</div>

<label>Status</label>

<option value="administrator" <?php if($data['level'] == "administrator"){ echo "selected"; } ?>>Administrator</option>

</select>

</div>

</form>

<?php

// update data Ketika tombol update data di klik

if(isset($_POST['update']))

{

$username = $_POST['username'];

$password = $_POST['password'];

$level = $_POST['level'];

// update data

$db->updateData('tbuser', $username, $password, $level, 'id_user', $id);

}

Dengan begini kita sudah bisa melakukan bisa membaca data, menambahkan data, mengedit data, bahkan juga menghapus data.

dan agar lebih menarik silahkan isikan script berikut kedalam style.css yang ada di folder css

style.css

padding: 0;

margin: 0;

outline: 0;

-webkit-box-sizing: border-box;

-moz-box-sizing: border-box;

box-sizing: border-box;

}

body{

font-family: arial;

font-size: 13px;

}

text-decoration: none;

}

ul,li{

list-style: none;

}

.container{

width: 960px;

margin: 0 auto;

}

.title{

margin: 20px 0px;

text-transform: uppercase;

letter-spacing: 1px;

}

.btn{

display: inline-block;

padding: 10px;

background: #53BDB7;

color: #FFF;

border: none;

cursor: pointer;

}

.btn-yellow{

background: #F0CE69 !important;

}

.btn-orange{

background: #EA9363 !important;

}

.table{

width: 100%;

border-collapse: collapse;

}

.table tr > th,

.table tr > td{

padding: 10px;

border:1px solid #53BDB7;

}

.table tr:first-child{

border-bottom: 2px solid #53BDB7;

}

.menu {

width: 100%;

background: #53BDB7;

margin-bottom: 20px;

padding: 10px;

}

.menu li{

float: left;

}

.menu::after{

content: '';

clear: both;

display: table;

}

.menu li > a{

padding: 10px;

display: inline-block;

color: #FFF;

letter-spacing: 1px

}

.form-control {

width: 100%;

margin: 10px 0px

}

.form-control > label{

display: block;

margin-bottom: 3px;

}

.form-control > .form-element{

padding: 10px;

width: 100%;

border: 1px solid #53BDB7;

}

Dengan begini aplikasi CRUD sederhana sudah kita buat menggukana OOP pada PHP dan MySQL sebagai database.

Silahkan di coba, dan bila ada yang ingin download silahkan klik link berikut Google Drive

Bila teman para sahabat sekalian punya cara atau metode lain membuat CRUD dengan OOP pada PHP dan Mysql sebagai database silahkan komen dibawah.

Bagi sahabat penulis yang sering nongkrong disini bila ingin request tutorial silahkan email ke gazkintzz96@gmail.com atau silahkan add facebook saya Bagas Topati

Terima kasih untuk malam yang indah ini, semoga artikel saya dapat membantu teman - teman sekalian