In diesem Tutorial erstellen wir eine funktionsfähige TodoList-Anwendung mit Lithe. Sie erfahren, wie Sie Ihr Projekt strukturieren, interaktive Ansichten erstellen und eine RESTful-API zur Verwaltung Ihrer Aufgaben implementieren. Dieses Projekt wird als hervorragendes Beispiel dafür dienen, wie man moderne Webanwendungen mit PHP erstellt.
Erstellen wir zunächst ein neues Lithe-Projekt:
composer create-project lithephp/lithephp todo-app cd todo-app
Bearbeiten Sie die .env-Datei im Stammverzeichnis des Projekts mit der folgenden Konfiguration:
DB_CONNECTION_METHOD=mysqli DB_CONNECTION=mysql DB_HOST=localhost DB_NAME=lithe_todos DB_USERNAME=root DB_PASSWORD= DB_SHOULD_INITIATE=true
Führen Sie den Befehl aus, um eine neue Migration zu erstellen:
php line make:migration CreateTodosTable
Bearbeiten Sie die generierte Migrationsdatei in 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);
}
};
Migration ausführen:
php line migrate
Neues Modell generieren:
php line make:model Todo
Bearbeiten Sie die Datei 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();
}
}
Neuen Controller erstellen:
php line make:controller TodoController
Bearbeiten Sie die Datei 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'
]);
}
}
Erstellen Sie das Verzeichnis src/views/todo und fügen Sie die Datei index.php hinzu:
<!DOCTYPE html>
<html>
<head>
<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>
</head>
<body>
<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();
Um den Entwicklungsserver zu starten, führen Sie Folgendes aus:
php line serve
Greifen Sie in Ihrem Browser auf http://localhost:8000 zu, um die Anwendung in Aktion zu sehen.
Unsere TodoList verfügt über die folgenden Funktionen:
Sie verfügen jetzt über eine voll funktionsfähige TodoList-Anwendung, die mit Lithe erstellt wurde. Dieses Beispiel zeigt, wie Sie eine moderne Webanwendung mit PHP erstellen, einschließlich:
Von hier aus können Sie die Anwendung erweitern, indem Sie neue Funktionen hinzufügen, wie zum Beispiel:
Um mehr über Lithe zu erfahren, besuchen Sie den Linktree, wo Sie auf den Discord, die Dokumentation und vieles mehr zugreifen können!
Das obige ist der detaillierte Inhalt vonErstellen einer TodoList mit PHP und dem Lithe Framework: Eine vollständige Anleitung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Vergleichsanalyse zwischen Win10 Home-Version und Professional-Version
So registrieren Sie ein Bitcoin-Wallet
Webstorm wurde auf chinesische Version geändert
Beliebte Erklärung, was Metaverse XR bedeutet
Tutorial zum Festlegen des Startkennworts für Windows 10
Was ist Topologieoptimierung?
Konvertierung der Unicode-Kodierung
Verwendung der Sortierfunktion c++sort
