Voici un tutorial pour créer une application « composant » sur Joomla! grâce à la nouvelle API basé sur Joomla framework MVC 1.5

Le gros avantage de la version 1.5 par rapport à la version 1.0, c’est qu’elle propose une API bien mieux construire et rend beaucoup plus agréable le développement d’applications. Le nouveau framework est basé sur le design-pattern MVC bien que la couche modèle est quelque peu inutile, étant donné que Joomla 1.5 ne fonctionne avec rien d’autre que MySQL, cela dit, on a le choix entre les drivers « mysql » ou « mysqli ».

Nous illustrerons une application simple qui saisie des utilisateurs dans une table et qui les affiche sous la forme d’une liste. Cette application nous permettra de voir d’une façon pragmatique la structure des applications Joomla! et les fonctions de base du framework : création d’une classe modèle (ajout, mise à jour, suppression et requêtes en base de données), création d’un controller avec les actions de base (une action pour création et édition et une autre pour le listing), gestion des templates, redirections et notifications des erreurs et succès.

Télécharger Joomla! 1.5.x : Joomla_1.5.15

Télécharger l’application : Joomla! Crud Tutoriel

Voici ci-dessous la hiérarchie de notre application, il s’agit d’un répertoire à créer dans le dossier « components » de Joomla! :

Voici le script SQL correspondant à la table « jos_crud_users » qui contient les données :

--
-- Structure de la table `jos_crud_users`
--

