Sunday, February 21, 2021

Simple Login and Registration System in PHP and MySQL

 A simple login and registration system in PHP and MySQL that I wrote I hope you will find it useful.

I am currently accepting programming work, IT projects, school and application development, programming projects, thesis and capstone projects, IT consulting work, computer tutorials, and web development work kindly contact me at the following email address for further details.  If you want to advertise on my website kindly contact me also in my email address also. Thank you.

My email address is the following jakerpomperada@gmail.com, jakerpomperada@aol.com, and jakerpomperada@yahoo.com.

My mobile number here in the Philippines is 09173084360.

My telephone number at home here in Bacolod City, Negros Occidental Philippines is  +63 (034) 4335675.

Here in Bacolod City I also accepting computer repair, networking, and Arduino Project development at a very affordable price. My website is www.jakerpomperada.blogspot.com and www.jakerpomperada.com

If you like this video please click the LIKE button, SHARE, and SUBSCRIBE to my channel.

Your support on my channel is highly appreciated.

Thank you very much.









Program Listing


php_login.sql

-- phpMyAdmin SQL Dump

-- version 5.0.2

-- https://www.phpmyadmin.net/

--

-- Host: 127.0.0.1

-- Generation Time: Feb 21, 2021 at 01:05 PM

-- Server version: 10.4.14-MariaDB

-- PHP Version: 7.4.9


SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";

START TRANSACTION;

SET time_zone = "+00:00";



/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;

/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;

/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;

/*!40101 SET NAMES utf8mb4 */;


--

-- Database: `php_login`

--


-- --------------------------------------------------------


--

-- Table structure for table `accounts`

--


CREATE TABLE `accounts` (

  `id` int(11) NOT NULL,

  `name` varchar(100) NOT NULL,

  `username` varchar(50) NOT NULL,

  `password` varchar(50) NOT NULL,

  `date_created` datetime NOT NULL DEFAULT current_timestamp()

) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;


--

-- Dumping data for table `accounts`

--


INSERT INTO `accounts` (`id`, `name`, `username`, `password`, `date_created`) VALUES

(2, 'Jake R. Pomperada', 'jakerpomperada', '21232f297a57a5a743894a0e4a801fc3', '2021-02-21 19:45:30');


--

-- Indexes for dumped tables

--


--

-- Indexes for table `accounts`

--

ALTER TABLE `accounts`

  ADD PRIMARY KEY (`id`);


--

-- AUTO_INCREMENT for dumped tables

--


--

-- AUTO_INCREMENT for table `accounts`

--

ALTER TABLE `accounts`

  MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=4;

COMMIT;


/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;

/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;

/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;



style.css

* {
    box-sizing: border-box;
}

body {
    font-family: "Calibri", sans-serif;
    background: #e2e1e0;
    color: #111;
    overflow: auto;
}

main {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.container {
    padding: 50px;
    width: 500px;
    background: #fff;
    text-align: left;
    border-radius: 20px;
    box-shadow: 0 0 60px rgba(0,0,0,0.05);
}

.container.page {
    width: 600px;
}

h1 {
    margin: 0;
    line-height: 1;
}

h3 {
    margin: 3px 0 0;
    font-size: 1.3em;
}

.title {
    display: block;
    text-align: center;
}

.title.page {
    text-transform: capitalize;
}

.name {
    color: #f44336;
}

.txtbox {
    display: block;
    background: #f1f1f1;
    width: 100%;
    margin: 0 0 10px;
    padding: 15px;
    border: none;
    font-size: 20px;
    border-radius: 8px;
    font-family: "Calibri", sans-serif;
    text-align: center;
}

.registration .txtbox {
    text-align: left;
}

.txtbox:first-of-type {
    margin: 30px 0 10px;
}

.txtbox:last-of-type {
    margin: 0;
}

.txtbox:hover,
.txtbox:focus {
    background: #e0e0e0;
}

.btn {
    background: #673ab7;
    color: #fff;
    padding: 15px;
    width: 100%;
    opacity: 0.9;
    outline: none;
    font-size: 20px;
    text-transform: uppercase;
    border: none;
    text-decoration: none;
    text-align: center;
    font-family: "Calibri", sans-serif;
    cursor: pointer;
    text-decoration: none;
    display: block;
    border-radius: 8px;
}

.btn:hover {
    opacity: 1;
}

.btnLogout {
    margin: 0;
}

.btnRegister {
    background: #e91e63;
}

.btnWrapper .btn:first-child {
    margin: 20px 0 10px ;
}

.btnWrapper .btn:last-child {
    margin: 0;
}

.message {
    width: 100%;
    padding: 20px;
    font-size: 18px;
    background: #9e9e9e;
    color: #fff;
    line-height: 1;
    margin-top: 20px;
    border-radius: 8px;
    word-wrap: break-word;
}

index.php

<?php
    $error = "";
    
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
        // Start session
        session_start();

        // Establish connection to the database
        require_once "config.php";

        // Rename and sanitize post data
$user = $con->real_escape_string($_POST['txtUser']);
        $pass = md5($con->real_escape_string($_POST['txtPass']));
        
        // Check if username and password match any record
        if ($stmt = $con->prepare("SELECT `name`, `date_created` FROM `accounts` WHERE `username` = ? AND `password` = ?")) {
            $stmt->bind_param("ss", $user, $pass);
            $stmt->execute();
            $stmt->store_result();

            if($stmt->num_rows > 0) {
                // If there is a match, store account details in session variables, redirect to page.php, and lastly close connection
                $stmt->bind_result($name,$date);
                $stmt->fetch();
                $_SESSION['name'] = $name;
                $_SESSION['date'] = $date;
                $stmt->close();
                header("Location: page.php");
                $con->close();
                exit();
            } else {
                // Show error message if nothing matched
                $error = '<div class="message">You have entered an incorrect Username or Password. Please try again.</div>';
            }
        } else {
            // Show error message incase there is something wrong with the sql statement
            $error = '<div class="message">Prepare failed: ('.$con->errno.') '.$stmt->error.'</div>';
        }
        // Close database connection
        $con->close();
    }
