Application CRUD avec PHP et MySQL

Objectifs

Être capable de créer, lire, mettre à jour et supprimer des données dans une base de données MySQL en utilisant le langage de programmation PHP.

Qu’est-ce que le CRUD ?

CRUD est un acronyme pour Create, Read, Update et Delete (Créer, Lire, Mettre à jour et Supprimer). C’est un ensemble d’opérations de base qui peuvent être effectuées sur une base de données. Dans cette réponse, je vais vous donner un aperçu de la création d’une application CRUD avec PHP et MySQL.
CRUD est un acronyme des noms des quatre opérations de base de la gestion de la persistance des données et applications :

Create (créer)
Read ou Retrieve (lire)
Update (mettre à jour)
Delete ou Destroy (supprimer)

Les opérations CRUD sont une manipulation de données de base pour la base de données. Nous avons déjà appris comment effectuer des opérations de création (c’est-à-dire d’insertion), de lecture (c’est-à-dire de sélection), de mise à jour et de suppression dans les chapitres précédents.
Dans ce tutoriel, nous allons créer une application PHP simple pour effectuer toutes ces opérations sur une table de base de données MySQL à un seul endroit.
Nous utilisons notre base de donnée crées ici .

Les étapes de base pour créer une application CRUD

1- Créer une base de données MySQL : Tout d’abord, vous devez créer une base de données MySQL dans votre serveur. Vous pouvez utiliser l’interface graphique de votre gestionnaire de base de données préféré ou utiliser la ligne de commande pour créer la base de données.
2- Créer une table : Créez une table dans votre base de données pour stocker les données de votre application. Définissez les colonnes de la table pour stocker les informations dont vous avez besoin. Par exemple, si vous créez une application pour gérer les contacts, vous pouvez créer une table « contacts » avec les colonnes « nom », « prénom », « email », etc.
3- Créer un formulaire d’ajout : Créez un formulaire HTML (bootstrap 5) avec les champs correspondant aux colonnes de votre table de base de données. Ce formulaire sera utilisé pour ajouter de nouveaux enregistrements à votre base de données.
4- Écrire un script PHP pour ajouter des données : Lorsque le formulaire d’ajout est soumis, le script PHP doit être exécuté pour ajouter les données à votre base de données. Le script doit se connecter à la base de données, récupérer les données soumises dans le formulaire et les ajouter à la table.
5- Créer une page de lecture : Créez une page de lecture pour afficher tous les enregistrements de votre table de base de données. Vous pouvez utiliser une boucle pour parcourir tous les enregistrements et les afficher dans un tableau ou un autre format.
6- Créer un formulaire de mise à jour : Créez un formulaire HTML (bootstrap 5) avec les champs correspondant aux colonnes de votre table de base de données. Ce formulaire sera utilisé pour mettre à jour les enregistrements existants.
7- Écrire un script PHP pour mettre à jour les données : Lorsque le formulaire de mise à jour est soumis, le script PHP doit être exécuté pour mettre à jour les données dans votre base de données. Le script doit se connecter à la base de données, récupérer les données soumises dans le formulaire et les mettre à jour dans la table.
8- Créer un formulaire de suppression : Créez un formulaire HTML avec un bouton pour supprimer un enregistrement. Lorsque le formulaire est soumis, le script PHP doit être exécuté pour supprimer l’enregistrement correspondant de votre base de données.
9- Écrire un script PHP pour supprimer les données : Lorsque le formulaire de suppression est soumis, le script PHP doit être exécuté pour supprimer l’enregistrement correspondant de votre base de données. Le script doit se connecter à la base de données et supprimer l’enregistrement.

Arborescence de votre site

Voici une suggestion d’arborescence pour réaliser un site web backend et frontend en PHP et Bootstrap 5 composé de plusieurs tables MySQL selon les standards :

Arborescence

