Ahmad Faizin

"Sebarkan ilmu walau hanya satu ayat ^^"

Breaking

Saturday 31 December 2016

Membuat Login Sederhana Pada SimDesa

Assalamu'alaikum Wr. Wb. pada kesempatan kali ini saya akan meneruskan postingan sebelumnya yang masih membahas tentang Aplikasi Desa dengan SimDesa. Nah, disini saya akan berbagi tentang bagaimana cara membuat tampilan login sederhana pada SimDesa. Sebelum itu kita bahas dulu maksud pembuatan dari login pada Aplikasi Desa ini.

    A. Pengertian
        SimDesa ini adalah sebuah CMS yang mempermudah sebuah desa untuk memanagement semua administrasi desa yang disediakan oleh desa untuk masyarakatnya.
        B. Latar Belakang 
            Setelah kemarin kita sudah menginstall dan measukkan database kita sudah bisa menggunakannya. Hanya saja kita belum bisa untuk membuat sebuah user siapa saja yang akan mengakses. Jadi kita belum tahu siapa saja yang sudah merubah atau mengganti serta menambahkan beberapa perintah pada SimDesa tersebut.
            C. Maksud dan Tujuan
                Maksud dan tujuan saya membuat konfigurasi ini adalah saya ingin membuat sebuah login sederhana yang diperuntukkan agar siapa saja yang bisa mengakses SimDesa ini. Jadi tidak semua orang bisa mengakses, kita harus melewati tahap login untuk agar bisa masuk kedalam fitur fitur SimDesa.
                D. Jangka Waktu 
                    Jangka watu pelaksanaan untuk membuat sebuah tampilan login sederhana ini kurang lebih 15-20 menit.
                    E. Alat dan Bahan 
                      1. Server / PC yang suda terinstall SimDesa dan sudah memasukkan database
                      2. LAMP Server (Installed)
                      3. Beberapa script untuk tampilan login
                        F. Langkah Kerja 
                          1. Pertama pastikan kita sudah meng-install SimDesa dan LAMP Server serta sudah memasukkan database nya.

                          2. Setelah itu kita masuk pada phpmyadmin dan buat database disana. Disitu saya membuat nama databasenya dengan nama "login"


                          3. Setelah kita membuat database, kita masuk pada database yang telah kita buat dan pilih tab Structure. Kita bisa isikan seperti dibawah


                          4. Kemudian kita isikan seperti dibawah dan kita klik save untuk melanjutkan konfigurasi


                          5. Setelah itu kita buka terminal, masuk superuser, dan masuk pada direktori /var/www/html/simdesa-master/


                          6. Kemudian pada direktori tersebut kita buat file direktori untuk login. Disini saya memberi nama pada direktori tersebut dengan nama login
                          #mkdir login

                          7. Kemudian kita masuk pada direktori login tersebut
                          #cd login

                          8. Nah, disini kita memasukkan beberapa script pada beberapa file.php, pertama saya akan memasukkan script pada file index.php, sebelumnya kita masuk pada file index.php
                          #nano index.php

                          9. Nah pada file index.php ini kita masukkan beberapa script. Kalian bisa copy paste scriptnya dibawah
                          <!DOCTYPE html>
                          <html>
                          <head>
                           <title>Login Sederhana Dengan MySqli</title>
                           <style>
                           .form {
                            margin: 10% 0 0 25%;
                            float: left;
                            width: 60%;
                           }
                           .input {
                            padding: 1%;
                            color: #777777;
                            font-size: 14pt;
                            float: left;
                            width: 80%;
                            margin-bottom: 1%;
                           }
                           .submit {
                            padding: 1%;
                            color: #fff;
                            background-color: #11b022;
                            font-size: 14pt;
                            font-family: Times New Roman;
                            float: left;
                            width: 25%;
                           }
                           .welcome {
                            color: #11bb22;
                            font-size: 20pt;
                            font-weight: 900;
                            font-family: Centaur;
                           }


                           </style>
                          </head>
                          <body>

                          <div class="form">
                          <span class="welcome">Harap Login Terlebih Dahulu !</span>
                           <form action="login.php" method="post">
                            <input class="input" type="text" name="username" placeholder="Username">
                            <input class="input" type="text" name="password" placeholder="Password">
                            <input class="submit" type="submit" value="Login">
                           </form>
                          </div>
                          </body>
                          </html>

                          Kemudian kita keluar dan save dengan perintah ctrl + x kemudian y dan enter

                          10. Kemudian kita masukkan lagi beberapa script pada connect.php


                          11. Kemudian kita masukkan lagi script scriptnya. Kalian bisa copy paste lagi
                          <?php

                          $host  = 'localhost';
                          $user  = 'root';
                          $pass = '';
                          $db    = 'loginmysqli';

                          $connect = new mysqli($host, $user, $pass, $db);
                          if($connect->connect_error){
                           echo 'Terjadi Kesalahan';
                          }

                          ?>

                          Kemudian kita keluar dan save dengan perintah ctrl + x kemudian y dan enter

                          12. Setelah itu kita masukkan lagi script pada login.php
                          #nano login.php

                          13. Tambahkan script dibawah ini
                          <?php
                          include 'connect.php';

                          $username = $_POST['username'];
                          $password = $_POST['password'];

                          $query    = "SELECT * FROM admin WHERE username = '$username' AND password = '$password'";
                          $runquery = $connect->query($query);

                          if($runquery->num_rows > 0){
                           session_start();
                           $_SESSION['username'] = $username;
                           header("Location: home.php");
                          } else {
                           echo '<h1>
                          Username atau Kata Sandi Salah!</h1>
                          ';
                          }

                          ?>

                          Kemudian kita keluar dan save dengan perintah ctrl + x kemudian y dan enter

                          14. Kemudian kita masuk pada pada home.php
                          #nano home.php

                          15. Tambahkan lagi beberapa script dibawah ini
                          <?php
                          session_start();
                          if(!isset($_SESSION['username'])) {
                           header("Location: index.php?access_denied");
                          }

                          ?>

                          <!DOCTYPE html>
                          <html>
                          <head>
                           <title>Halaman Admin</title>
                           <style>
                           .welcome {
                            color: #11bb22;
                            font-size: 35pt;
                            font-weight: 900;
                            font-family: Centaur;
                           }
                           </style>
                          </head>
                          <body>

                          <h1 class="welcome">
                          Selamat Datang <?php echo $_SESSION['username']; ?>!</h1>
                          <a href="logout.php">Log Out >></a>

                          </body>
                          </html>

                          Kemudian kita keluar dan save dengan perintah ctrl + x kemudian y dan enter

                          16. Kemudian kita masukkan script terakhir yaitu pada logout.php
                          #nano logout.php

                          17. Kalian bisa copy paste script dibawah ini
                          <?php
                          session_start();
                          if(session_destroy()){
                           header("Location: index.php");
                          }

                          ?>

                          18. Kemudian kita coba masuk dengan menambahkan /login pada saat kita mengakses SimDesa melalui web browser
                          localhost/simdesa-master/login

                            G. Kesimpulan
                                Sebelum kita membuat login pada SimDesa, semua orang dapat mengakses dengan sesuka hatinya. Nah, tidak ada salahnya setelah kita membuat database untuk SimDesanya lalu membuat login untuk SimDesanya. Agar tidak semua orang dapat mengaksesnya sesuka hati. Jadi disini kita perlu membuat sebuah login SimDesa agar hanya orang orang tertentu yang dapat mengakses.
                                H. Referensi



                                  NB : Untuk konfigurasi yang lain bisa lihat DISINI

                                  Mungkin hanya ini yang bisa saya bagikan. Sekian.
                                  Assalamu'alaikum Wr. Wb. 

                                  No comments:

                                  Post a Comment

                                  Adbox