É v o l u e r v e r s u n e a r c h i t e c t u r e M V C e n P H P Table des m
É v o l u e r v e r s u n e a r c h i t e c t u r e M V C e n P H P Table des matières I. Présentation du contexte d'exemple o I-A. Base de données o I-B. Page principale o I-C. Affichage obtenu o I-D. Critique de l'architecture actuelle II. Mise en place d'une architecture MVC simple o II-A. Amélioration de l'exemple II-A-1. Isolation de l'affichage II-A-2. Isolation de l'accès aux données II-A-3. Bilan provisoire o II-B. Le modèle MVC II-B-1. Présentation II-B-2. Rôles des composants II-B-3. Interactions entre les composants II-B-4. Avantages et inconvénients II-B-5. Différences avec un modèle en couches o II-C. Améliorations supplémentaires II-C-1. Factorisation des éléments d'affichage communs II-C-2. Factorisation de la connexion à la base II-C-3. Gestion des erreurs o II-D. Bilan : architecture obtenue o II-E. Application : affichage des détails d'un billet II-E-1. Description du nouveau besoin II-E-2. Prise en compte du nouveau besoin III. Passage à une architecture MVC orientée objet o III-A. Amélioration de l'architecture MVC III-A-1. Mise en œuvre d'un contrôleur frontal (front controller) III-A-2. Réorganisation des fichiers sources III-A-3. Bilan provisoire o III-B. Aperçu du modèle objet de PHP III-B-1. Exemple de hiérarchie de classes III-B-2. Caractéristiques du modèle objet de PHP III-B-3. Spécificités du modèle objet de PHP o III-C. Mise en œuvre du modèle objet de PHP III-C-1. Passage à un Modèle orienté objet III-C-2. Passage à un Contrôleur orienté objet o III-D. Bilan : architecture obtenue o III-E. Application : ajout d'un commentaire III-E-1. Description du nouveau besoin III-E-2. Prise en compte du nouveau besoin IV. Conclusion et perspectives o IV-A. Améliorations possibles o IV-B. Pour aller encore plus loin : les frameworks PHP V. Remerciements L'objectif de cet article est de découvrir comment améliorer l'architecture d'un site Web en passant d'une organisation classique (monopage) à une organisation respectant le modèle MVC. Il s'agit d'une adaptation d'un cours donné aux étudiants de seconde année de BTS SIO (Services Informatiques aux Organisations) au lycée La Martinière Duchère de Lyon. Remarque : cet article s'inspire en partie de la page Web Symfony2 versus flat PHP. 20 commentaires Article lu 12447 fois. L'auteur Baptiste Pesquet L'article Publié le 27 mars 2013 - Mis à jour le 27 mars 2013 Version PDF Version hors-ligne ePub, Azw et Mobi Liens sociaux I. Présentation du contexte d'exemple▲ Nous mettrons en œuvre les principes présentés dans cet article sur un exemple simple : une page Web PHP de type blog interagissant avec une base de données relationnelle. Vous trouverez les fichiers sources du contexte initial à l'adresse https://github.com/bpesquet/MonBlog/tree/sans-mvc. I-A. Base de données▲ La base de données utilisée est très simple. Elle se compose de deux tables, l'une stockant les billets (articles) du blog et l'autre les commentaires associés aux articles. Cette base de données contient quelques données de test, insérées par le script SQL ci-dessous. Sélectionnez INSERT INTO T_BILLET(BIL_DATE, BIL_TITRE, BIL_CONTENU) VALUES (NOW(), 'Premier billet', 'Bonjour monde ! Ceci est le premier billet sur mon blog.'); INSERT INTO T_BILLET(BIL_DATE, BIL_TITRE, BIL_CONTENU) VALUES (NOW(), 'Au travail', 'Il faut enrichir ce blog dès maintenant.'); INSERT INTO T_COMMENTAIRE(COM_DATE, COM_AUTEUR, COM_CONTENU, BIL_ID) VALUES (NOW(), 'A. Nonyme', 'Bravo pour ce début', 1); INSERT INTO T_COMMENTAIRE(COM_DATE, COM_AUTEUR, COM_CONTENU, BIL_ID) VALUES (NOW(), 'Moi', 'Merci ! Je vais continuer sur ma lancée', 1); I-B. Page principale▲ Voici le code source PHP de la page principale index.php de notre blog. Sélectionnez <!doctype html> <html lang="fr"> <head> <meta charset="UTF-8" /> <link rel="stylesheet" href="style.css" /> <title>Mon Blog - Sans MVC</title> </head> <body> <div id="global"> <header> <h1 id="titreBlog"><a href="index.php">Mon Blog</a></h1> <p>Je vous souhaite la bienvenue sur ce modeste blog.</p> </header> <nav> <section> <h1>Billets</h1> <ul> <li><a href="todo">Billets récents</a></li> <li><a href="todo">Tous les billets</a></li> </ul> </section> <section> <h1>Administration</h1> <ul> <li><a href="todo">Écrire un billet</a></li> </ul> </section> </nav> <div id="contenu"> <?php $bdd = new PDO( 'mysql:host=localhost;dbname=monblog;charset=utf8', 'root', ''); $requeteBillets = "select * from T_BILLET order by BIL_ID desc"; $billets = $bdd->query($requeteBillets); foreach ($billets as $billet): ?> <article> <header> <h1 class="titreBillet"> <?= $billet['BIL_TITRE'] ?> </h1> <time><?= $billet['BIL_DATE'] ?></time> </header> <p><?= $billet['BIL_CONTENU'] ?></p> </article> <hr /> <?php endforeach; ?> </div> <!-- #contenu --> <footer id="piedBlog"> Blog réalisé avec PHP, HTML5 et CSS. </footer> </div> <!-- #global --> </body> </html> On peut faire les remarques suivantes. Cette page est écrite en HTML5 et utilise certaines nouvelles balises, comme <article>. Elle présente un menu de navigation (balise <nav>) présent uniquement pour des raisons esthétiques (les liens ne fonctionnent pas). Elle emploie l'affichage abrégé <?= ... ?> plutôt que <?php echo ... ?>, ainsi que la syntaxe alternative pour la boucle foreach. Elle utilise l'extension PDO de PHP afin d'interagir avec la base de données. Pour le reste, il s'agit d'un exemple assez classique d'utilisation de PHP pour construire une page dynamique affichée par le navigateur client. I-C. Affichage obtenu▲ Le résultat obtenu depuis un navigateur client est le suivant. Ce résultat est dû à l'application d'une feuille de style CSS (fichier style.css) afin d'améliorer le rendu HTML. Pour information, voici le code source associé. Sélectionnez /* Pour pouvoir utiliser une hauteur (height) ou une hauteur minimale (min-height) sur un bloc, il faut que son parent direct ait lui-même une hauteur déterminée (donc toute valeur de height sauf "auto": hauteur en pixels, em, autres unités...). Si la hauteur du parent est en pourcentage, elle se réfère alors à la hauteur du « grand-père », et ainsi de suite. Ainsi, pour pouvoir utiliser un "min-height: 100 %" sur div#global, il nous faut: - un parent (body) en "height: 100 %"; - le parent de body également en "height: 100 %". */ html, body { height: 100%; } body { color: #bfbfbf; background: black; font-family: 'Futura-Medium', 'Futura', 'Trebuchet MS', sans-serif; } a { color: #bfbfbf; } a:hover, a:focus { color: crimson; } nav { float: right; margin-left: 20px; } h1 { color: white; } #global { min-height: 100%; /* Voir commentaire sur html et body en haut de la feuille de style */ background: #333534; width: 60%; margin: auto; /* Permet de centrer la div */ text-align: justify; padding: 5px 20px; } #contenu { margin-bottom : 30px; overflow: hidden; /* Évite au bloc central de glisser sous le menu latéral (alternative à la définition de marges pour ces blocs) */ } #titreBlog, #piedBlog { text-align: center; } .titreBillet { margin-bottom : 0px; } .titreBillet a, #titreBlog a { color: white; text-decoration: none; /* Désactive le soulignement des liens */ } } I-D. Critique de l'architecture actuelle▲ Les principaux défauts de cette page Web sont les suivants : elle mélange balises HTML et code PHP ; sa structure est monobloc, ce qui rend sa réutilisation difficile. On sait que tout logiciel doit gérer plusieurs problématiques : interactions avec l'extérieur, en particulier l'utilisateur : saisie et contrôle de données, affichage. C'est la problématique de présentation ; opérations sur les données (calculs) en rapport avec les règles métier (« business logic »). C'est la problématique des traitements ; accès et stockage des informations qu'il manipule, notamment entre deux utilisations. C'est la problématique des données. La page Web actuelle mélange code de présentation (les balises HTML) et accès aux données (requête SQL). Ceci est totalement contraire au principe deresponsabilité unique, le principal principe de conception logicielle. L'architecture actuelle montre ses limites dès que le contexte se complexifie. Le volume de code des pages PHP explose et la maintenance devient délicate. Il faut faire mieux. II. Mise en place d'une architecture MVC simple▲ II-A. Amélioration de l'exemple▲ II-A-1. Isolation de l'affichage▲ Une première amélioration consiste à séparer le code d'accès aux données du code de présentation au sein du fichier index.php. Sélectionnez <?php $bdd = new PDO('mysql:host=localhost;dbname=monblog;charset=utf8', 'root', ''); $requeteBillets = "select * from T_BILLET order by BIL_ID desc"; $billets = $bdd->query($requeteBillets); ?> <!doctype html> <head> ... <div id="contenu"> <?php foreach ($billets as $billet): ?> <article> <header> <h1 class="titreBillet"> <?= $billet['BIL_TITRE'] ?> </h1> <time><?= $billet['BIL_DATE'] ?></time> </header> <p><?= $billet['BIL_CONTENU'] ?></p> </article> <hr /> <?php endforeach; ?> </div> <!-- #contenu --> ... Le code est devenu plus lisible, mais les problématiques de présentation et d'accès aux données sont toujours gérées au sein d'un même fichier PHP. En plus de limiter la modularité, ceci est contraire aux bonnes pratiques de développement PHP (norme PSR-1). On peut aller plus loin dans le découplage en regroupant le code d'affichage précédent dans un fichier dédié nommé listeBillets.php. Sélectionnez <!doctype html> <html lang="fr"> <head> ... </head> <body> ... <div id="contenu"> <?php foreach ($billets as $billet): ?> <article> ... </article> <hr /> <?php endforeach; ?> </div> <!-- #contenu --> ... </body> </html> La page principale index.php devient alors : Sélectionnez <?php // Accès aux données $bdd = new PDO('mysql:host=localhost;dbname=monblog;charset=utf8', 'root', ''); $requeteBillets = "select * from T_BILLET order by BIL_ID desc"; $stmtBillets = $bdd->query($requeteBillets); // Affichage require 'listeBillets.php'; Rappel : la fonction PHP require fonctionne de manière similaire à include uploads/Litterature/ evoluer-vers-une-architecture-mvc-en-php 1 .pdf
Documents similaires










-
23
-
0
-
0
Licence et utilisation
Gratuit pour un usage personnel Attribution requise- Détails
- Publié le Oct 25, 2022
- Catégorie Literature / Litté...
- Langue French
- Taille du fichier 1.4089MB