_  /racine/
____  /assets/
________  /css/
__________ /bootstrap.css
__________ /bootstrap.min.css
__________ /custom.css
________  /js/
__________ /bootstrap.bundle.js
__________ /bootstrap.bundle.min.js
__________ /bootstrap.js
__________ /bootstrap.min.js
__________ /jquery.min.js
____  /includes/
______ /config.php (fichier pour les informations de configuration générales du site)
______ /db_connect.php (fichier pour la connexion à la base de données)
______ /functions.php (fichier contenant les fonctions réutilisables)
______ /header.php (fichier contenant la section header réutilisable)
______ /footer.php (fichier contenant la section footer réutilisable)
____  /backend ou admin/
______ /index.php (page d’accueil du backend)
______ /login.php (page de connexion du backend)
______ /dashboard.php (page de tableau de bord du backend)
______ /table1/
________ /create.php
________ /read.php
________ /update.php
________ /delete.php
______ /table2/
________ /create.php
________ /read.php
________ /update.php
________ /delete.php
______ /table3/
________ /create.php
________ /read.php
________ /update.php
________ /delete.php
____  /frontend ou public/
______ /index.php (page d’accueil du frontend)

Description

Dans cette arborescence, le dossier « assets » contient les fichiers CSS et JavaScript de Bootstrap 5 et un fichier CSS personnalisé pour la mise en page de l’application.
Dans un site web PHP, le dossier « assets » peut contenir des fichiers tels que des images, des polices, des fichiers CSS pour la mise en page et la conception, des fichiers JavaScript pour la fonctionnalité client-side, des fichiers de thème et d’autres fichiers similaires qui sont nécessaires pour la mise en page ou la conception de la page web.
Le dossier « includes » contient les fichiers PHP nécessaires pour l’application, tels que les fichiers de connexion à la base de données, les fonctions réutilisables, et les fichiers pour la section header et footer réutilisables.
Le dossier « includes » est un dossier communément utilisé dans les sites web PHP pour stocker les fichiers PHP qui sont inclus dans les différentes pages du site. Les fichiers stockés dans ce dossier sont généralement des fichiers qui contiennent des codes réutilisables, comme des fonctions, des classes ou des sections de code HTML.
Le dossier « backend » contient les fichiers pour la partie administration du site, tels que la page d’accueil, la page de connexion, le tableau de bord et les fichiers CRUD pour chaque table de la base de données.
Le dossier « backend » est généralement utilisé pour stocker les fichiers PHP qui gèrent la partie administration ou la partie privée d’un site web. Ce dossier contient donc les fichiers qui permettent aux administrateurs de gérer les fonctionnalités du site, tels que la gestion des utilisateurs, des produits, des commandes, etc.
Le dossier « frontend » contient les fichiers pour la partie publique du site, tels que la page d’accueil et les pages de contenu supplémentaires.
Dans un site web en PHP, le dossier « frontend » peut contenir les fichiers PHP qui affichent les pages web dynamiques générées à partir de données stockées dans une base de données. Ces fichiers peuvent inclure du code HTML, CSS et JavaScript pour la mise en forme et l’interaction avec l’utilisateur. Ils peuvent également inclure des fichiers d’inclusion pour la réutilisation de code commun à plusieurs pages.
Le dossier « images » contient toutes les images utilisées dans l’application.
Il est important de noter que cette arborescence peut être adaptée en fonction des besoins spécifiques de votre projet.

Les principaux fichiers
Les fichiers config.php et db_connect.php

Les fichiers config.php et db_connect.php sont deux fichiers clés pour la configuration et la connexion à une base de données MySQL dans un site web PHP.
Le fichier config.php contient généralement des constantes qui stockent les informations de configuration générales du site, telles que les informations de connexion à la base de données, les paramètres de configuration du site, etc.
Voici un exemple de contenu typique du fichier config.php :

<?php // Configuration des informations de la base de données define('DB_HOST', 'localhost'); define('DB_USER', 'votre_nom_utilisateur'); define('DB_PASS', 'votre_mot_de_passe'); define('DB_NAME', 'nom_de_la_base_de_donnees'); // Configuration du site web define('SITE_NAME', 'Nom_du_site'); define('BASE_URL', 'http://localhost/chemin/vers/le/site'); ?>

