Developpez.com

Club des développeurs et IT pro
Plus de 4 millions de visiteurs uniques par mois

Apprendre à créer facilement un site web dynamique en PHP avec mkframework

Une première vidéo de présentation d'un framework PHP simple et différent : le MkFramework.

Commentez Donner une note à l'article (5)

Article lu   fois.

L'auteur

Profil Pro

Liens sociaux

Viadeo Twitter Facebook Share on Google+   

I. Vidéo


Cliquez pour lire la vidéo


II. Prérequis

Rendez-vous à l'adresse http://mkframework.com, dans le menu de droite, il y a une catégorie « Télécharger ».

Cliquez sur le lien « Framework & Plus ».

Il y a plusieurs moyens de télécharger le framework :

Dans ce tutoriel, nous choisirons de télécharger la dernière archive zip.

III. Installation du framework

Copiez l'archive téléchargée dans votre répertoire web.

Désarchivez celle-ci.

Ouvrez votre navigateur à l'adresse http://localhost

Vous voyez votre répertoire désarchivé, cliquez dessus.

Image non disponible

Vous affichez une page web : c'est le « builder ».

IV. Parenthèse sur l'archive téléchargée

Ce que vous venez de télécharger est l'ensemble générateur web (builder) + la librairie du framework.

Sur d'autres frameworks, vous utilisez un script en ligne de commande pour créer une application, générer la couche modèle, les modules CRUD…

Ici, tout se fait via une application web, vous utilisez des formulaires pour sélectionner, renseigner et générer le code désiré.

V. Découverte rapide du builder

La parenthèse fermée, quand vous ouvrez votre navigateur à l'adresse du builder, vous voyez une page comportant deux onglets.

Si vous avez le même message rouge (sous GNU/Linux et Mac OS X), modifiez les droits d'écriture du répertoire data généré (pour qu'il soit inscriptible par le builder) :

Image non disponible

En réactualisant, vous devriez voir le message rouge disparaître.

VI. Création d'une application

Nous commençons par créer une application vide.

Entrez « monApplication », puis validez.

Image non disponible

Le builder vous redirige automatiquement sur le second onglet listant les projets (et permettant de les administrer).

Vous avez trois boutons…

VI-A. Bouton « Voir le site »

En cliquant sur ce lien, vous pouvez visualiser votre application :

Image non disponible

VI-B. Bouton « Explorer le projet »

Ce bouton vous permet de naviguer au sein de votre projet avec de plus une documentation contextuelle.

Image non disponible

VI-C. Bouton « Éditer le projet »

Voilà la liste des actions disponibles, qui sont habituellement exécutées via la ligne de commande sur les autres frameworks.

VII. Présentation de l'arborescence

Dans le mot « framework », il y a « cadre », et quand on génère une application, elle possède une arborescence précise.

Avec cette arborescence connue, une personne connaissant le framework s'y retrouvera.

Image non disponible

VII-A. Le répertoire « conf »

Il contient les différents fichiers de configuration.

Image non disponible

Je vous invite à vous rendre à l'adresse configuration pour voir plus en détail.

VII-B. Le répertoire « layout »

Il contient les templates de votre site.

Image non disponible

VII-C. Le répertoire « module »

Il contient les modules (couple contrôleur + vues) de votre site.

Image non disponible

VII-D. Le répertoire « plugin »

Il contient vos plugins.

Image non disponible

VII-E. Le répertoire « public »

Webroot ou racine web de votre application.

Image non disponible

VIII. Fonctionnement de l'application

Sur notre application vide, on peut voir dans la barre de debug, que l'on charge le module « default » et l'action « index ».

Image non disponible

Pour information, un module contient un fichier main.php (son contrôleur) ainsi qu'un répertoire « view » contenant ses vues.

Image non disponible
 
Sélectionnez
class module_default extends abstract_module{ 
  
   public function before(){ 
       $this->oLayout=new _layout('template1'); 
   } 
  
   public function _index(){ 
       $oView=new _view('default::index'); 
      
       $this->oLayout->add('main',$oView); 
   } 
  
   public function after(){ 
       $this->oLayout->show(); 
   } 
}

Alors une action, c'est une « page », ici on souhaite donc afficher la page « index » de notre module « default ».

Une action est une méthode publique préfixée d'un underscore.

Pour afficher notre application, le framework va d'abord appeler la méthode before() du module.

 
Sélectionnez
public function before(){ 
    $this->oLayout=new _layout('template1'); 
}

Dans celle-ci, on peut lire que l'on instancie un objet layout en précisant « template1 », qui fait référence au fichier layout/template1.php

Ensuite, le framework appelle la page demandée : ici « index ».

 
Sélectionnez
public function _index(){ 
    $oView=new _view('default::index'); 

    $this->oLayout->add('main',$oView); 
}

Ici, on instancie un objet view « default::index » qui est le fichier de vue index.php du module « default », le fichier étant à l'adresse module/view/index.php

Puis, à l'aide de la méthode « add » on ajoute cette vue à l'emplacement « main » du layout précédemment instancié.

Enfin, le framework appelle la méthode after() :

 
Sélectionnez
public function after(){ 
    this->oLayout->show(); 
}

La méthode se contente ici d'afficher le layout qui contiendra la vue index précédemment ajoutée.

IX. Petite parenthèse sur le layout

Si on ouvre le fichier layout/template1.php :

 
Sélectionnez
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>monApplication</title> 
<link rel="stylesheet" type="text/css" href="css/main.css" media="screen" /> 
<script src="js/main.js" type="text/javascript"></script> 
<link rel="alternate" type="application/rss+xml" title="RSS" href="<?php echo _root::getLink('article::newsrss') ?>"/> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
</head> 
<body> 

<div class="main"> 
   <div class="menu"><?php echo $this->load('menu') ?></div> 
   <div class="content"> 
       <?php echo $this->load('main') ?> 
   </div> 
</div> 

</body> 
</html>

On peut voir à deux endroits que l'on charge deux emplacements mémoire :

 
Sélectionnez
<div class="menu"><?php echo $this->load('menu') ?></div> 
<div class="content"> 
    <?php echo $this->load('main') ?> 
</div>

On voit ici « menu » et « main ».

Le fameux « main » où on ajoutait précédemment la vue « default::index ».

X. Schéma de rappel du fonctionnement

Voici un schéma pour bien comprendre le fonctionnement des modules, vues et layouts :

Image non disponible

XI. Conclusion

Le MkFramework, comme vous avez pu le voir dans cette première vidéo d'introduction se veut différent des autres notamment par sa prise en main facilitée grâce à ce générateur web.

De plus, depuis quelques mois, un « market » a fait son apparition permettant à la fois de mettre à jour les modules présents dans la version installée sur votre ordinateur/serveur, mais également d'ajouter de nouvelles fonctionnalités/plugins/modules à vos applications.

Mais ce « market » fera l'objet d'un prochain article expliquant comment en bénéficier, mais aussi comment y contribuer.

XII. Remerciements

Je souhaite remercier LittleWhite et Guillaume SIGUI pour leur relecture technique et f-leb pour sa correction orthographique.

Vous avez aimé ce tutoriel ? Alors partagez-le en cliquant sur les boutons suivants : Viadeo Twitter Facebook Share on Google+   

  

Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright © 2014 Michael Bertocchi. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.