I am working on a chatting app in HTML.
I have made the sign up page with this HTML code:
<!DOCTYPE html>
<html>
<head>
<title>THE HOMEPAGE</title>
<noscript>No one loves u</noscript>
<script src="https://kit.fontawesome.com/2432f73816.js" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link rel="stylesheet" href="./teacher.css"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<form id="CreateAccount" action="techer.php" method="GET">
<div class="main">
<div class="Title">
<h1>Enter your details.</h1>
</div>
<div class="inputs">
<label for="skool">SchoolName:</label>
<input type="text" id="skool" placeholder ="Put the school name" name="skool"></input>
<i class="fa-solid fa-circle-xmark"></i>
<i class="fa-solid fa-circle-check"></i>
<p>Error Message</p>
</div>
<div class="inputs">
<label for="username">Username:</label>
<input type="text" id="username" placeholder ="Username" name="username">
<i class="fa-solid fa-circle-xmark"></i>
<i class="fa-solid fa-circle-check"></i>
<p id="p">Error Message</p>
</div>
<div class="inputs">
<label for="password">Password</label>
<input type="password" id="password" placeholder =" Password" name="password"></input>
<i class="fa-solid fa-circle-xmark"></i>
<i class="fa-solid fa-circle-check"></i>
<p id="p">Error Message</p>
</div>
<div class="inputs">
<label for="confpassword">Confirm Password</label>
<input type="password" id="confpassword" placeholder =" Confirm Password" name="confpassword"></input>
<i class="fa-solid fa-circle-xmark"></i>
<i class="fa-solid fa-circle-check"></i>
<p>Error Message</p>
</div>
<div class="inputs">
<label for="email">Email:</label>
<input type="email" id="email" placeholder ="Email" name="email"></input>
<i class="fa-solid fa-circle-xmark"></i>
<i class="fa-solid fa-circle-check"></i>
<p>Error Message</p>
</div>
<button class="submitbtn" type="submit">Submit</button>
</div>
</div>
</form>
<script src="./teacher.js"></script>
</body>
and with this PHP code:
<?php
$servername = "host";
$username = "username";
$password = "password";
$dbname = "demo";
$name = $_GET['username'];
$skool = $_GET['skool'];
$email = $_GET['email'];
$pwd = $_GET['password'];
mkdir($skool, 0700);
$myfile = fopen("$skool/index.html", "w");
$myfile1 = fopen("$skool/index.css", "w");
$myfile2 = fopen("$skool/submit.php", "w");
$script = "";
$txt = "<!doctype HTML>
<html>
<head>
<form action='submit.php'>
<title>Welcome!!</title>
<link rel='stylesheet' href='index.css'/>
<script src='index.js'></script>
</head>
<body>
<div>
<h1>Welcome!!</h1>
<h4>We hope you enjoy using our website. So that you can <br>see the right things for your students, please answer<a href='#' style='text-decoration:none;'>A Few Questions</a></h4></div>
<li>
<h3>What sort of school do you run?</h3>
<div>
<input type='radio' name='question-1-answers' id='question-1-answers-A' value='A' />
<label for='question-1-answers-A'> A Primary School </label>
</div>
<div>
<input type='radio' name='question-1-answers' id='question-1-answers-B' value='B' />
<label for='question-1-answers-B'> A Secondary School</label>
</div>
<div>
<input type='radio' name='question-1-answers' id='question-1-answers-C' value='C' />
<label for='question-1-answers-C'>A University</label>
</div>
<h3>What part of the Uk do you live in?</h3>
<div>
<input type='radio' name='question-2-answers' id='question-1-answers-A' value='A' />
<label for='question-1-answers-A'>England</label>
</div>
<div>
<input type='radio' name='question-2-answers' id='question-1-answers-B' value='B' />
<label for='question-1-answers-B'>Scotland</label>
</div>
<div>
<input type='radio' name='question-2-answers' id='question-1-answers-C' value='C' />
<label for='question-1-answers-C'>Wales</label>
</div>
<h3>Name of reward system</h3>
<div>
<input class='input'type='text' placeholder='Reward Name'></input>
</div>
<button class='button' onclick ='sub()'>Submit</button>
";
$txta = "input{
width:100%;
}
.input{
width:35%;
}
.button{
padding 20px 40px;
background: #ee00bb;
}";
fwrite($myfile, $txt);
fwrite($myfile1, $txta);
fclose($myfile);
fclose($myfile1);
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "INSERT INTO `teacher` (`School`, `Email Address`, `Password`, `Username`)
VALUES ('$skool', '$email', '$pwd', '$name')";
if ($conn->query($sql) === TRUE) {
echo "New record created successfully";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
$conn->close();
?>
This is the HTML/PHP code for the signup page. I am not sure how to use the content inserted into this database to make a login page that checks if a row has all the correct credentials. I have tried tutorials but that hasn't worked out for me. how do I use this code to make a login page? I know how to code the elements, i just need help with the PHP side