Le fichier db_connect.php contient généralement le code pour se connecter à la base de données MySQL à partir de PHP. Il peut également inclure des fonctions utiles pour l’exécution de requêtes SQL et la manipulation de données.
Voici un exemple de contenu typique du fichier db_connect.php :

<?php // Inclure le fichier de configuration require_once('config.php'); // Connexion à la base de données avec PDO try { $dsn = "mysql:host=".DB_HOST.";dbname=".DB_NAME; $pdo = new PDO($dsn, DB_USER, DB_PASS); $pdo->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE, PDO::FETCH_OBJ); } catch(PDOException $e){ die("La connexion a échoué: " . $e->getMessage()); } // Fonction pour exécuter une requête SQL avec PDO function executeQuery($query){ global $pdo; $result = $pdo->query($query); return $result; } ?>

Le fichier header.php

Le fichier header.php est un fichier communément utilisé dans les sites web pour inclure le code HTML et les éléments visuels qui sont répétés sur toutes les pages du site, tels que la barre de navigation, le logo du site, les liens vers les réseaux sociaux, etc.
Le contenu d’un fichier header.php dépendra du design et des fonctionnalités du site web, mais en général, il contiendra des éléments tels que :

La balise <!DOCTYPE html> et la balise pour définir le type de document HTML
La balise <head> pour inclure les balises <meta> pour la description du site, les liens vers les fichiers CSS et JavaScript, etc.
La balise <body> pour contenir le contenu du corps de la page
La barre de navigation principale avec les liens vers les différentes sections du site
Le logo du site avec un lien vers la page d’accueil
Les liens vers les réseaux sociaux
Tout autre élément visuel répété sur toutes les pages du site, comme un formulaire de recherche, une bannière, etc.

<?php <!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Mon site web</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.2/css/bootstrap.min.css"> <link rel="stylesheet" href="style.css"> </head> <body> <header> <nav class="navbar navbar-expand-lg navbar-light bg-light"> <div class="container-fluid"> <a class="navbar-brand" href="#">Mon site web</a> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNav"> <ul class="navbar-nav"> <li class="nav-item"> <a class="nav-link" href="#">Accueil</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Produits</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Services</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Contact</a> </li> </ul> </div> </div> </nav> </header> ?>

Le footer.php

Le fichier footer.php est communément utilisé dans les sites web réalisés en PHP avec Bootstrap 5 pour inclure les éléments communs au pied de page de chaque page du site, tels que les liens de navigation secondaire, les coordonnées de contact, les mentions légales, etc.
Le contenu exact du fichier footer.php peut varier en fonction du site, mais il contient généralement des éléments tels que :

Les informations de contact de l’entreprise ou de l’organisation (adresse, numéro de téléphone, adresse e-mail)
Les liens vers les pages importantes du site (Accueil, Produits, Services, Contact, À propos, etc.)
Les liens vers les réseaux sociaux de l’entreprise ou de l’organisation (Facebook, Twitter, Instagram, etc.)
Les mentions légales et les conditions d’utilisation du site

Voici un exemple de contenu pour un fichier footer.php pour un site web réalisé en PHP avec Bootstrap 5 :

<?php <footer> <div class="container-fluid"> <div class="row"> <div class="col-sm-6"> <h3>Nous contacter</h3> <p>123 rue du Commerce<br> 75000 Paris</p> <p>Tél: 01 23 45 67 89<br> Email: contact@monsiteweb.com</p> </div> <div class="col-sm-6"> <h3>Nos réseaux sociaux</h3> <ul class="list-inline"> <li class="list-inline-item"><a href="#"><i class="fab fa-facebook-f"></i></a></li> <li class="list-inline-item"><a href="#"><i class="fab fa-twitter"></i></a></li> <li class="list-inline-item"><a href="#"><i class="fab fa-instagram"></i></a></li> </ul> </div> </div> <div class="row"> <div class="col-sm-12"> <p>© 2023 Mon site web. Tous droits réservés.</p> </div> </div> </div> </footer> ?>

Création du fichier de configuration

