Cara Membuat Login Dengan Bootstrap

Membuat Login Dengan Menggunakan Bootstrap

Langkah yang harus dilakukan untuk membuatnya yaitu dengan membuat sebuah Dtabase MySQL terlebih dahulu, karena semua data yang akan kita proses akan dimasukan kedalam Database semua, oleh karena itu Database merupakan bagian terpenting dalam membuat sebuah program Aplikasi berbasis Web.

Untuk membuat Database MySQL yang harus dilakukan yaitu sebagai berikut :

1. Komputer/Leptop anda harus sudah terinstall aplikasi Xampp, Web Browser dan Teks Editor
2. Buatlah rancangan tampilan yang akan dibuat, seperti Background yang akan ditampilkan pada saat Login tersebut dibuka, hal ini sangat diperlukan untuk menarik minat pengunjug.
3. Siapkan juga aplikasi pendukung seperti Corel Draw, photoshop, dll

Buka aplikasi Xampp pada komputer anda, kemudian aktifkan Apache dan MySQL, setelah itu buka juga Aplikasi Web Browser pada komputer anda, seperti Mozila Firefox, Google Chroom, Opera Mini, dll

Kemudian ketikan "localhost" secara default kita akan menggunakan localhost sebagai gerbang untuk masuk ke database dan juga aplikasi yang akan kita buat, adapun nantinya perubahan apabila komputer kita tidak support seperti port yang sudah dipakai sehingga menggunakan port yang lainnya, sebagai contoh biasanya menggunakan "localhost:8080".

Setelah jendela awal terbuka maka pilih phpMyAdmin, sehingga akan tampil seperti berikut ini.

Saya yakin setelah masuk di jendela diatas anda sudah tahu bagaimana cara membuat sebuah database MySQL, jadi saya tidak usah menerangkan lebih lanjut mengenai hal ini.

Buatlah sebuah Database dengan nama : boat 

Buatlah sebuah Tabel Database dengan nama : user

Buatlah seperti berikut ini

Setelah semua database selesai selanjutnya kita akan membuat script untuk loginnya, gunakan script dibawah ini.

Buatlah terlebih dahulu Koneksi untuk menghubungkan antara  php dengan MySQL

Buatlah folder include kemudian simpan script dibawah ini dengan nama connection.php

<?php
class connection{

    protected $isConn;
    protected $datab;
    protected $transaction;

    //connect to DB use the default constructor
    public function __construct($username="root", $password="", $host="localhost", $dbname="boat", $options = []){
       
        $this->isConn = TRUE;
        try{
            $this->datab = new PDO("mysql:host={$host};  dbname={$dbname}; charset=utf8", $username, $password, $options);
            $this->datab->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
            $this->transaction = $this->datab;
            $this->datab->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE, PDO::FETCH_ASSOC);
            //echo 'Connected Successfully!!!';

        }catch(PDOException $e){
            throw new Exception($e->getMessage());           
        }

    }//endDefaultConstructor


    //disconnect from db
    public function Disconnect(){
        $this->datab = NULL;//close connection in PDO
        $this->isConn = FALSE;
    }//endDisconnectFunction

   


}//endClassDatabase

 //$con = new Connection(); //for debugging only
//echo '    debug connection';
 ?>

Buat juga koneksi untuk menghubungkan php dengan MySQL dengan script dibawah ini, simpan script dengan nama database.php

<?php

include_once('connection.php'); //my connection is here

class Database extends connection{


    public function __construct(){

        parent::__construct();//put this if naay default constructor and class na iya ge extendnan para ma apil sad diri
        //above code copy the default constructor of the class extended

    }//endDefaultConstructor

    //disconnect is in the parent class in connection.php

    //get row
    public function getRow($query, $params = []){
        try {
            $stmt = $this->datab->prepare($query);
            $stmt->execute($params);
            return $stmt->fetch();  
        } catch (PDOException $e) {
            throw new Exception($e->getMessage());  
        }


    }//end getRow

    //get rows
    public function getRows($query, $params = []){
        try {
            $stmt = $this->datab->prepare($query);
            $stmt->execute($params);
            return $stmt->fetchAll();  
        } catch (PDOException $e) {
            throw new Exception($e->getMessage());  
        }
    }//end getRows

    //insert row
    public function insertRow($query, $params = []){
        try {
            $stmt = $this->datab->prepare($query);
            $stmt->execute($params);
            return TRUE;  
        } catch (PDOException $e) {
            throw new Exception($e->getMessage());  
        }

    }//end insertRow

    //update row
    public function updateRow($query, $params = []){
        $this->insertRow($query, $params);
    }//end updateRow

    //delete row
    public function deleteRow($query, $params = []){
        $this->insertRow($query, $params);
    }//end deleteRow

    //get the last inserted ID
    public function lastID(){
        $lastID = $this->datab->lastInsertId();
        return $lastID;
    }//end lastID func


    //under construction kay dili pa mo gana!!!!
    public function transInsert($query, $params = [], $query2, $params2 = []){
        try {
            $this->transaction->beginTransaction();
                $stmt = $this->datab->prepare($query);
                $stmt->execute($params);

                $stmt2 = $this->datab->prepare($query2);
                $stmt2->execute($params2);

            $this->transaction->commit();
        } catch (PDOException $e) {
            $this->transaction->rollBack();
            throw new Exception($e->getMessage());  
        }
    }//end transac func


    public function Begin(){
        $this->transaction->beginTransaction();
    }

    public function Commit(){
        $this->transaction->commit();
    }
}


 ?>

Setelah menyimpan semua script diatas, selanjutnya kita akan membuat tampilan Login dan juga Registrasinya namun saya cukupkan terlebih dahulu karena saya harus mengerjakan yang lainnya, nanti kita akan bahas kembali agar materi cara membuat Login dengan Bootstrap ini dapat selesai ..

Pastikan anda masih tatap mengunjungi Blog Sourcecode Application ini, dan nantikan kejutan  lainnya dengan membahas mengenai bahasa pemrograman dan juga sourcecode aplikasi gratis yang bisa anda download disini.

Cara Membuat Login Dengan Mudah
Cara Membuat Login Dengan JQuery
Cara Membuat Login Dengan Javascript
Cara Membuat Login dengan Bootstrap