index.php - login form

<?php
session_start(); //starting the session to store information
$log = ""; //output VAR for text

    $host = "ip:port"; //port might not be necessary
    $user = "user";
    $password = "password";
    $db = "dbName";
    $conn = mysqli_connect($host, $user, $password, $db); //creating a connection

        if (!$conn) {
        die("Connection error: " . mysqli_connect_errno());
            } else {
            //do something else or delete the else statement if not needed
                }

    $log = "Insert Unsername and Password"; //default text on top of the login form

    if(isset($_POST['username'])){  //checking if the username is set and is not NULL.
        $userUsername = $_POST['username']; //taking the user input for username from the loging form
        $userPassword = $_POST['password']; //taking the user input for password from the loging form
        $sql = "SELECT * FROM utenti WHERE username='".$userUsername."' AND password = '".$userPassword."'"; //VAR SQL query
        $result = mysqli_query($conn, $sql); //result is equal to connection + the VAR query

        if(mysqli_num_rows($result)==1){ //checking the result of the query (in this case if there's 1 row of result)
            $_SESSION['username'] = $userUsername; //setting the username input from the user inside the session to keep this info through the pages
            header('location: main.php'); //redirect if result = 1 (redirct in PHP must be declaired BEFORE all the HTML code, otherwise it won't work)
        } else {
            $log = "Username or Password are wrong"; //changing the VAR log to display in the same page some text
        }
    } else {
        //You can execute anything if the username is NULL, however if you set the username field as required in the HTML
    }
$conn->close() //close the connection
?>
<html>
<head>
<link rel="stylesheet" type="text/css" href="indexstyle.css">
</head>
<body>
<div id="container">
    <div id="log">
        <?php echo $log; // here you can print the log VAR inside a div that you can modify in CSS
            ?>
        </div>
        <div class="form">
            <form class="login-form" method="POST" action="#" >
            <input type="text" id="user" name="username" placeholder="Username" autocomplete="off" required /> </br>
            <input type="password" id="pass" name="password" placeholder="Password" autocomplete="off" required /> </br>
            <input type="submit" class="button" name="button" value="LOGIN" />
            </form>
        </div>
    </div>
</body>
</html>