Fondamentaux incontournables du fonctionnement d'un composant
From Joomla! Documentation
Cet article est destiné aux débutants sur Joomla. Il a pour objectif d'expliquer ce qu'est un composant Joomlaǃ comment il fonctionne. Puisqu'il est toujours interessant de se référer à des exemples, cet article va parfois se référer à un composant d'exemple nommé "Hello World!" (Bonjour à tous !).
Qu'est-ce qu'un composant Joomla! ?
Un composant est un type d'extension pour Joomla!. Les composants sont les principales unités fonctionnelles de Joomla! ; ils peuvent être considérés comme des mini-applications. Une analogie possible serait de considérer Joomla! comme un système d'exploitation où les composants seraient des applications du bureau. Crées par un composant, les contenus sont généralement affichés au centre de la zone de contenu du template (en fonction du template).
La plupart des composants sont composés de deux éléments principaux : une interface d'administration (backend) et une partie site (frontend). La partie site est celle utilisée pour le rendu des pages lorsque le composant est appelé pendant le fonctionnement normal du site. L'interface d'administration permet de configurer et de gérer différents aspects du composant. Elle est accessible depuis l'espace d'administration de Joomla!.
Joomla! propose nativement un certain nombre de composants comme le système de gestion de contenu, des formulaires de contact et les Liens Web.
Dans le framework Joomla, les composants peuvent être conçus à l'aide d'un modèle à plat (qui retourne le code HTML pour la page demandée) ou à l'aide de l'architecture Model-View-Controller (Modèle-Vue-Contrôleur ci-après dénommé MVC).
Introduction au MVC
Le MVC est un modèle de conception de logiciel qui peut être utilisé pour organiser le code de telle façon que la logique de fonctionnement et la présentation des données sont séparées. Le fondement de cette approche est que si la logique de fonctionnement est regroupée dans une section, alors les interactions de l'utilisateur qui concernent les donnée,s peuvent être révisées et personnalisées sans avoir à reprogrammer la logique de fonctionnement. L'architecture MVC a été développée à l'origine pour cartographier les entrées, les traiter et les rendre en sortie suivant une architecture GUI.
Model (modèle)
Le modèle (model) est la partie du composant qui encapsule les données de l'application. Il fournira souvent des routines pour gérer et manipuler ces données de manière significative, mais également des routines afin de récupérer les données à partir du modèle. En général, les techniques d'accès aux données sous-jacentes doivent être encapsulées dans le modèle. Ainsi, si un système qui utilise une technique de fichier à plat pour stocker les informations doit être déplacé dans un système utilisant une base de données, le modèle est le seul élément qui devra être changé, ni la vue, ni le contrôleur.
View (vue)
La vue (view) est la partie du composant qui est utilisée pour le rendu des données reçues à partir du modèle, de manière à les rendre convenable pour l'interaction. Pour une application basée web, la vue sera généralement une page HTML qui est renvoyée à l'utilisateur. La vue extrait des données à partir du modèle (qui passeront par le contrôleur) et les organiseront via un template qui permettra la présentation à l'utilisateur. La vue n'impose pas une modifications des données, elle se contente de permettre l'affichage des données reçues du modèle.
Controller (contrôleur)
Le contrôleur (controller) est chargé de répondre aux actions de l'utilisateur. Dans le cas d'une application web, l'action de l'utilisateur est généralement une demande de page. Le contrôleur devra déterminer quelle est la demande de l'utilisateur et va répondre de façon appropriée par le déclenchement du modèle qui va manipuler les données de façon appropriée et en passant le modèle dans la vue. Le contrôleur n'affiche pas les données dans le modèle, il déclenche les méthodes du modèle qui va modifier les données puis passer le modèle dans la vue qui affichera les données.
Le framework pour composants Joomla! expliqué
Model (modèle)
Dans le framework Joomla, les modèles gèrent les données. La première fonction à écrire pour un modèle est la fonction get. Elle permet de renvoyer les données à l'appelant. Dans notre cas, l'appelant sera la vue HelloWorldViewHelloWorld. Par défaut, le modèle nommé HelloWorldModelHelloWorld, situé dans site/models/helloworld.php est le modèle principal associé à cette vue.
Regardons rapidement les conventions de nommage à l'aide d'un exemple. Les conventions de nommage ont un côté magique, permettant de faire tout le travail :
La classe HelloWorldViewHelloWorld se situe dans site/views/helloworld/view.html.php et utilisera la classe HelloWorldModelHelloWorld du fichier site/models/helloworld.php
Supposons que nous voulons utiliser une vue fictive fluffy, vous devriez avoir :
La classe HelloWorldViewFluffy qui se trouve dans site/views/fluffy/view.html.php. La vue va utiliser HelloWorldModelFluffy du fichier site/models/fluffy.php. Remarque : l'écran de la vue site/views/fluffy/tmpl/default.php est requise pour que cet exemple puisse fonctionner.
Le non respect de l'une des conventions en gras va engendrer des erreurs ou une page blanche.
Accéder à un composant Joomla!
Il nous faut en premier lieu accéder à la plateforme Joomla! qui n'est accessible que par le biais d'un point d'entrée unique. À l'aide de votre navigateur web préféré, accédez à l'URL suivante :
| 1 | accès utilisateur | <votresite>/joomla/index.php |
| 2 | accès administration | <votresite>/joomla/administrator/index.php |
Exemple Hello World! : localhost/joomla/index.php
Vous pouvez utiliser l'URL du composant ou un Menu pour naviguer vers le composant. Dans cet article, nous utiliserons l'URL.
| 1 | accès utilisateur | <votresite>/joomla/index.php?option=com_<nom_du_composant> |
| 2 | accès administration | <votresite>/joomla/administrator/index.php?option=com_<nom_du_composant> |
Exemple Hello World! : localhost/joomla/index.php?option=com_helloworld
Structure de base d'un dossier MVC
Les composants sont stockés dans un dossier de votre installation Joomla! et plus précisément dans :
- htdocs/<chemin_vers_joomla>/components/com_<nom_du_composant>/.
Le composant Hello World! est stocké dans htdocs/<chemin_vers_joomla>/components/com_helloworld/.
Un composant de base contiendra les fichiers suivants dans son propre dossier ː
- Un fichier html de sécurité avec une couleur d'arrière-plan ː index.html
- Un fichier php qui est le contrôleur ː controller.php
- Un fichier php qui va charger les classes du contrôleur ː <nom_du_composant>.php
- Un fichier php qui est le modèle ː models/<nom_du_composant>.php
- Un autre fichier html pour le contrôle de la couleur de fond ː models/index.html
- Un fichier php contenant la vue par défaut ː views/<nom_du_composant>/tmpl/default.php
- Un fichier xml pour ajouter un type d'élément de menu ː views/<nom_du_composant>/tmpl/default.xml
- Un autre fichier html pour le contrôle de couleur de fond de la vue ː views/<nom_du_comosant>/tmpl/index.html
- Un autre fichier html pour le contrôle de la couleur de fond ː views/<nom_du_composant>/index.html
- Un fichier php pour l'affichage de la view ː views/<nom_du_composant>/view.html.php
JEXEC
La ligne suivante est communément présente au début de tous les fichiers PHP présents dans Joomla! :
<?php
defined('_JEXEC') or die('Restricted Access');Cela permet de sécurisé le point d'entrée au niveau de la plateforme Joomla. L'article JEXEC contient des explications plus détaillées.
Didacticiels pour la conception d'un composant MVC
Apprendre comment concevoir votre propre composant MVC Composant :