Building Basic Login and Registration Systems

# CHAPTER 3

Building Basic Login and Registration Systems #

1. Introduction #

2. Learning Objectives #

• Design a relational database table for user storage.

• Understand the Registration workflow (checking for duplicates).

• Understand the Login workflow (fetching and comparing credentials).

• Identify the necessary HTML form attributes for secure data transmission.

3. Beginner-Friendly Explanation #

• Registration: A new person walks up, fills out a membership application, and hands it to the bouncer. The bouncer checks the club registry. If a person with that email already exists, he rejects the application. If not, he adds the new person's name and secret passcode to the registry book.

• Login: The next night, the person returns. The bouncer asks for their email. The bouncer scans the registry book. If he can't find the email, he denies entry. If he finds it, he asks for the secret passcode. If it matches what is written in the book, the person is allowed inside.

4. Step 1: The Database Schema #

SQL Schema:

CREATE TABLE users (
    id INT AUTO_INCREMENT PRIMARY KEY,
    name VARCHAR(100) NOT NULL,
    email VARCHAR(255) NOT NULL UNIQUE,
    password VARCHAR(255) NOT NULL,
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

*Crucial Detail:* Notice the UNIQUE constraint on the email column. This is your database's last line of defense against creating two accounts with the same email. Also, notice the password field is VARCHAR(255). Even if a user's password is "cat", we need a massive column size because we will soon be storing long, scrambled hashes instead of the raw password.

5. Step 2: The Registration HTML Form #

<!-- method MUST be POST. action points to your backend route -->
<form action="/api/register" method="POST">
    <label>Email:</label>
    <input type="email" name="email" required>
    
    <label>Password:</label>
    <!-- type="password" hides the characters as dots on the screen -->
    <input type="password" name="password" required>
    
    <button type="submit">Create Account</button>
</form>

6. Step 3: The Registration Workflow (Backend Logic) #

<?php
// Assuming $pdo is your database connection

if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $email = $_POST[&#039;email'];
    $password = $_POST[&#039;password'];

    // 1. Check if the user already exists
    $stmt = $pdo->prepare("SELECT id FROM users WHERE email = ?");
    $stmt->execute([$email]);
    
    if ($stmt->fetch()) {
        die("Error: An account with this email already exists.");
    }

    // 2. Hash the password (We will cover this deeply in Chapter 4)
    // NEVER SKIP THIS STEP IN A REAL APPLICATION
    $hashedPassword = password_hash($password, PASSWORD_DEFAULT);

    // 3. Save the new user to the database
    $insertStmt = $pdo->prepare("INSERT INTO users (email, password) VALUES (?, ?)");
    $insertStmt->execute([$email, $hashedPassword]);

    echo "Registration successful! You may now log in.";
}
?>

7. Step 4: The Login Workflow (Backend Logic) #

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $email = $_POST[&#039;email'];
    $loginPassword = $_POST[&#039;password'];

    // 1. Find the user by email
    $stmt = $pdo->prepare("SELECT id, password FROM users WHERE email = ?");
    $stmt->execute([$email]);
    $user = $stmt->fetch();

    // 2. Verify existence AND password match
    // password_verify() safely compares the plain text to the database hash
    if ($user && password_verify($loginPassword, $user[&#039;password'])) {
        
        // 3. Authentication Passed!
        // Start a session (Covered in Chapter 5)
        echo "Login Successful! Welcome.";
        
    } else {
        // 4. Authentication Failed!
        // Use a vague error message.
        echo "Error: Invalid email or password.";
    }
}
?>

8. Backend Workflow: Form Validation #

14. Interview Questions #

• Q: Walk me through the backend workflow of a user registration process. What checks must be performed before executing the SQL INSERT statement?

• Q: Explain why it is important to standardize email inputs (e.g., forcing lowercase) during both the registration and login processes.

15. FAQs #

16. Summary #

17. Next Chapter Recommendation #