Selamat datang di website CopypasteKode, Pada tutorial sebelumnya kita telah berhasil membuat database beserta table dan pada tutorial kali ini kita akan masuk pada seri tutorial part #2 yaitu membuat folder project dan koneksi database.
Karena tutorial kali merupakan tutorial bersambung, maka dari itu saya sarankan teman-teman yang mengikuti tutorial ini agar mulai dari tutorial part #1 hingga selesai, agar teman-teman tidak mengalami kesulitan dalam mengikuti seri tutorial kali ini, berikut adalah seri tutorial sebelumnya :
Disini saya mengasumsikan teman-teman sudah mengikuti seri tutorial part #1 Database & Koneksi Database sebelumnya pada link diatas.
Seperti biasa sebelum kita masuk pada tutorial, penting untuk mengetahui prosedur atau langkah-langkah yang akan kita lakukan pada tutorial kali ini, dengan tujuan tutorial-nya lebih mudah dipahami dan lebih terstruktur, berikut langkah-langkah-nya :
- Membuat Folder Project didalam folder xampp/htdocs
- Membuat Koneksi Database
Tanpa perlu berlama-lama langsung saja kita mulai dengan langkah yang pertama.
Membuat folder Project didalam folder xampp/htdocs
Jika teman-teman sudah menginstall xampp, teman-teman silahkan cari folder dengan nama xampp ditempat teman-teman menginstall xampp sebelumnya.
Buka folder xampp/htdocs, kemudian tambahkan folder dengan nama crud, seperti petunjuk berikut :
Koneksi Database
Jika sudah membuat folder dengan nama crud didalam folder xampp/htdocs, setelah itu buka code editor visual studio code, lalu buka folder project crud seperti petunjuk gambar berikut :
klik menu file kemudian pilih opsi Open Folder lalu cari folder project crud yang telah kita buat tadi didalam folder xampp/htdocs.
Jika sudah tampil seperti gambar diatas, berarti kita sudah berhasil menjalakan project crud kita dengan menggunakan visual studio code, kemudian tambahkan file baru dengan cara arahkan cursor teman-teman pada nama folder project crud, lalu klik logo / icon new file disebelah nama project crud , seperti contoh gambar berikut :
Lalu tambahkan file dengan nama koneksi.php, seperti berikut :
Setelah itu tambahkan script berikut pada file koneksi.php :
<?php
$host = "localhost";
$user = "root";
$password = "";
$db = "db_crud";
$kon = mysqli_connect($host, $user, $password, $db);
if (!$kon) {
die("Koneksi gagal:" . mysqli_connect_error());
}
Maka file koneksi.php akan menjadi seperti berikut :
 |
| koneksi.php |
Setelah selesai membuat koneksi database, sekarang kita akan mencoba menampilkan data dari database.
Buat file baru dengan nama index.php, caranya sama seperti menambahkan file koneksi.php diatas
Kemudian tambahkan script dibawah pada file index.php
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Data Mahasiswa Pdf</title>
<style type="text/css">
table {
font-family: verdana, arial, sans-serif;
font-size: 11px;
border-width: 1px;
border-color: #000;
border-collapse: collapse;
}
thead {
text-transform: capitalize;
}
.alert {
font-weight: bold;
}
</style>
</head>
<body>
<center>
<font face="" color="black">
<h2 align="center" style="text-transform:uppercase"><u>Testing data dari database</u></h2>
</font>
</center>
<table bordered border="1" style="width: 100%" align="center">
<thead align="center" style="background-color: aqua;">
<tr>
<th style="width: 1%;">No</th>
<th style="width: 5%;">nim</th>
<th style="width: 10%;">nama</th>
<th style="width: 5%;">jenis kelamin</th>
<th style="width: 10%;">Tempat, Tanggal Lahir</th>
<th style="width: 5%;">prodi</th>
</tr>
</thead>
<tbody>
<?php
$no = 1;
include "koneksi.php";
$sql = "select * from tbl_mahasiswa order by nim desc";
$hasil = mysqli_query($kon, $sql);
if (empty($data = mysqli_fetch_array($hasil))) {
echo '<td colspan="6">
<div align="center" class="alert">
Data tidak ditemukan
</div>
</td>';
}
while ($data = mysqli_fetch_array($hasil)) {
$nim = $data['nim'];
$nama = $data['nama'];
$jenis_kelamin = $data['jenis_kelamin'];
$tempat_lahir = $data['tempat_lahir'];
$tanggal_lahir = $data['tanggal_lahir'];
$prodi = $data['prodi'];
?>
<tr style="text-align: center;" class="text-gray-900">
<td style="width: 1%;"><?= $no++; ?></td>
<td class="text-capitalize"><?= $nim; ?></td>
<td class="text-capitalize"><?= $nama; ?></td>
<td><?= $jenis_kelamin; ?></td>
<td class="text-capitalize"><?= $tempat_lahir; ?>, <?= $tanggal_lahir; ?></td>
<td><?= $prodi; ?></td>
</tr>
<?php } ?>
</tbody>
</table>
</body>
</html>
Buka web browser kesayangan teman-teman kemudian kunjungi / akses URL berikut : http://localhost/crud/ , dan pastikan Apache & MySQL dalam keadaan aktif seperti petunjuk gambar diberikut :
Jika teman-teman sudah mengikuti semua langkah-langkah diatas tanpa ada yang terlewat harusnya akan tampil seperti berikut :
Sampai disini kita telah berhasil membuat project php kita dan telah terkoneksi dengan database serta menampilkan data dari database pada halaman web browser seperti gambar diatas.
Saya kira cukup sekian tutorial kali ini, jika ada yang ingin teman-teman tanyakan jangan ragu untuk bertanya pada kolom komentar dan sampai jumpa pada tutorial part-part selanjutnya semoga bermanfaat bye...byee ^^
Tags
PHP