目录
- 第一步:环境准备
- 为什么需要本地环境?
- 选择集成开发环境
- 第二步:安装和配置环境
- 安装 XAMPP (推荐)
- 启动和测试 Apache 和 MySQL
- 配置环境变量 (可选,但推荐)
- 第三步:基础概念与工具
- 了解目录结构
- 使用代码编辑器
- 使用 phpMyAdmin 管理数据库
- 第四步:编写你的第一个 PHP + MySQL 程序
- 项目:简易待办事项列表
- 步骤 1:创建数据库和表
- 步骤 2:连接数据库 (
db_connect.php) - 步骤 3:显示所有待办事项 (
index.php) - 步骤 4:添加新的待办事项 (
add_task.php) - 步骤 5:删除待办事项 (
delete_task.php)
- 第五步:总结与进阶
第一步:环境准备
为什么需要本地环境?
在开发网站时,你需要在本地电脑上编写、测试代码,然后再部署到服务器上,本地环境模拟了真实服务器环境,让你可以在不花钱、不影响线上服务的情况下进行开发和调试。

选择集成开发环境
手动安装 Apache、MySQL、PHP 等软件非常繁琐,而且容易出错。集成开发环境 将这些软件打包在一起,一键安装,极大简化了配置过程。
强烈推荐使用 XAMPP,它是一个免费、开源、跨平台的解决方案,包含了:
- X (cross-platform) - 跨平台
- Apache - Web 服务器
- MySQL - 数据库
- PHP - 编程语言
- Perl - 另一种编程语言
下载地址:https://www.apachefriends.org/
第二步:安装和配置环境
安装 XAMPP
- 访问 XAMPP 官方下载页面,选择与你操作系统(Windows, macOS, Linux)对应的版本下载。
- 运行下载的安装程序,按照向导的提示进行安装,在 Windows 上,一路点击 "Next" 即可,建议安装在非系统盘(如 D:\xampp)。
- 安装完成后,不要立即启动所有组件,我们先进行一些基本配置。
启动和测试 Apache 和 MySQL
-
打开 XAMPP Control Panel(在开始菜单或安装目录中找到)。
(图片来源网络,侵删) -
你会看到 "Apache" 和 "MySQL" 两行,每行后面都有 "Start" 和 "Admin" 按钮。
-
点击 "Start" 按钮来启动 Apache 和 MySQL,如果启动成功,按钮会变成 "Stop"。
-
测试 Apache:
- 打开你的浏览器,访问
http://localhost或http://127.0.0.1。 - 如果看到 "XAMPP for Windows" 的欢迎页面,说明 Apache 安装和配置成功!
- 打开你的浏览器,访问
-
测试 MySQL:
(图片来源网络,侵删)- 在 XAMPP Control Panel 中,确保 MySQL 已经启动。
- 访问
http://localhost/phpmyadmin。 - 如果看到 phpMyAdmin 的登录界面,说明 MySQL 运行正常。
配置环境变量 (可选,但推荐)
配置环境变量后,你就可以在电脑的任何目录下通过命令行(CMD 或 PowerShell)直接使用 mysql, php 等命令,非常方便。
-
Windows:
- 右键点击 "此电脑" -> "属性" -> "高级系统设置" -> "环境变量"。
- 在 "系统变量" 部分,找到
Path变量,点击 "编辑"。 - 点击 "新建",然后添加 XAMPP 的安装路径下的
php和mysql\bin目录。D:\xampp\phpD:\xampp\mysql\bin
- 一路点击 "确定" 保存。
-
macOS / Linux:
- 打开终端。
- 编辑你的 shell 配置文件(通常是
~/.zshrc或~/.bash_profile)。 - 添加以下两行(请根据你的 XAMPP 安装路径修改):
export PATH="/Applications/XAMPP/bin:$PATH" export PATH="/Applications/XAMPP/php:$PATH"
- 保存文件,然后运行
source ~/.zshrc(或对应的文件) 使其生效。
第三步:基础概念与工具
了解目录结构
XAMPP 的 Web 文件根目录是 htdocs,所有你想通过 http://localhost 访问的网站文件,都必须放在这个文件夹里。
- Windows:
D:\xampp\htdocs\ - macOS:
/Applications/XAMPP/htdocs/ - Linux:
/opt/lampp/htdocs/
使用代码编辑器
一个好的代码编辑器能让你事半功倍,强烈推荐 Visual Studio Code (VS Code),它免费、强大,并且有丰富的 PHP 和 MySQL 插件。
- 下载地址: https://code.visualstudio.com/
- 推荐插件:
- PHP Intelephense: 提供 PHP 代码智能提示和错误检查。
- Prettier - Code formatter: 自动格式化你的代码,使其更整洁。
- MySQL: 在 VS Code 中直接连接和管理数据库。
使用 phpMyAdmin 管理数据库
phpMyAdmin 是一个基于 Web 的 MySQL 数据库管理工具,非常直观。
- 访问
http://localhost/phpmyadmin。 - 创建数据库:
- 在首页的 "创建数据库" 输入框中,输入一个数据库名(
my_todo_app),然后点击 "创建"。 - 创建成功后,你可以在左侧的数据库列表中看到它。
- 在首页的 "创建数据库" 输入框中,输入一个数据库名(
第四步:编写你的第一个 PHP + MySQL 程序
我们将创建一个简单的“待办事项”应用,可以添加、查看和删除任务。
项目:简易待办事项列表
准备工作:
- 在
htdocs文件夹中,创建一个新文件夹,命名为todo_app。 - 用 VS Code 打开
todo_app文件夹。
步骤 1:创建数据库和表
- 访问
http://localhost/phpmyadmin。 - 在左侧列表中,点击你刚刚创建的数据库
my_todo_app。 - 在 "创建表" 输入框中,输入表名
tasks,列数设为3,然后点击 "执行"。 - 填写表的字段信息:
- id:
- 类型:
INT - 长度/值:
11 - 主键: 勾选
- AI: 勾选 (Auto Increment,自动递增)
- 类型:
- task:
- 类型:
VARCHAR - 长度/值:
255
- 类型:
- created_at:
- 类型:
TIMESTAMP - 默认:
CURRENT_TIMESTAMP
- 类型:
- id:
- 点击 "保存"。
步骤 2:连接数据库 (db_connect.php)
在 todo_app 文件夹中,创建一个新文件 db_connect.php,这个文件将负责连接我们的数据库。
<?php
// 数据库连接参数
$servername = "localhost";
$username = "root"; // XAMPP 默认用户名
$password = ""; // XAMPP 默认密码为空
$dbname = "my_todo_app";
// 创建连接
$conn = new mysqli($servername, $username, $password, $dbname);
// 检查连接是否成功
if ($conn->connect_error) {
die("连接失败: " . $conn->connect_error);
}
// echo "连接成功!"; // 调试时可以取消注释
?>
**步骤 3:显示所有待办事项 (index.php)`
这是我们的主页面,用于显示所有任务。
<?php
require_once 'db_connect.php'; // 引入数据库连接文件
// 查询所有任务
$sql = "SELECT id, task FROM tasks";
$result = $conn->query($sql);
?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">我的待办事项</title>
<style>
body { font-family: sans-serif; max-width: 800px; margin: 20px auto; }
ul { list-style: none; padding: 0; }
li { display: flex; justify-content: space-between; align-items: center; padding: 10px; border: 1px solid #ccc; margin-bottom: 5px; }
a { color: red; text-decoration: none; }
</style>
</head>
<body>
<h1>我的待办事项</h1>
<form action="add_task.php" method="post">
<input type="text" name="task_name" placeholder="输入新任务..." required>
<button type="submit">添加</button>
</form>
<hr>
<h2>任务列表</h2>
<ul>
<?php
if ($result->num_rows > 0) {
// 输出每条数据
while($row = $result->fetch_assoc()) {
echo "<li>";
echo "<span>" . htmlspecialchars($row["task"]) . "</span>";
echo "<a href='delete_task.php?id=" . $row["id"] . "'>删除</a>";
echo "</li>";
}
} else {
echo "<li>暂无任务</li>";
}
?>
</ul>
</body>
</html>
<?php
$conn->close(); // 关闭数据库连接
?>
步骤 4:添加新的待办事项 (add_task.php)
这个文件处理表单提交,将新任务插入数据库。
<?php
require_once 'db_connect.php';
// 检查是否通过 POST 方法提交
if ($_SERVER["REQUEST_METHOD"] == "POST") {
// 获取并清理用户输入
$task_name = trim($_POST['task_name']);
if (!empty($task_name)) {
// 使用预处理语句来防止 SQL 注入
$stmt = $conn->prepare("INSERT INTO tasks (task) VALUES (?)");
$stmt->bind_param("s", $task_name); // "s" 表示字符串类型
if ($stmt->execute()) {
echo "新任务添加成功!";
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
$stmt->close();
}
}
$conn->close();
// 重定向回主页面
header('Location: index.php');
exit;
?>
步骤 5:删除待办事项 (delete_task.php)
这个文件根据 URL 中的 id 参数来删除对应的任务。
<?php
require_once 'db_connect.php';
// 检查是否有 id 参数
if (isset($_GET['id'])) {
$id = $_GET['id'];
// 使用预处理语句删除任务
$stmt = $conn->prepare("DELETE FROM tasks WHERE id = ?");
$stmt->bind_param("i", $id); // "i" 表示整数类型
if ($stmt->execute()) {
// echo "任务删除成功!"; // 调试用
} else {
echo "Error deleting record: " . $conn->error;
}
$stmt->close();
}
$conn->close();
// 重定向回主页面
header('Location: index.php');
exit;
?>
运行你的应用
- 确保你的 XAMPP 中的 Apache 和 MySQL 服务正在运行。
- 打开浏览器,访问
http://localhost/todo_app/index.php。 - 你现在应该能看到一个可以添加、查看和删除任务的简单网页了!
第五步:总结与进阶
恭喜!你已经成功搭建了 PHP + MySQL 环境,并完成了你的第一个完整的应用。
回顾我们做了什么:
- 安装了 XAMPP 环境。
- 学习了如何启动 Apache 和 MySQL。
- 使用 phpMyAdmin 创建了数据库和表。
- 编写了 PHP 代码来连接数据库、查询数据、插入数据和删除数据。
- 使用了 预处理语句 来防止 SQL 注入,这是一个非常重要的安全实践!
接下来的进阶方向:
- 学习更高级的 PHP: 了解面向对象编程、命名空间、Composer 等。
- 学习前端技术: HTML, CSS, JavaScript,以及现代框架如 Vue.js 或 React,让你的应用更美观、交互性更强。
- 使用 MVC 框架: 尝试使用 Laravel 或 Symfony 这样的框架,它们能帮你组织更复杂的项目代码。
- 深入学习 MySQL: 学习更复杂的查询(JOIN)、索引、事务等。
这个教程只是一个起点,PHP 和 MySQL 的世界非常广阔,祝你学习愉快!