Après avoir créé la table, nous devons créer un script PHP afin de nous connecter au serveur de base de données MySQL. Créons un fichier nommé « config.php » et insérons-y le code suivant.

Application CRUD avec PHP et MySQL

Création de la page de destination

Nous allons d’abord créer une page d’accueil pour notre application CRUD qui contient une grille de données montrant les enregistrements de la table de base de données des apprenants.
Il comporte également des icônes d’action pour chaque enregistrement affiché dans la grille, que vous pouvez choisir d’afficher ses détails, de le mettre à jour ou de le supprimer.
Nous allons également ajouter un bouton de création en haut de la grille de données qui peut être utilisé pour créer de nouveaux enregistrements dans la table des apprenants.

Insérer plusieurs lignes dans une table MySQL avec PDO PHP

Créez un fichier nommé « index.php » et insérez-y le code suivant :

Création de la page d’ajout d’apprenants

Dans cette partie, nous allons construire la fonctionnalité Create de notre application CRUD.
Créer un fichier nommé « create.php » et insérons-y le code suivant. Il générera un formulaire Web qui peut être utilisé pour insérer des enregistrements dans la table des apprenants .
Vous pouvez télécharger le fichier d’ici

Application

L’objectif de cette application est de permettre aux enseignants d’un lycée de saisir les notes des étudiants pour chaque cours et chaque examen. Les enseignants pourront se connecter à l’application, accéder aux cours qu’ils enseignent, saisir les notes des étudiants et les sauvegarder dans une base de données. Les étudiants pourront également accéder à leurs propres notes à partir d’une interface utilisateur dédiée.
Pour développer cette application, vous utiliserez PHP pour la logique côté serveur, Bootstrap 5 pour la mise en forme des pages web et MySQL pour stocker les données.
Voici les étapes à suivre pour réaliser cette application :
Conception de la base de données

Avant de commencer à coder, vous devez concevoir la base de données pour stocker les données des notes des étudiants. Vous devez concevoir les tables pour stocker les informations des enseignants, des étudiants, des cours, des examens et des notes.

Installation et configuration de l’environnement de développement

Vous devez installer et configurer un environnement de développement pour coder l’application. Vous aurez besoin d’un serveur web, d’un serveur MySQL et d’un éditeur de code PHP tel que VS Code.

Création des pages d’inscription et de connexion des enseignants et des étudiants

Vous devez créer des pages d’inscription et de connexion pour les enseignants et les étudiants. Les enseignants devront fournir leur nom, leur adresse e-mail et leur mot de passe pour s’inscrire. Les étudiants devront fournir leur nom d’utilisateur et leur mot de passe pour se connecter.

Création de la page d’accueil de l’enseignant

Une fois connecté, l’enseignant doit être redirigé vers une page d’accueil où il pourra voir les cours qu’il enseigne et sélectionner le cours pour lequel il souhaite saisir les notes.

Création de la page de saisie des notes

Sur la page de saisie des notes, l’enseignant pourra voir la liste des étudiants inscrits au cours sélectionné et saisir les notes pour chaque examen ou devoir. Vous pouvez utiliser des formulaires HTML et des fonctions PHP pour stocker les notes dans la base de données.

Création de la page d’affichage des notes des étudiants

Les étudiants pourront accéder à une page dédiée pour voir leurs propres notes pour chaque cours et chaque examen. Vous pouvez utiliser des requêtes SQL pour récupérer les notes de chaque étudiant à partir de la base de données et les afficher sur la page.

Mise en forme des pages avec Bootstrap 5

Vous pouvez utiliser Bootstrap 5 pour mettre en forme les pages web de l’application et rendre l’interface utilisateur conviviale et agréable.

Sécurisation de l’application

Vous devez mettre en place des mesures de sécurité pour protéger l’application contre les attaques telles que l’injection SQL et les attaques de force brute. Vous pouvez utiliser PDO avec la méthode prepare() pour préparer et exécuter des requêtes SQL sécur

Ecrire des données avec PDO

Créer une pagination

PHP

Application CRUD avec PHP et MySQL