在本教程中,我们将使用 Lithe 创建一个功能性的 TodoList 应用程序。您将学习如何构建项目、创建交互式视图以及实施 RESTful API 来管理您的任务。该项目将作为如何使用 PHP 构建现代 Web 应用程序的绝佳示例。
先决条件
- PHP 7.4 或更高版本
- 已安装作曲家
- MySQL
- PHP 和 JavaScript 基础知识
项目结构
首先,让我们创建一个新的 Lithe 项目:
composer create-project lithephp/lithephp todo-app cd todo-app
设置数据库
使用以下配置编辑项目根目录中的 .env 文件:
DB_CONNECTION_METHOD=mysqli DB_CONNECTION=mysql DB_HOST=localhost DB_NAME=lithe_todos DB_USERNAME=root DB_PASSWORD= DB_SHOULD_INITIATE=true
创建迁移
运行命令来创建新的迁移:
php line make:migration CreateTodosTable
在 src/database/migrations/ 中编辑生成的迁移文件:
return new class { public function up(mysqli $db): void { $query = " CREATE TABLE IF NOT EXISTS todos ( id INT(11) AUTO_INCREMENT PRIMARY KEY, title VARCHAR(255) NOT NULL, completed BOOLEAN DEFAULT FALSE, created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP, updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP ) "; $db->query($query); } public function down(mysqli $db): void { $query = "DROP TABLE IF EXISTS todos"; $db->query($query); } };
运行迁移:
php line migrate
实施模型
生成一个新模型:
php line make:model Todo
编辑文件 src/models/Todo.php:
namespace App\Models; use Lithe\Database\Manager as DB; class Todo { public static function all(): array { return DB::connection() ->query("SELECT * FROM todos ORDER BY created_at DESC") ->fetch_all(MYSQLI_ASSOC); } public static function create(array $data): ?array { $stmt = DB::connection()->prepare( "INSERT INTO todos (title, completed) VALUES (?, ?)" ); $completed = false; $stmt->bind_param('si', $data['title'], $completed); $success = $stmt->execute(); if ($success) { $id = $stmt->insert_id; return [ 'id' => $id, 'title' => $data['title'], 'completed' => $completed ]; } return null; } public static function update(int $id, array $data): bool { $stmt = DB::connection()->prepare( "UPDATE todos SET completed = ? WHERE id = ?" ); $stmt->bind_param('ii', $data['completed'], $id); return $stmt->execute(); } public static function delete(int $id): bool { $stmt = DB::connection()->prepare("DELETE FROM todos WHERE id = ?"); $stmt->bind_param('i', $id); return $stmt->execute(); } }
创建控制器
生成一个新的控制器:
php line make:controller TodoController
编辑文件 src/http/controllers/TodoController.php:
namespace App\Http\Controllers; use App\Models\Todo; use Lithe\Http\Request; use Lithe\Http\Response; class TodoController { public static function index(Request $req, Response $res) { return $res->view('todo.index'); } public static function list(Request $req, Response $res) { $todos = Todo::all(); return $res->json($todos); } public static function store(Request $req, Response $res) { $data = (array) $req->body(); $todo = Todo::create($data); $success = $todo ? true : false; return $res->json([ 'success' => $success, 'message' => $success ? 'Task created successfully' : 'Failed to create task', 'todo' => $todo ]); } public static function update(Request $req, Response $res) { $id = $req->param('id'); $data = (array) $req->body(); $success = Todo::update($id, $data); return $res->json([ 'success' => $success, 'message' => $success ? 'Task updated successfully' : 'Failed to update task' ]); } public static function delete(Request $req, Response $res) { $id = $req->param('id'); $success = Todo::delete($id); return $res->json([ 'success' => $success, 'message' => $success ? 'Task removed successfully' : 'Failed to remove task' ]); } }
创建视图
创建src/views/todo目录并添加index.php文件:
<title>TodoList with Lithe</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> * { margin: 0; padding: 0; box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; } body { min-height: 100vh; background-color: #ffffff; padding: 20px; } .container { max-width: 680px; margin: 0 auto; padding: 40px 20px; } h1 { color: #1d1d1f; font-size: 34px; font-weight: 700; margin-bottom: 30px; } .todo-form { display: flex; gap: 12px; margin-bottom: 30px; border-bottom: 1px solid #e5e5e7; padding-bottom: 30px; } .todo-input { flex: 1; padding: 12px 16px; font-size: 17px; border: 1px solid #e5e5e7; border-radius: 10px; background-color: #f5f5f7; transition: all 0.2s; } .todo-input:focus { outline: none; background-color: #ffffff; border-color: #0071e3; } .add-button { padding: 12px 20px; background: #0071e3; color: white; border: none; border-radius: 10px; font-size: 15px; font-weight: 500; cursor: pointer; transition: all 0.2s; } .add-button:hover { background: #0077ED; } .todo-list { list-style: none; } .todo-item { display: flex; align-items: center; padding: 16px; border-radius: 10px; margin-bottom: 8px; transition: background-color 0.2s; } .todo-item:hover { background-color: #f5f5f7; } .todo-checkbox { width: 22px; height: 22px; margin-right: 15px; cursor: pointer; } .todo-text { flex: 1; font-size: 17px; color: #1d1d1f; } .completed { color: #86868b; text-decoration: line-through; } .delete-button { padding: 8px 12px; background: none; color: #86868b; border: none; border-radius: 6px; font-size: 15px; cursor: pointer; opacity: 0; transition: all 0.2s; } .todo-item:hover .delete-button { opacity: 1; } .delete-button:hover { background: #f5f5f7; color: #ff3b30; } .loading { text-align: center; padding: 20px; color: #86868b; } .error { color: #ff3b30; text-align: center; padding: 20px; } </style> <div> <p>Aqui está a tradução para o inglês:</p> <hr> <h2> Setting Up the Routes </h2> <p>Update the src/App.php file to include the TodoList routes:<br> </p> <pre class="brush:php;toolbar:false">use App\Http\Controllers\TodoController; $app = new \Lithe\App; // Route for the main page $app->get('/', [TodoController::class, 'index']); // API routes $app->get('/todos/list', [TodoController::class, 'list']); $app->post('/todos', [TodoController::class, 'store']); $app->put('/todos/:id', [TodoController::class, 'update']); $app->delete('/todos/:id', [TodoController::class, 'delete']); $app->listen();
运行应用程序
要启动开发服务器,请运行:
php line serve
在浏览器中访问 http://localhost:8000 以查看正在运行的应用程序。
实现的功能
我们的 TodoList 具有以下功能:
- 按时间倒序列出任务
- 添加新任务
- 将任务标记为已完成/待处理
- 删除任务
- 响应灵敏且用户友好的界面
- 所有操作的视觉反馈
- 错误处理
结论
您现在拥有一个使用 Lithe 构建的功能齐全的 TodoList 应用程序。此示例演示了如何使用 PHP 创建现代 Web 应用程序,包括:
- 正确的 MVC 代码结构
- RESTful API 实现
- 交互式用户界面
- 数据库集成
- 错误处理
- 用户反馈
从这里,您可以通过添加新功能来扩展应用程序,例如:
- 用户认证
- 任务分类
- 截止日期
- 过滤和搜索
要继续了解 Lithe,请访问 Linktree,您可以在其中访问 Discord、文档等等!
以上是使用 PHP 和 Lithe 框架创建 TodoList:完整指南的详细内容。更多信息请关注PHP中文网其他相关文章!

Laravel使用其直观的闪存方法简化了处理临时会话数据。这非常适合在您的应用程序中显示简短的消息,警报或通知。 默认情况下,数据仅针对后续请求: $请求 -

这是有关用Laravel后端构建React应用程序的系列的第二个也是最后一部分。在该系列的第一部分中,我们使用Laravel为基本的产品上市应用程序创建了一个RESTFUL API。在本教程中,我们将成为开发人员

PHP客户端URL(curl)扩展是开发人员的强大工具,可以与远程服务器和REST API无缝交互。通过利用Libcurl(备受尊敬的多协议文件传输库),PHP curl促进了有效的执行

Laravel 提供简洁的 HTTP 响应模拟语法,简化了 HTTP 交互测试。这种方法显着减少了代码冗余,同时使您的测试模拟更直观。 基本实现提供了多种响应类型快捷方式: use Illuminate\Support\Facades\Http; Http::fake([ 'google.com' => 'Hello World', 'github.com' => ['foo' => 'bar'], 'forge.laravel.com' =>

您是否想为客户最紧迫的问题提供实时的即时解决方案? 实时聊天使您可以与客户进行实时对话,并立即解决他们的问题。它允许您为您的自定义提供更快的服务

在本文中,我们将在Laravel Web框架中探索通知系统。 Laravel中的通知系统使您可以通过不同渠道向用户发送通知。今天,我们将讨论您如何发送通知OV

文章讨论了PHP 5.3中引入的PHP中的晚期静态结合(LSB),从而允许静态方法的运行时分辨率调用以获得更灵活的继承。 LSB的实用应用和潜在的触摸

PHP日志记录对于监视和调试Web应用程序以及捕获关键事件,错误和运行时行为至关重要。它为系统性能提供了宝贵的见解,有助于识别问题并支持更快的故障排除


热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

SublimeText3 Linux新版
SublimeText3 Linux最新版

MinGW - 适用于 Windows 的极简 GNU
这个项目正在迁移到osdn.net/projects/mingw的过程中,你可以继续在那里关注我们。MinGW:GNU编译器集合(GCC)的本地Windows移植版本,可自由分发的导入库和用于构建本地Windows应用程序的头文件;包括对MSVC运行时的扩展,以支持C99功能。MinGW的所有软件都可以在64位Windows平台上运行。

适用于 Eclipse 的 SAP NetWeaver 服务器适配器
将Eclipse与SAP NetWeaver应用服务器集成。

VSCode Windows 64位 下载
微软推出的免费、功能强大的一款IDE编辑器

记事本++7.3.1
好用且免费的代码编辑器