?>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Simple Login System in PHP</title>
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <main>
            <div class="container">
                <div class="title">
                    <h1>Simple Login System in PHP</h1>
                    <h3>&#187; Jake R. Pomperada, MAED-IT, MIT &#171;</h3>
                </div>

                <div class="container-wrapper login">
                    <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
                        <input type="text" class="txtbox" name="txtUser" id="txtUser" placeholder="Username" required>
                        <input type="password" class="txtbox" name="txtPass" id="txtPass" placeholder="Password" required>
                        
                        <div class="btnWrapper">
                            <button type="submit" class="btn btnLogin" name="btnLogin">Login</button>
                            <a href="register.php" class="btn btnRegister" name="btnRegister">Register</a>
                        </div>

                        <?php echo $error; ?>
                    </form>
                </div>
            </div>
        </main>
    </body>
</html>

config.ini

[database]
hostname = localhost
username = root
password = 
dbname = php_login

config.php

<?php
    // Read config.ini file
    $config = parse_ini_file('config.ini'); 

    // Set database connection
    $con = new mysqli($config['hostname'],$config['username'],$config['password'],$config['dbname']);

    // if there is a problem, show error message
    if (mysqli_connect_errno()) {
        printf("Connection failed: %s\n", mysqli_connect_error());
        exit();
    }


logout.php

<?php
    session_start();
    $_SESSION = array();
    session_destroy();
    header("location: index.php");
    exit;
?>

register.php

<?php
    // Start session
    session_start();

    // Declare variables
    $txtName = $txtUser = $name = $user = $msg = $temp = "";

    // Check if logged in (if logged in show back button, if not show login button)
    if (isset($_SESSION["name"])) {
        $button = '<a href="page.php" class="btn btnBack" name="btnBack">Back</a>';
    } else {
        $button = '<a href="index.php" class="btn btnLogin" name="btnLogin">Login</a>';
    }
    
    // Check if form was submitted
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
        // Establish connection to the database
        require_once "config.php";

        // Get and sanitize data
$name = $con->real_escape_string($_POST['txtName']);
$user = $con->real_escape_string($_POST['txtUser']);
        $pass = md5($con->real_escape_string($_POST['txtPass']));
        $conf = md5($con->real_escape_string($_POST['txtConfirm']));
        $checker = 0;
        
        // Check if username is alphanumeric and not less than 4 characters
        if (!ctype_alnum($user) || strlen($user)<4) {
            $checker = 1;
            $temp .= 'Username must be a minimum of 4 alphanumeric characters only.<br><br>';
        }
        
        // Check if password is alphanumeric and not less than 4 characters 
        if (!ctype_alnum($pass) || strlen($pass)<4) {
            $checker = 1;
            $temp .= 'Password must be a minimum of 4 alphanumeric characters only.<br><br>';
        }
        
        // check if password and confirm password matched
        if ($pass != $conf) {
            $checker = 1;
            $temp .= 'Passwords don\'t match.';
        }

        // Check if errors were found
        if($checker == 0) {
            // If there were no errors found, execute insert
            if ($stmt = $con->prepare("INSERT INTO `accounts`(`name`, `username`, `password`) VALUES (?, ?, ?)")) {
                $stmt->bind_param("sss", $name, $user, $pass);
                $stmt->execute();
                $success = "You are successfully registered.";
                $msg = '<div class="message">'.$success.
                                '</div>';
            } else {
                $msg = '<div class="message">Prepare failed: ('.$con->errno.') '.$mysqli->error.'</div>';
            }

        } else {
            // If errors were found, show error message, name, and username
            $txtName = $name;
            $txtUser = $user;
            $msg = '<div class="message">'.$temp.'</div>';
        }

        // Close database connection
        $con->close();
    }