CREATE TABLE IF NOT EXISTS `jos_crud_users` (
 `user_id` int(11) NOT NULL AUTO_INCREMENT,
 `user_name` varchar(255) CHARACTER SET utf8 COLLATE utf8_bin NOT NULL,
 `user_lastname` varchar(255) CHARACTER SET utf8 COLLATE utf8_bin NOT NULL,
 `user_email` varchar(255) CHARACTER SET utf8 COLLATE utf8_bin NOT NULL,
 PRIMARY KEY (`user_id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;

Voici le premier fichier à créer, « crud.php » il s’agit du fichier d’entrée qui est exécuté dès qu’un utilisateur visite l’application :

<?php
/**
 * @package    Joomla.Crud
 * @subpackage Components
 * components/com_crud/crud.php
 * @link http://www.alexandre-julien.com
 * @author Alexandre JULIEN
 */

// Pas d'accès direct à la page
defined( '_JEXEC' ) or die( 'Restricted access' );

// Requiert la classe des contrôleurs

require_once( JPATH_COMPONENT.DS.'controller.php' );

// Requiert un contrôleur spécifique si demander
if($controller = JRequest::getVar('controller')) {
 $path = JPATH_COMPONENT.DS.'controllers'.DS.$controller.'.php';
 if (file_exists($path)) {
 require_once $path;
 } else {
 $controller = '';
 }
}

// Instanciation du contrôleur
$classname    = 'CrudController'.$controller;
$controller   = new $classname( );

// Execute la tâche demandée
$controller->execute( JRequest::getVar( 'task' ) );

// Redirection si elle est sollicitée par le contrôleur
$controller->redirect();
?>

Voici maintenant le contrôleur, chaque méthode correspond à une tâche accessible par l’url : « index.php?option=com_crud&task=lamethode »

<?php
/**
 * @package    Joomla.Crud
 * @subpackage Components
 * @link http://www.alexandre-julien.com
 * @license GNU / GPL
 * @author Alexandre JULIEN
 */

// No direct access

defined( '_JEXEC' ) or die( 'Restricted access' );

jimport('joomla.application.component.controller');

/**
 * Hello World Component Controller
 *
 * @package    Joomla.Tutorials
 * @subpackage Components
 */
class CrudController extends JController
{
 /**
 * Méthode d'affichage
 *
 * @access    public
 */
 function display()
 {
 $model = $this->getModel();
 $view = $this->getView('list', 'html');
 $view->users = $model->getAllUsers();
 $view->display();
 }

 /**
 * Formulaire de création d'un utilisateur
 * @return unknown_type
 */
 function add()
 {
 $view =& $this->getView('edit', 'html');
 $view->display();
 }

 /**
 * Formulaire d'édition d'un utilisateur
 * @return unknown_type
 */
 function edit()
 {
 if (isset($_GET) && isset($_GET['id']))
 {
 $view = $this->getView ('edit', 'html');
 $model =& $this->getModel();
 $view->data = $model->getUser($_GET['id']);
 $view->display();
 }
 else
 {
 $this->setRedirect('index.php?option=com_crud', "L'identifiant est manquant", 'error');
 }
 }

 /**
 * Sauvegarde d'un utilisateur
 * @return unknown_type
 */
 function save()
 {
 if (isset($_POST))
 {
 $model =& $this->getModel();
 if (isset($_POST['id']) && $model->getUser($_POST['id']))
 {
 $model->updateUser($_POST);
 }
 else
 {
 $model->addUser($_POST);
 }
 $this->setRedirect('index.php?option=com_crud', "Les modifications ont bien été enregistrées", 'message');
 }
 else
 {
 $this->setRedirect('index.php?option=com_crud', "Les données sont manquantes", 'error');
 }
 }

 /**
 * Suppression d'un utilisateur
 * @return unknown_type
 */
 function delete()
 {
 if (isset($_GET) && isset($_GET['id']))
 {
 $model =& $this->getModel();
 $model->removeUser($_GET['id']);
 $this->setRedirect('index.php?option=com_crud', "L'utilisateur a bien été supprimé", 'message');
 }
 else
 {
 $this->setRedirect('index.php?option=com_crud', "L'identifiant est manquant", 'error');
 }
 }
}
?>

La couche modèle qui gère les transactions avec la base de données dans le fichiers « models/crud.php » :

<?php
/**
 * Crud modèle pour le composant Crud
 *
 * @package    Joomla.Crud
 * @subpackage Components
 * @link http://www.alexandre-julien.com
 * @license    GNU/GPL
 * @author Alexandre JULIEN
 */

// Pas d'accès direct

defined( '_JEXEC' ) or die( 'Restricted access' );

jimport( 'joomla.application.component.model' );

/**
 * Modèle Crud
 *
 * @package    Joomla.Crud
 * @subpackage Components
 */
class CrudModelCrud extends JModel
{
 /**
 * Retourne tous les enregistrements de la table
 * @return unknown_type
 */
 function getAllUsers()
 {
 $query = 'SELECT * FROM #__crud_users';
 return $this->_getList ($query);
 }

 /**
 * Retourne l'enregistrement en fonction de l'identifiant de l'utilisateur
 * @param $user_id
 * @return unknown_type
 */
 function getUser ($user_id)
 {
 $query = 'SELECT * FROM #__crud_users WHERE user_id = '.(int)$user_id;
 $result = $this->_getList ($query);
 return $result[0];
 }

 /**
 * Ajoute un enregistrement
 * @param $values
 * @return unknown_type
 */
 function addUser ($values)
 {
 $db =& JFactory::getDBO();

 $row = new stdClass();
 $row->user_name = $values['user_name'];
 $row->user_lastname = $values['user_lastname'];
 $row->user_email = $values['user_email'];

 $db->insertObject ('#__crud_users', $row);
 }

 /**
 * Met à jour un enregistrement
 * @param $values
 * @return unknown_type
 */
 function updateUser ($values)
 {
 $db =& JFactory::getDBO();

 $row = new stdClass();
 $row->user_id = $values['user_id'];
 $row->user_name = $values['user_name'];
 $row->user_lastname = $values['user_lastname'];
 $row->user_email = $values['user_email'];

 $db->updateObject ('#__crud_users', $row, 'user_id');
 }

 /**
 * Supprime un enregistrement
 * @param $id
 * @return unknown_type
 */
 function removeUser ($id)
 {
 $db =& JFactory::getDBO();
 $query = 'DELETE FROM #__crud_users WHERE user_id = '.(int)$id;
 $db->setQuery($query);
 return $this->query();
 }
}
?>

Voici un exemple de fichier « View.html.php », il s’agit de celui de l’écran de listing :

<?php
/**
 * @package    Joomla.Crud
 * @subpackage Components
 * @link http://www.alexandre-julien.com
 * @license   GNU/GPL
 * @author Alexandre JULIEN
 */

// Pas d'accès direct

defined( '_JEXEC' ) or die( 'Restricted access' );

jimport( 'joomla.application.component.view');

/**
 * HTML View pour afficher la liste des utilisateurs
 *
 * @package    Crud
 */

class CrudViewList extends JView
{
 function display($tpl = null)
 {
 $this->assignRef('data', $this->users);
 parent::display($tpl);
 }
}
?>

Le template de la vue « edit » :

<?php

// Pas d'accès direct

defined('_JEXEC') or die('Restricted access'); ?>

<h1>Edition d'un utilisateur</h1>
<form name="utilisateur" method="POST"
	action="<?php echo JRoute::_('index.php?option=com_crud&task=save') ?>">
<input type="hidden" name="user_id" value="<?php echo $this->data->user_id ?>" />
<table>
	<tbody>
		<tr>
			<th>Prénom de l'utilisateur</th>
			<td><input type="text" name="user_name"
				value="<?php if (isset($this->data)) { echo $this->data->user_name; } ?>" /></td>
		</tr>
		<tr>
			<th>Nom de l'utilisateur</th>
			<td><input type="text" name="user_lastname"
				value="<?php if(isset($this->data)) { echo $this->data->user_lastname; } ?>" /></td>
		</tr>
		<tr>
			<th>Email de l'utilisateur</th>
			<td><input type="text" name="user_email"
				value="<?php if(isset($this->data)) { echo $this->data->user_email; } ?>"></input></td>
		</tr>
	</tbody>
</table>

<br />
<br />
<input type="submit" value="Enregistrer" /></form>

Le template de la vue « list » :

<?php

// Pas d'accès direct

defined('_JEXEC') or die('Restricted access'); ?>

<h1>Liste des utilisateurs</h1>

<table>
	<tbody>
		<tr>
			<th>Nom</th>
			<th>Prénom</th>
			<th>Adresse e-mail</th>
			<th>Actions</th>
		</tr>
		<?php foreach ($this->data as $key => $value) { ?>
		<tr>
			<td><?php echo $value->user_lastname ?></td>
			<td><?php echo $value->user_name ?></td>
			<td><?php echo $value->user_email ?></td>
			<td><a
				href="<?php echo JRoute::_('index.php?option=com_crud&task=edit&id='.(int)$value->user_id) ?>">
			Editer </a> | <a
				href="<?php echo JRoute::_('index.php?option=com_crud&task=delete&id='.(int)$value->user_id) ?>">Supprimer</a></td>
		</tr>
		<?php } ?>
	</tbody>
</table>
<br />
<a href="<?php echo JRoute::_('index.php?option=com_crud&task=add') ?>">
Créer un utilisateur </a>

On pourra également créer un package Joomla! qui automatisera l’installation des fichiers et des tables SQL grâce à un fichier de configuration d’installation « hello.xml » :

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE install SYSTEM "http://www.joomla.org/xml/dtd/1.5/component-install.dtd">
<install type="component" version="1.5.0">
  <name>crud</name>
  <!-- Les éléments suivants sont optionnels  -->
  <creationDate>2009 09 21</creationDate>
  <author>Alexandre JULIEN</author>
  <authorEmail>mail@alexandre.julien.com</authorEmail>
  <authorUrl>http://www.alexandre-julien.com</authorUrl>
  <copyright>Le blog d'Alex</copyright>
  <license>GNU / GPL</license>
  <!--  Version du composant -->
  <version>stable 1.0</version>
  <!-- Description du Composant -->
  <description>Petit tutoriel CRUD pour illustrer Joomla! MVC Framework</description>

  <!-- Fichiers d'installation -->
  <files folder="site">
    <filename>crud.php</filename>
    <filename>controller.php</filename>
    <filename>models/crud.php</filename>
    <filename>views/edit/view.html.php</filename>
    <filename>views/edit/tmpl/default.php</filename>
    <filename>views/list/view.html.php</filename>
    <filename>views/list/tmpl/default.php</filename>
  </files>
  <install>
    <sql>
      <file charset="uft8" driver="mysql">install.sql</file>
      <file charset="utf8" driver="mysqli">install.sql</file>
    </sql>
  </install>
  <uninstall>
    <sql>
      <file charset="utf8" driver="mysql">uninstall.sql</file>
      <file charset="utf8" driver="mysqli">uninstall.sql</file>
    </sql>
  </uninstall>
  <administration>
    <!-- Administration Menu Section -->
    <menu>Joomla! CRUD</menu>

    <!-- Fichiers de la partie administration -->
    <files folder="admin">
      <filename>index.html</filename>
      <filename>install.sql</filename>
      <filename>uninstall.sql</filename>
    </files>
  </administration>
</install>

Voici des « screenshots » de notre application finale :

L’application est disponible ici dans cette archive : Tutoriel Joomla! CRUD (installation package)

Pour cela Zend propose une structure très standard et très connue des développeurs, le design-pattern MVC (Modèle Vue Contrôleur).

Petit rappel sur le modèle MVC : il consiste à séparer les trois parties fondamentales d’une application finale.

La première regroupe les traitements et l’intégritée des données. Elle s’occupe généralement des interactions avec la base de données avec une couche d’abstraction que nous verrons dans un prochain tutoriel.

La vue n’est autre que la partie interface graphique de l’application, c’est l’interface avec l’utilisateur et elle ne doit exercer aucun traitement.

Le contrôleur est l’intermédiaire entre les 2 autres couches, il récupère les actions de d’utilisateurs et déclenche les traitements à effectuer.

Voici la couche Vue de notre application Zend de départ, on remarque qu’elle contient exclusivement le code HTML et le CSS ainsi que des variables  qui ne servent qu’à afficher des données :

La couche contrôleur se comporte sous la forme d’une classe dérivée de Zend_Controller_Action, elle doit être nommé sous la forme NomController et il en est de même pour le fichier qui la contient. Dans notre IndexController, nous avons 2 méthodes par défaut : init() et indexAction(). La méthode init() est l’action à exécuter par défaut avant n’importe quelle autre action. On peut y mettre des traitements pour récupérer des variables en paramètres ou en session par exemple. La méthode IndexAction() est la méthode centrale du contrôleur, il s’agit de la page par défaut. Les vues du contrôleur doivent être regroupées dans un même répertoire et doivent porter le même nom que l’action avec l’extension *.phtml pour les templates.

Les urls fonctionnent de la façon suivante : racine/index.php/contrôleur/action

Maintenant que nous sommes à l’aise avec le contrôleur et la vue, nous allons mettre en place un template principal qui sera la base graphique de notre application : il s’agit d’un layout.

On commence d’abord à paramètrer notre application, pour cela on se rend dans le application.ini dans le répertoire configs :

On y définit le répertoire, où nous allons placer nos fichiers de mise en page, par convention on choisira le répertoire application/layouts/scripts.

En suite nous allons modifier le Bootstrap et surcharger la méthode _initDoctype() qui définiera le doctype de notre page Web.

Nous pouvons maintenant créer le layouts.phtml dans le répertoire /layours/scripts et y insérer les balises de contenue.

On pourra étendre ce layout à plusieurs fichiers comme un header, un footer, une sidebar par exemple.

C’est fini pour la structure MVC de Zend et la création de layouts, nous verrons dans le prochain tutoriel comment se comporte la couche modèle et les interactions avec la base de données et nous ferons notre première application CRUD (Create Read Upload Delete).

]]> http://www.alexandre-julien.com/php/zend-framework-tutoriel-2-layouts-et-design-pattern-mvc/feed/ 0 http://www.alexandre-julien.com/php/zend-framework-des-tutoriaux-avec-videos-tres-prochainement-sur-le-blog-dalex/?utm_source=rss&utm_medium=rss&utm_campaign=zend-framework-des-tutoriaux-avec-videos-tres-prochainement-sur-le-blog-dalex http://www.alexandre-julien.com/php/zend-framework-des-tutoriaux-avec-videos-tres-prochainement-sur-le-blog-dalex/#comments Tue, 07 Jul 2009 19:53:46 +0000 Alexandre JULIEN http://www.alexandre-julien.com/?p=346 L’ascension spectaculaire du framework de Zend notamment due à sa notoriété de « standard » mène à envisager une grosse utilisation future de cette plateforme de travail sponsorisée par Zend.

Le blog d’Alex vous proposera très prochainement des tutoriaux complets sur Zend Framework sous forme d’articles et de podcasts vidéos.

En effet, Zend Framework est un framework PHP 5 orienté objet basé sur une grande bibilothèque de classes et de librairies fournissant des facilités de développement.

Contrairement à ses « concurrents » comme CakePHP, Symfony, Copix, Jelix … Zend ne fournit pas de façon native une structure et une architecture de de développement, en revanche il nous fournit les moyens de la construire. Souvent critiqué par son manque de rigueur et son architecture trop exhaustive, il n’en reste pas moins qu’il est souvent plébiscité par les entreprises et il est actuellement très utilisé par les SSII. Il est actuellement le framework PHP le plus utilisé en France avec le grand Symfony (beaucoup plus rigoureux mais extrèmement professionnel et robuste).

La philosophie du Zend Framework est d’offrir un ensemble d’outils de développement d’application Web tout en offrant un maximum de flexibilité au niveau architectural. Il s’appuit sur les fonctionnalités standard que l’on retrouve dans de nombreux frameworks :

- design-pattern MVC (Modèle Vue Controlleur)
- couche d’abstraction à la base de données sous forme d’un système de DAO (Database Access Object) pour effectuer des requêtes dynamiques vers les bases de données et ce de façon générique (compatible avec Mysql, Oracle, Postgre, MS-SQL, SQL-Lite, IBM-DB2)
- système de cache pour optimiser les calculs et les transactions avec les bases de données
- des outils pour le développement RAD (Rapid Application Development)
- internationalisation I18N pour la création et la gestion d’application totalement multilingues
- un système d’authentification, d’autorisation et de gestion des sessions
- un framework pour propulser ou exploiter des Web Services
- des fonctionnalités avancées pour l’exploitation des emails et la génération de PDF
- un système de recherche puissant
- des créations de formulaires avec des fonctions de filtres, validateurs, …
- un grand nombre d’APIs comme Google App, Amazon, …
- un générateur de javascript basé sur le framework Dojo ainsi que des libraries pour jQuery depuis la version 1.7 avec ZendX

L’autre argument fort de PHP est qu’il est soutenu par Zend, l’entreprise à but commercial qui propulse PHP, cela rassure souvent les entreprises de savoir qu’il existe des entités commerciales derrière les technologies (cf succès de Sun et IBM avec Java et Microsoft .NET).
Il aura pour vocation de se placer au même rang que les grands framework « standard » des autres langages tel un (Spring, Struts pour Java ou un Ruby on Rails pour Ruby).

C’est pour ces raisons, que je vais prochainement diffuser des tutoriaux sous forme écrite et aussi sous forme vidéo podcast visant à donner un petit coup de pouce aux personnes débutants sur ce framework. Il s’agira principalement d’application simples et basique comme un CRUD mettant en pratique les principales fonctionnalités du Zend Framework, à savoir le design-pattern MVC, le routing avec le url_rewriting, les formulaires, les interactions avec les bases de données, les sessions et authentifications, …

En espérant que ces tutoriaux aideront un maximum de personnes, je compte sur votre aide pour commenter mes publications.

A très bientôt.

Comme son nom l’indique, le framework offre la possibilité de développer des applications ASP.NET avec le design pattern Modèle-Vue-Contrôleur qui est déjà largement utilisé dans les frameworks orientés Web comme Spring, Struts (J2EE), Symfony, Copix, Zend, Ruby on Rails …

Ce nouveau composant du Framework .NET commence à devenir très populaire car le modèle MVC tend à devenir un standard pour les architectures d’applications Web. En effet, seul JSF et autre framework peu connu de J2EE utilise un design pattern comme celui de ASP.NET.

Cela pourrait reconcilier et familiariser grand nombre de développeurs adeptent du modèle MVC…

Petit rappel sur le design pattern MVC :