How to make a starter PHP website With Examples
June 12, 2024
How To Create A WordPress Plugin
June 12, 2024to expand on our last post How to create a starter php website
In our previous post, we created a starter PHP website with basic HTML and CSS. Now, let’s take it a step further by connecting our PHP website to a MySQL database. This will enable us to store and retrieve dynamic data, making our website more interactive and functional. In this guide, we’ll walk you through the process of setting up a MySQL database and integrating it with your PHP website.
Step 1: Setting Up Your MySQL Database
First, you’ll need to set up a MySQL database. If you’re using XAMPP or MAMP, MySQL is included and can be managed via phpMyAdmin.
- Open phpMyAdmin: Access phpMyAdmin through your browser. Typically, it’s available at
http://localhost/phpmyadmin. - Create a Database: Click on “New” in the sidebar to create a new database. Name it
my_php_websiteand click “Create”. - Create a Table: Within your new database, create a table named
userswith the following columns:id(INT, primary key, auto-increment)username(VARCHAR, 50)email(VARCHAR, 100)created_at(TIMESTAMP, default CURRENT_TIMESTAMP)
Step 2: Connecting PHP to MySQL
Now that your database is set up, let’s connect it to our PHP website. We’ll start by creating a database configuration file.
- Create a Configuration File: Create a file named
config.phpin your project directory.
phpCopy code<?php
// config.php
$servername = "localhost";
$username = "root"; // Default XAMPP/MAMP username
$password = ""; // Default XAMPP/MAMP password
$dbname = "my_php_website";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
?>
Step 3: Inserting Data into the Database
Let’s create a new page where we can insert data into our users table. Create a file named insert.php.
phpCopy code<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Insert Data</title>
</head>
<body>
<h1>Insert User Data</h1>
<form method="POST" action="">
<label for="username">Username:</label>
<input type="text" id="username" name="username" required>
<br>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<br>
<input type="submit" value="Submit">
</form>
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
include 'config.php';
$username = $_POST['username'];
$email = $_POST['email'];
$sql = "INSERT INTO users (username, email) VALUES ('$username', '$email')";
if ($conn->query($sql) === TRUE) {
echo "New record created successfully";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
$conn->close();
}
?>
</body>
</html>
Step 4: Retrieving Data from the Database
Next, let’s create a page to display the data from our users table. Create a file named view.php.
phpCopy code<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>View Users</title>
</head>
<body>
<h1>Users List</h1>
<table border="1">
<tr>
<th>ID</th>
<th>Username</th>
<th>Email</th>
<th>Created At</th>
</tr>
<?php
include 'config.php';
$sql = "SELECT id, username, email, created_at FROM users";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
echo "<tr><td>" . $row["id"]. "</td><td>" . $row["username"]. "</td><td>" . $row["email"]. "</td><td>" . $row["created_at"]. "</td></tr>";
}
} else {
echo "<tr><td colspan='4'>No records found</td></tr>";
}
$conn->close();
?>
</table>
</body>
</html>
Step 5: Updating Your Navigation Menu
Update your navigation menu in index.php to include links to the new pages.
phpCopy code<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My PHP Website</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Welcome to My PHP Website</h1>
<nav>
<a href="about.php">About</a>
<a href="contact.php">Contact</a>
<a href="insert.php">Insert User</a>
<a href="view.php">View Users</a>
</nav>
<p><?php echo "Hello, World!"; ?></p>
<p>Current date and time is: <?php echo date('Y-m-d H:i:s'); ?></p>
</body>
</html>
Conclusion
You’ve now expanded your PHP website to connect to a MySQL database! You’ve learned how to set up a MySQL database, connect to it using PHP, insert data into the database, and retrieve data to display on your website. With these skills, you can start building more complex, data-driven web applications.
Happy coding!