?>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Simple Login System in PHP</title>
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <main>
            <div class="container registration">
                <div class="title">
                    <h1>Registration Form</h1>
                    <h3>&#187; Jake R. Pomperada, MAED-IT, MIT &#171;</h3>
                </div>

                <div class="container-wrapper">
                    <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" class="frmRegister">
                        <input type="text" class="txtbox" name="txtName" id="txtName" value="<?php echo $txtName; ?>" placeholder="Full Name" required>
                        <input type="text" class="txtbox" name="txtUser" id="txtUser" value="<?php echo $txtUser; ?>" placeholder="Username" required>
                        <input type="password" class="txtbox" name="txtPass" id="txtPass" placeholder="Password" required>
                        <input type="password" class="txtbox" name="txtConfirm" id="txtConfirm" placeholder="Confirm Password" required>
                        
                        <div class="btnWrapper">
                            <button type="submit" class="btn btnRegister" name="btnRegister">Register</button>
                            <?php echo $button; ?>
                        </div>
                        

                        <?php echo $msg; ?>
                    </form>
                </div>
            </div>
        </main>
    </body>
</html>


page.php


<?php
    // resume existing session
    session_start();

    // Check if session name exists
    if (!isset($_SESSION["name"])) {
        header("Location: logout.php");
        exit();
    }
?>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Simple Login System in PHP</title>
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <main>
            <div class="container page">
                <div class="title page">
                    <h1>Welcome <span class="name"><?php echo $_SESSION["name"]; ?></span>!</h1>
                    <h2>Date Created: <?php echo date("F j, Y, g:i A", strtotime($_SESSION["date"]));?></h2>
                    
                    <div class="btnWrapper">
                        <a href="register.php" class="btn btnRegister">Creat New Account</a>
                        <a href="logout.php" class="btn btnLogout">Logout</a>
                    </div>
                </div>
            </div>
        </main>
    </body>
</html>


Pure HTML and CSS Navigation Bar

Pure HTML and CSS Navigation Bar

 A simple navigational menu using pure HTML and CSS.

 I am currently accepting programming work, IT projects, school and application development, programming projects, thesis and capstone projects, IT consulting work, computer tutorials, and web development work kindly contact me at the following email address for further details.  If you want to advertise on my website kindly contact me also in my email address also. Thank you.

My email address is the following jakerpomperada@gmail.com, jakerpomperada@aol.com, and jakerpomperada@yahoo.com.

My mobile number here in the Philippines is 09173084360.

My telephone number at home here in Bacolod City, Negros Occidental Philippines is  +63 (034) 4335675.

Here in Bacolod City I also accepting computer repair, networking, and Arduino Project development at a very affordable price. My website is www.jakerpomperada.blogspot.com and www.jakerpomperada.com

If you like this video please click the LIKE button, SHARE, and SUBSCRIBE to my channel.

Your support on my channel is highly appreciated.

Thank you very much.





Program Listing

style.css

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
background: #F9F9F9;
font-size:22px;
color: #000000;
    font-family: "Calibri", sans-serif;
}

.container {
    display: block;
    padding: 100px 0 0;
}

.content {
    display: block;
    text-align: center;
}

h1 {
font-size: 50px;
    font-family: "Calibri", sans-serif;
    line-height: 1.5;
}

p {
    margin: 0 0 50px;
}

nav {
    width: 750px;
    margin: auto;
}

nav ul {
list-style: none;
position: relative;
    display: flex;
    margin: 0;
    padding-left: 0;
}
nav ul li {
background-color: #0E4D90;
    text-align: center;
    width: 150px;
    margin: 0;
    padding: 0;
}

nav a {
display:block;
color:#FFF;
font-size:20px;
line-height: 60px;
text-decoration:none;
}

nav a:hover { 
background-color: #115CAD; 
}

