Cours intensif PHP : Plateforme de blog simple
Une plateforme de blogs de base où les utilisateurs peuvent publier, modifier et supprimer des articles. Construit en utilisant PHP, HTML, jQuery, AJAX, JSON, Bootstrap, CSS et MySQL.
Sujets : php, mysql, blog, ajax, bootstrap, jquery, css
Solution étape par étape
1. Structure des répertoires
simple-blog-platform/ │ ├── config.sample.php ├── index.html ├── db/ │ └── database.sql ├── src/ │ ├── get-post.php │ └── post-handler.php ├── include/ │ ├── config.sample.php │ └── db.php ├── assets/ │ ├── css/ │ │ └── style.css │ ├── js/ │ │ └── script.js │ └── images/ ├── README.md └── .gitignore
2. Schéma de base de données
db/database.sql :
CREATE DATABASE IF NOT EXISTS blog_db;
USE blog_db;
CREATE TABLE IF NOT EXISTS posts (
id INT AUTO_INCREMENT PRIMARY KEY,
title VARCHAR(255) NOT NULL,
content TEXT NOT NULL,
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);
3. Fichier de configuration
include/config.sample.php :
<?php
define('DB_HOST', 'localhost'); // Database host
define('DB_NAME', 'blog_db'); // Database name
define('DB_USER', 'root'); // Change if necessary
define('DB_PASS', ''); // Change if necessary
?>
4. Configurer la connexion à la base de données
include/db.php :
<?php
include 'config.php';
// Database configuration
$dsn = 'mysql:host='.DB_HOST.';dbname='.DB_NAME;
$options = [
PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC,
];
// Create a new PDO instance
try {
$pdo = new PDO($dsn, DB_USER, DB_PASS, $options);
$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); // Set error mode to exception
} catch (PDOException $e) {
echo 'Connection failed: ' . $e->getMessage(); // Display error message if connection fails
}
?>
5. Structure HTML et PHP
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple Blog</title>
<link rel="stylesheet" href="assets/css/style.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<h1 class="mt-5">Simple Blog</h1>
<div id="posts"></div>
<button class="btn btn-primary mt-3" data-toggle="modal" data-target="#postModal">Add Post</button>
</div>
<!-- Modal for adding/editing posts -->
<div class="modal fade" id="postModal" tabindex="-1" role="dialog" aria-labelledby="postModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="postModalLabel">Add Post</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form id="postForm">
<input type="hidden" id="postId">
<div class="form-group">
<label for="title">Title</label>
<input type="text" class="form-control" id="title" required>
</div>
<div class="form-group">
<label for="content">Content</label>
<textarea class="form-control" id="content" rows="3" required></textarea>
</div>
<button type="submit" class="btn btn-primary">Save Post</button>
</form>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.2/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/script.js"></script>
</body>
</html>
6. Javascript et AJAX
assets/js/script.js
$(document).ready(function() {
// Load posts when the page loads
loadPosts();
// Handle form submission
$('#postForm').submit(function(event) {
event.preventDefault(); // Prevent default form submission
var postId = $('#postId').val();
var title = $('#title').val();
var content = $('#content').val();
$.ajax({
url: 'src/post-handler.php',
type: 'POST',
dataType: 'json',
data: {
id: postId,
title: title,
content: content
},
success: function(response) {
if (response.success) {
$('#postModal').modal('hide');
loadPosts(); // Reload posts after saving
} else {
alert('Error: ' + response.message);
}
}
});
});
// Load posts function
function loadPosts() {
$.ajax({
url: 'src/get-posts.php',
type: 'GET',
dataType: 'json',
success: function(data) {
var postsHtml = '';
$.each(data.posts, function(index, post) {
postsHtml += '<div class="post"><h2>' + post.title + '</h2><p>' + post.content + '</p></div>';
});
$('#posts').html(postsHtml);
}
});
}
});
7. Scripts PHP back-end
src/get-posts.php
<?php
include '../include/db.php';
header('Content-Type: application/json');
try {
$stmt = $pdo->query('SELECT * FROM posts ORDER BY created_at DESC');
$posts = $stmt->fetchAll(PDO::FETCH_ASSOC);
echo json_encode(['posts' => $posts]);
} catch (PDOException $e) {
echo json_encode(['error' => $e->getMessage()]);
}
?>
src/post-handler.php
<?php
include '../include/db.php';
header('Content-Type: application/json');
// Retrieve POST data
$id = isset($_POST['id']) ? intval($_POST['id']) : 0;
$title = $_POST['title'];
$content = $_POST['content'];
try {
if ($id > 0) {
// Update existing post
$stmt = $pdo->prepare('UPDATE posts SET title = ?, content = ? WHERE id = ?');
$stmt->execute([$title, $content, $id]);
} else {
// Insert new post
$stmt = $pdo->prepare('INSERT INTO posts (title, content) VALUES (?, ?)');
$stmt->execute([$title, $content]);
}
echo json_encode(['success' => true]);
} catch (PDOException $e) {
echo json_encode(['success' => false, 'message' => $e->getMessage()]);
}
?>
6. Style CSS
actifs/css/style.css
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
.container {
margin-top: 20px;
}
.post {
border: 1px solid #ddd;
padding: 15px;
margin-bottom: 15px;
background-color: #f9f9f9;
}
Documentation et commentaires
- config.php : Contient la configuration de la base de données et se connecte à MySQL à l'aide de PDO.
- index.php : Page principale avec structure HTML, comprend Bootstrap pour le style et un modal pour l'ajout/la modification de messages.
- assets/js/script.js : Gère les requêtes AJAX pour le chargement et l'enregistrement des publications. Utilise jQuery pour la manipulation DOM et AJAX.
- get-posts.php : Récupère les publications de la base de données et les renvoie au format JSON.
- post-handler.php : Gère la création et la mise à jour des publications en fonction de la présence d'un identifiant.
Cette configuration fournit une plate-forme de blog de base sur laquelle les utilisateurs peuvent ajouter et modifier des articles. Vous pouvez étendre cela en ajoutant l'authentification des utilisateurs, les catégories de publications, les commentaires et bien plus encore.
Liens de connexion
Si vous avez trouvé cette série utile, pensez à donner une étoile au référentiel sur GitHub ou à partager la publication sur vos réseaux sociaux préférés ?. Votre soutien signifierait beaucoup pour moi !
Si vous souhaitez du contenu plus utile comme celui-ci, n'hésitez pas à me suivre :
- GitHub
Code source
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Outils d'IA chauds
Undress AI Tool
Images de déshabillage gratuites
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Clothoff.io
Dissolvant de vêtements AI
Video Face Swap
Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !
Article chaud
Outils chauds
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Sujets chauds
Comment rester à jour avec les derniers développements PHP et meilleures pratiques?
Jun 23, 2025 am 12:56 AM
TostayCurrentwithPhpDevelopments andBestPractices, suiventyewnewsources likephp.netandphpweekly, engagewithcommunitiesonforumums et conférences, keeptoolingupdated etgradualadoptnewfeatures, etreadorontruttetoopensourceprojects.
Qu'est-ce que PHP et pourquoi est-il utilisé pour le développement Web?
Jun 23, 2025 am 12:55 AM
PhpBecamepopularforwebDevelopmentDuetoitSeaseOflearning, Samoussentegration withhtml, widespreadhostingsupport, andalargecosystemysteclustingframeworkslikeLaravelandcmsplateformeslikewordpress.itexcelSinlingFormSubMissions, ManagetingSeSeSessions, interactif, interactif
Comment définir le fuseau horaire PHP?
Jun 25, 2025 am 01:00 AM
Tosetherighttimezoneinphp, usedate_default_timezone_set () Fonctionnellestartofyourscriptwithavalididentifiersuchas'america / new_york'.1.usedate_default_timezone_set () beforeanydate / timefunctions.20
Comment valider la saisie des utilisateurs dans PHP pour m'assurer qu'il répond à certains critères?
Jun 22, 2025 am 01:00 AM
TovalidateUserInputinPhp, usebuilt-invalidationfunctions likeFilter_var () etFilter_Input (), appliquerareArexpressionsforcustomFormatsSuchasUserNameSorphonEnombers
Quelles sont les meilleures pratiques pour écrire du code PHP propre et maintenable?
Jun 24, 2025 am 12:53 AM
La clé pour écrire le code PHP propre et facile à maintenir réside dans une dénomination claire, des normes suivantes, une structure raisonnable, une bonne utilisation des commentaires et une testabilité. 1. Utilisez des variables claires, des fonctions et des noms de classe, tels que $ userdata et calculatotalprice (); 2. Suivez le style de code unifié standard PSR-12; 3. Divisez la structure du code en fonction des responsabilités et organisez-la à l'aide de catalogues MVC ou de style Laravel; 4. Évitez le code de style nouilles et divisez la logique en petites fonctions avec une seule responsabilité; 5. Ajouter des commentaires aux points clés et écrire des documents d'interface pour clarifier les paramètres, les valeurs de retour et les exceptions; 6. Améliorer la testabilité, adopter l'injection de dépendance, réduire l'état mondial et les méthodes statiques. Ces pratiques améliorent la qualité du code, l'efficacité de la collaboration et la facilité de post-maintenance.
Qu'est-ce que la sérialisation des données dans PHP (Serialize (), Unserialize ())?
Jun 22, 2025 am 01:03 AM
ThePhpFunctionSerialize () andUnserialize () sont utilisés pour le stobercomplexdatasterDestoRoSintOsTorasandAbackAgain.1.Serialize () C onvertsDatalikECarraysorObjectSraystringContainingTypeandStructureInformation.2
Comment intégrer le code PHP dans un fichier HTML?
Jun 22, 2025 am 01:00 AM
Vous pouvez intégrer le code PHP dans des fichiers HTML, mais assurez-vous que le fichier a une extension de .php afin que le serveur puisse l'analyser correctement. Utilisez des balises standard pour envelopper le code PHP, insérez le contenu dynamique n'importe où dans HTML. De plus, vous pouvez changer plusieurs fois PHP et HTML dans le même fichier pour réaliser des fonctions dynamiques telles que le rendu conditionnel. Assurez-vous de prêter attention à la configuration du serveur et à l'exactitude de la syntaxe pour éviter les problèmes causés par de courtes étiquettes, des erreurs de devis ou des étiquettes de fin omises.
Comment exécuter des requêtes SQL à l'aide de PHP?
Jun 24, 2025 am 12:54 AM
Oui, YouCanrunsqlQueriesUsingPhp, et theprocessInvolvesChoosingAdatabaseextenten, ConnectTotheDatabase, ExecutingQueessaFely, andcosingConnectionSwhendOne.Todothis, FirstChooseBetweenmysqliorpDo, avec unplaying
