Tutorial CRUD, Search, Upload data, dan Login Multirole menggunakan PHP PDO MYSQL


Halo semua disini saya ingin berbagi tutorial tentang web developer lagi yaitu membuat CRUD. kalau dipostingan sebelumnya menggunakna PHP dan MYSQL sekarang saya membuat versi PHP PDO apa itu?. PDO (Php Data Object) adalah interface universal yang disediakan PHP untuk “berkomunikasi” dengan database server. maksud interfave universal adalah tidak terikat pada satu aplikasi misal tidak terikat pada database mysql saja bisa menggunakan database lain seperti sql server, sqllite, firebird, dan lain lain. dan tentunya pada tutorial ini gak hanya CRUD saja melainkan seperti kemarin ada searcing, login multirole dan juga tambahan upload file atau gambar.

Berikut adalah aplikasi yang harus disediakan sebelum ke langkah langkahnya untuk mengikuti tutorial ini.
  1. Web Server : XAMPP
  2. Code Editor : Visual Studio Code
  3. Web Browser : Google Chrome
Setelah itu langsung kelangkah pembuatannya berikut ini.
  1. Pertama membuat database dengan nama bebas seperti yang saya contohkan "db_php_pdo" lalu buat tabel dengan atribut id, nama, alm, dan img seperti strukturnya berikut.
  2. lalu buat tabel satu lagi untuk admin dengan atribut id, user, pass, dan role.
  3. Selanjutnya buka directory "c:/xampp/htdocs" lalu buat folder dengan nama "crud_php_pdo" lalu didalamnya buat struktur folder sebagai website yang kita buat nantinya seperti berikut.
  4. Selanjutnya pada file index.php ketikan code berikut agar berfungsi sebagai file yang di panggil pertama kali pada saat website berjalan nantinya.
    <?php
    @session_start();
    require "config/database.php";
    if (@$_SESSION['admin'] || @$_SESSION['user']) {
    ?>
        <!DOCTYPE html>
        <html lang="en">
    
        <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>Document</title>
            <link rel="stylesheet" href="assets/style.css">
        </head>
    
        <body>
            <div class="container">
    
                <div class="header">
                    Crud PDO
                </div>
                <div class="content">
    
                <?php
                    if (@$_SESSION['admin']) {
                        $user_terlogin = @$_SESSION['admin'];
                    } else if (@$_SESSION['user']) {
                        $user_terlogin = @$_SESSION['user'];
                    }
    
                    $query = "SELECT * FROM admin where id = '$user_terlogin'";
                    $sql_user = $db->prepare($query);
                    $sql_user->execute();
                    $data_user = $sql_user->fetch(PDO::FETCH_OBJ);
                    echo "Selamat datang : " . $data_user->user . " <a href='config/logout.php'>Logout</a></br></br>";
                    ?>
                    
    
                    <?php
    
                    $page = @$_GET['page'];
    
                    if (@$_SESSION['admin']) {
                        if ($page == '' || $page == 'home') {
                            require "pages/tampil.php";
                        } else if ($page == 'tambah') {
                            require "pages/tambah.php";
                        } else if ($page == 'ubah') {
                            require "pages/ubah.php";
                        } else if ($page == 'hapus') {
                            require "pages/hapus.php";
                        }
                    } else if (@$_SESSION['user']) {
                        if ($page == '' || $page == 'home') {
                            require "pages/home.php";
                        }
                    }
    
    
                    
                    ?>
    
                </div>
                <div class="footer">
                    @copyright2020 - By:jodykridoblog.blogspot.com
                </div>
            </div>
    
        </body>
    
        </html>
    <?php
    } else {
        header("location: login.php");
    }
    ?>
    
  5. lalu di file login.php ketikan code berikut yang nantinya sebagai halaman login.
    <?php
    @session_start();
    include "config/database.php";
    
    if (@$_SESSION['admin'] || @$_SESSION['user']) {
        header("location:index.php");
    } else {
    
    ?>
        <!DOCTYPE html>
        <html lang="en">
    
        <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>Document</title>
            <link rel="stylesheet" href="assets/style.css">
        </head>
    
        <body>
            <div class="container">
                <div class="header">
                    Login
                </div>
                <div class="content">
    
                    <form action="" method="post">
                        <table class="tbl">
                            <tr>
                                <td>Username</td>
                                <td>:</td>
                                <td><input type="text" name="user" id="user" required></td>
                            </tr>
                            <tr>
                                <td>Password</td>
                                <td>:</td>
                                <td><input type="password" name="pass" id="pass" required></td>
                            </tr>
                            <tr>
                                <td colspan="2"></td>
                                <td>
                                    <input type="submit" name="login" value="Login" id="login" class="btn-primary">
                                </td>
                            </tr>
                        </table>
                        <?php
                        $user = @$_POST['user'];
                        $pass = md5(@$_POST['pass']);
                        $login = @$_POST['login'];
    
                        if (isset($login)) {
                            if ($user == "" || $pass == "") {
                        ?> <script type="text/javascript">
                                    alert("Username atau password tidak boleh kosong");
                                </script><?php
                                        } else {
                                            
                                            $sql = "SELECT * FROM admin where user = '$user' and pass = '$pass'"; 
                                            $stmt = $db->prepare($sql); 
                                            $stmt->execute(); 
                                            $data = $stmt->fetch(PDO::FETCH_OBJ);
                                            $cek = $stmt->rowCount(); 
                                            if ($cek >= 1) {
                                                if ($data->role == "admin") {
                                                    @$_SESSION['admin'] = $data->id;
                                                    header("location: index.php");
                                                } else if ($data->role == "user") {
                                                    @$_SESSION['user'] = $data->id;
                                                    header("location: index.php");
                                                }
                                            } else {
                                                echo "login gagal";
                                            }
                                        }
                                    }
                                            ?>
                    </form>
    
                </div>
                <div class="footer">
                    @copyright2020
                </div>
            </div>
    
        </body>
    
        </html>
    <?php
    }
    ?>
    
  6. Selanjutnya pada folder assets tedapat file style.css yang berfungsi untuk memperindah file website.
    * body{
        font-family: Arial, Helvetica, sans-serif;
    }
    .container{
        background-color: aliceblue;
        max-width: 900px;
        margin: auto;
    }
    
    .header{
        background-color: orangered;
        padding: 20px;
        font-weight: bold;
        text-align: center;
    }
    .content{
        padding: 20px;
        background-color: whitesmoke;
    }
    a{
        text-decoration: none;
        color: black;
    }
    .btn-primary{
        background-color: blue;
        color: white;
        padding: 5px;
        border-radius: 5px;
        border: 0px;
    }
    .btn-warning{
        background-color: orange;
        color: black;
        padding: 5px;
        border-radius: 5px;
    }
    .btn-danger{
        background-color: red;
        color: white;
        padding: 5px;
        border-radius: 5px;
    }
    .footer{
        background-color: orangered;
        padding: 20px;
        text-align: center;
    }
    
    table {
        width: 100%;
        border-collapse: collapse;
    }
    td{
        padding: 10px;
    }
    th{
        background-color: teal;
    }
    
  7. Selanjutnya pada folder config terdapat file databsae.php sebagai koneksi ke databasenya ketikan code berikut.
    <?php 
    $db = new PDO('mysql:host=localhost;dbname=db_php_pdo', 'root', '');
    ?>
    
  8. Lalu pada folder yang sama terdapat file logout.php sebagai fungsi logout nanti ketikan code berikut.
    <?php
    @session_start();
    session_destroy();
    header("location: /crud_php_pdo/login.php");
    ?>
    
  9. Selanjutnya pada folder img di kosongkan saja karena itu nanti sebagai tempat file gambar yang kita upload nanti.
  10. Selanjutnya pada folder pages terdapat file home.php sebagai halaman utama ketika login sebagai user. Ketikan code berikut.
    <h1>Selamat datang <?php echo $data_user->user ?> di halaman user</h1>
    <p>
        ini adalah halaman utaman yang bisa di akses oleh user
    </p>
    
  11. lalu terdapat file tampil.php berfungsi sebagai halaman utama ketika login sebagai admin dan tampil data. Ketikan code berikut.
    <a href="?page=tambah" class="btn-primary">Tambah data</a><br><br>
    <form action="" method="post">
        <table class="tbl">
            <tr align="right">
                <td><input type="text" name="cari" id="cari" placeholder="Cari Nama" ><input type="submit" name="btn" id="btn"></td>
            </tr>
        </table>
    </form>
    
    <table border="1">
        <thead>
            <tr>
                <th>No</th>
                <th>Foto</th>
                <th>Nama</th>
                <th>Alamat</th>
                <th>Opsi</th>
            </tr>
        </thead>
        <tbody>
            <?php
            $no = 1;
            
            $cari = @$_POST['cari'];
            $btn = @$_POST['btn'];
    
            if(isset($btn)){
                $query = "SELECT * from mahasiswa where nama like '%$cari%'";
            } else { 
                $query = "SELECT * from mahasiswa";
            }
    
            $data = $db->prepare($query);
            $data->execute();
            while ($person = $data->fetch(PDO::FETCH_OBJ)) {
            ?>
                <tr>
                    <td align="center"><?php echo $no++; ?></td>
                    <td align="center"> <img height="50px" src="img/<?php echo $person->img ?>" alt=""></td>
                    <td><?php echo $person->nama ?></td>
                    <td><?php echo $person->alm ?></td>
                    <td align="center" style="width:100px;">
                        <a href="?page=ubah&id=<?php echo $person->id ?>" class="btn-warning">Edit</a>
                        <a onclick="return confirm('Anda yakin ingin Menghapus data ini ?')" href="?page=hapus&id=<?php echo $person->id ?>" class="btn-danger">Hapus</a>
                    </td>
                </tr>
    
            <?php
    
            }
            ?>
        </tbody>
    </table>
    
  12. lalu terdapat file tambah.php berfungsi sebagai tambah data. Ketikan code berikut.
    <form action="" method="post" enctype="multipart/form-data">
        <table class="tbl">
            <tr>
                <td>Nama</td>
                <td>:</td>
                <td><input type="text" name="nama" id="nama" required></td>
            </tr>
            <tr>
                <td>Alamat</td>
                <td>:</td>
                <td><input type="text" name="alm" id="alm" required></td>
            </tr>
            <tr>
                <td>Gambar</td>
                <td>:</td>
                <td><input type="file" name="file" id="file"></td>
            </tr>
            <tr>
                <td colspan="2"></td>
                <td>
                    <input type="submit" name="simpan" value="Simpan" id="simpan" class="btn-primary">
                </td>
            </tr>
        </table>
    </form>
    <?php
    
    $nama = @$_POST['nama'];
    $alm = @$_POST['alm'];
    
    $simpan = @$_POST['simpan'];
    
    if (isset($simpan)) {
        $temp = $_FILES["file"]["tmp_name"];
        $img = rand(0, 9999) . $_FILES["file"]["name"];
        move_uploaded_file($temp, "img/" . $img);
        $query  = "INSERT into mahasiswa values ('','$nama','$alm','$img')";
        $sql   = $db->prepare($query); //Menyiapkan query SQL
        $sql->execute();               //Menjalankan query SQL
    
    ?>
        <script type="text/javascript">
            window.location.href = "?page=home";
        </script>
        <?php
        if ($sql === false) {
        ?>
            <script>
                alert("gagal simpan data!");
            </script>
    <?php
        }
    }
    ?>
    
  13. lalu terdapat file ubah.php berfungsi untuk mengedit atau update data. ketikan code berikut.
    <?php
    $id = @$_GET['id'];
    $query = "SELECT * from mahasiswa where id = '$id'";
    $data = $db->prepare($query);
    $data->execute();
    
    $person = $data->fetch(PDO::FETCH_OBJ);
    ?>
    
    <form action="" method="post" enctype="multipart/form-data">
        <table class="tbl">
            <tr>
                <td>Nama</td>
                <td>:</td>
                <td><input type="text" name="nama" id="nama" required value="<?php echo $person->nama; ?>"></td>
            </tr>
            <tr>
                <td>Alamat</td>
                <td>:</td>
                <td><input type="text" name="alm" id="alm" required value="<?php echo $person->alm; ?>"></td>
            </tr>
            <tr>
                <td>Gambar</td>
                <td>:</td>
                <td><input type="file" name="file" id="file"></td>
            </tr>
            <tr>
                <td colspan="2"></td>
                <td>
                    <input type="submit" name="ubah" value="Simpan" id="ubah" class="btn-primary">
                </td>
            </tr>
        </table>
    </form>
    
    <?php
    
    $nama = @$_POST['nama'];
    $alm = @$_POST['alm'];
    $ubah = @$_POST['ubah'];
    
    if (isset($ubah)) {
        if (empty($_FILES["file"]["name"])) {
            $query = "UPDATE mahasiswa set nama = '$nama', alm = '$alm' where id = '$id'";
        } else {
            $temp = $_FILES["file"]["tmp_name"];
            $img = rand(0, 9999) . $_FILES["file"]["name"];
            unlink("img/" . $person->img);
            move_uploaded_file($temp, "img/" . $img);
            $query = "UPDATE mahasiswa set nama = '$nama', alm = '$alm', img = '$img' where id = '$id'";
        }
    
        $sql  = $db->prepare($query);
        $sql->execute();
    
    ?>
        <script type="text/javascript">
            window.location.href = "?page=home";
        </script>
        <?php
        if ($sql === false) {
        ?>
            <script>
                alert("gagal simpan data!");
            </script>
    <?php
        }
    }
    ?>
    
  14. lalu terdapat file delete.php berfungsi untuk hapus data. ketikan code berkut.
    <?php
    $id = @$_GET['id'];
    
    $query = "SELECT * from mahasiswa where id = '$id'";
    $data = $db->prepare($query);
    $data->execute();
    $person = $data->fetch(PDO::FETCH_OBJ);
    unlink("img/" . $person->img);
    
    $query = "delete from mahasiswa where id = '$id'";
    $sql  = $db->prepare($query);
    $sql->execute();
    
    ?>
    <script type="text/javascript">
        window.location.href = "?page=home";
    </script>
    <?php
    if ($sql === false) {
    ?>
        <script>
            alert("gagal hapus data!");
        </script>
    <?php
    }
    ?>
    
  15. Ok sekarang selesai silahkan di lihat hasinya di browser dengan mengetikan "localhost/crud_php_pdo".
Diatas adalah tutorialnya jika kalian ingin mendapatkan cource codenya silahkan klik link di bawah ini.


Mungkin itu saja dari saya jika ada kekurangan atau kurang paham postingan ini silahkan komentar dibawah.
Terimakasih.

Posting Komentar

1 Komentar