nav ul ul {
display: none;
position: absolute; 
top: 60px;
    left: 0;
}
nav ul li:hover > ul {
display:inherit;
}
nav ul ul li {
width:150px;
float:none;
display:list-item;
position: relative;
}

nav ul ul ul li {
position: relative;
top:-60px; 
left:150px;
}

ul li ul li > a:after {
    position: absolute;
    content:  ' \27A7';
    right: 12px;
}
li > a:only-child:after {
    content: '';
}


index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Pure CSS Navigation Bar</title>
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <div class="container">
            <div class="content">
                <h1>Pure HTML and CSS Navigation Bar</h1>
                <h2>Mr. Jake R. Pomperada, MAED-IT, MIT</h2>
<p>A simple dropdown navigation menu made with CSS Only.</p>
            </div>

            <nav>
                <ul class="dropdown">
                    <li>
                        <a href="#">Menu Item</a>
                        <ul>
                            <li><a href="#">Item 1</a></li>
                            <li><a href="#">Item 2</a></li>
                            <li>
                                <a href="#">Item 3</a>
                                <ul>
                                    <li><a href="#">Item 6</a></li>
                                    <li><a href="#">Item 7</a></li>
                                    <li><a href="#">Item 8</a></li>
                                    <li><a href="#">Item 9</a></li>
                                    <li><a href="#">Item 10</a></li>
                                </ul>
                            </li>
                            <li><a href="#">Item 4</a></li>
                            <li><a href="#">Item 5</a></li>
                        </ul>        
                    </li>
                    <li><a href="#">Menu Item</a></li>
                    <li><a href="#">Menu Item</a></li>
                    <li><a href="#">Menu Item</a></li>
                    <li><a href="#">Menu Item</a></li>
                </ul>
            </nav>
        </div>
    </body>
</html>


Thursday, February 18, 2021

Simple Currency Converter in PHP

Simple Currency Converter in PHP

 A simple currency converter that I wrote using PHP to convert currency from Philippine Peso, Canadian Dollar, Hongkong Dollar, and Japanese Yen vice versa.

 I am currently accepting programming work, IT projects, school and application development, programming projects, thesis and capstone projects, IT consulting work, computer tutorials, and web development work kindly contact me at the following email address for further details.  If you want to advertise on my website kindly contact me also in my email address also. Thank you.

My email address is the following jakerpomperada@gmail.com, jakerpomperada@aol.com, and jakerpomperada@yahoo.com.

My mobile number here in the Philippines is 09173084360.

My telephone number at home here in Bacolod City, Negros Occidental Philippines is  +63 (034) 4335675.

Here in Bacolod City I also accepting computer repair, networking, and Arduino Project development at a very affordable price. My website is www.jakerpomperada.blogspot.com and www.jakerpomperada.com

If you like this video please click the LIKE button, SHARE, and SUBSCRIBE to my channel.

Your support on my channel is highly appreciated.

Thank you very much.







Program Listing


index.php

<?php 

    // Output text

    $out = $ans = $txtAmount =


    // txtSelectBox1 selection

    $selA0 = $selA1 = $selA2 = $selA3 =


    // txtSelectBox2 selection

    $selB0 = $selB1 = $selB2 = $selB3 = "";


    // Check if form was submitted

    if(isset($_POST['txtSelectBox1'])) {

        // Get post values

        $txtSel1   = $_POST['txtSelectBox1'];

        $txtSel2   = $_POST['txtSelectBox2'];

        $txtAmount = $_POST['txtAmount'];

        

        // Exchange rates

        $cur = array("PHP",       "CAD",      "HKD",      "JPY");

        $php = array("1",         "0.026219", "0.159988", "2.187584");

        $cad = array("38.148506", "1",       "6.104467", "83.556541");

        $hkd = array("6.250537",  "0.163831", "1",        "13.689826");

        $jpy = array("0.45631",   "0.011967", "0.07302",  "1");

        

        // Switch statement for conversion

        switch ($txtSel1) {

            case "php":

                $selA0 = ${"selB".$txtSel2} = "selected";

                $ans   = $txtAmount * floatval($php[$txtSel2]);

                $case  = 0; 

                break;

            case "cad":

                $selA1 = ${"selB".$txtSel2} = "selected";

                $ans   = $txtAmount * floatval($cad[$txtSel2]);

                $case  = 1; 

                break;

            case "hkd":

                $selA2 = ${"selB".$txtSel2} = "selected";

                $ans   = $txtAmount * floatval($hkd[$txtSel2]);

                $case  = 2; 

                break;

            case "jpy":

                $selA3 = ${"selB".$txtSel2} = "selected";

                $ans   = $txtAmount * floatval($jpy[$txtSel2]);

                $case  = 3; 

                break;

        }


        // Display output

        $out = '<div class="answer">'.$txtAmount.' '.$cur[$case].' = '.$ans.' '.$cur[$txtSel2].'</div>';

    }

?>

<!DOCTYPE html>

<html lang="en">

    <head>

        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>Simple Currency Converter in PHP</title>

        <link rel="stylesheet" href="style.css">

    </head>

    <body>

        <main>

            <div class="container">

                <div class="title">

                    <h1>Simple Currency Converter in PHP</h1>

                    <h2>&#187; Jake R. Pomperada, MAED-IT, MIT &#171;</h2>

                    <i>Exchange Rates as of Feb 17, 2021</i>

                </div>


                <div class="container-wrapper">

                    <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" class="frmSelect" name="frm">

                        <div class="selectWrapper">

                            <select class="txtSelectBox" name="txtSelectBox1" id="txtSelectBox1">

                                <option value="php" <?php echo $selA0; ?>>Philippine Peso (PHP)</option>

                                <option value="cad" <?php echo $selA1; ?>>Canadian Dollar (CAD)</option>

                                <option value="hkd" <?php echo $selA2; ?>>Hong Kong Dollar (HKD)</option>

                                <option value="jpy" <?php echo $selA3; ?>>Japanese Yen (JPY)</option>

                            </select>

                            <select class="txtSelectBox" name="txtSelectBox2" id="txtSelectBox2">

                                <option value="0" <?php echo $selB0; ?>>Philippine Peso (PHP)</option>

                                <option value="1" <?php echo $selB1; ?>>Canadian Dollar (CAD)</option>

                                <option value="2" <?php echo $selB2; ?>>Hong Kong Dollar (HKD)</option>

                                <option value="3" <?php echo $selB3; ?>>Japanese Yen (JPY)</option>

                            </select>

                        </div>


                        <input type="number" class="txtbox" name="txtAmount" id="txtAmount" value="<?php echo $txtAmount; ?>" placeholder="Input Amount" required>

                        

                        <div class="btnWrapper">

                            <a href="index.php" class="btn btnReset" name="btnReset">Reset</a>

                            <button type="submit" class="btn btnConvert" name="btnConvert">Convert</button>

                        </div>


                        <?php echo $out; ?>

                    </form>

                </div>

            </div>

        </main>

    </body>

</html>


style.css


* {

    box-sizing: border-box;

}


body {

    font-family: "Calibri", sans-serif;

    background: #e2e1e0;

    color: #111;

}


main {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

}


.container {

    padding: 50px;

    width: 600px;

    background: #fff;

    text-align: left;

    border-radius: 20px;

    box-shadow: 0 0 60px rgba(0,0,0,0.05);

}


h1 {

    margin: 0;

    line-height: 0.9;

}

h2 {

    margin: 0;

}

.title {

    display: block;

    margin: 0 0 30px;

    text-align: center;

}


select,

.txtbox {

    display: inline-block;

    background: #f1f1f1;

    width: 100%;

    margin: 0 0 10px 0;

    padding: 15px;

    border: none;

    font-size: 20px;

    border-radius: 8px;

    font-family: "Calibri", sans-serif;


}


.selectWrapper {

    display: inline-flex;

    margin: 0 0 10px 0;

}


.selectWrapper select {

    width: 245px;

}


.selectWrapper select:first-child {

    margin: 0 10px 0 0;

}


.selectWrapper select:last-child {

    margin: 0;

}


select:hover,

select:focus,

.txtbox:hover,

.txtbox:focus {

    background: #e0e0e0;

}


.btnWrapper {

    display: inline-flex;

}


.btn {

    background: #673ab7;

    color: #fff;

    padding: 15px;

    width: 250px;

    opacity: 0.9;

    outline: none;

    font-size: 20px;

    text-transform: uppercase;

    border: none;

    text-decoration: none;

    text-align: center;

    font-family: "Calibri", sans-serif;

    cursor: pointer;

    text-decoration: none;

    display: block;

}


.btn:hover {

    opacity: 1;

}


.btnReset {

    background: #ff5722;

    border-radius: 8px 0 0 8px;

}


.btnConvert {

    border-radius: 0 8px 8px 0;

}


.answer {

    width: 100%;

    padding: 20px;

    text-align: center;

    font-size: 25px;

    font-weight: bold;

    background: #9e9e9e;

    color: #fff;

    line-height: 1;

    margin-top: 20px;

    border-radius: 8px;

}

Burger Order Form in PHP