1 Création d’un projet symfony

Pour créer un projet qui utilise le framework Symfony, il suffit de la commande suivante :


my-project

Cette commande crée un répertoire my-project contenant l’arborescence d’une application web basée sur le framework Symfony. Il existe de nombreuses extensions disponibles que vous serez amené à utiliser dans les prochains travaux pratiques.

Dans ce premier TP, nous allons nous contenter de découvrir l’outil.

Créer un projet tp_hello qui utilise le framework Symfony.

2 Ajout d’un serveur web de développement

Le framework Symfony propose un interpréteur de commandes qui facilite le développement de l’application. Si vous êtes dans le répertoire de votre projet (cd tp_hello), il suffit de taper la commande :

php bin/console list

Cette commande liste les commandes disponibles.

Il est possible d’ajouter des outils supplémentaires. Nous allons ajouter un serveur web de développement qui nous permettra de visualiser en direct les modifications faites pendant le développement.

composer req --dev server

Ajoute l’outil server, vous aurez noté l’utilisation de l’option --dev qui indique que l’outil sera utilisé uniquement dans la phase de développement.

Ajouter l’outil server.

Si vous tapez de nouveau la commande php bin/console list vous voyez apparaître de nouvelles commandes.

Taper la commande php bin/console server:start.

Vérifier dans votre navigateur que le serveur est opérationnel.

Taper la commande php bin/console server:stop pour arrêter le serveur.

3 Ajout d’une page à notre application

Pour le moment votre application ne dispose d’aucune page. Nous allons créer une première page en utilisant le modèle MVC.

Pour déclencher l’affichage de la page, il faut que le serveur reçoive une requête web qui sera envoyée vers le routeur qui dispachera celle-ci vers le bon contrôleur qui créera la réponse en utilisant le plus souvent une vue bâtie à partir d’un fichier template (twig.

Nous allons mettre en oeuvre ce modèle en utilisant les outils proposés par symfony.

3.1 Création d’un contrôleur

Création d’un contrôleur Dans le répertoire src/Controller nous allons créer une classe HomeController dans un fichier HomeController.php. Voici le contenu de cette classe :

namespace App\Controller;
use Symfony\Component\HttpFoundation\Response;

class HomeController {
    public function hello() {

        return new Response(
            '<html><body>Bonjour monde !</body></html>'
        );
    }
}

Note : La classe se trouve dans le namespace App\Controller

On a créer une fonction hello

Ajout de la route dans l’application

Il nous faut associer une URL avec la fonction hello du contrôleur HomeController. Pour cela nous allons ajouter l’information dans le fichier routes.yaml dans le répertoire config.
```
home_hello:
  path: /home/hello
  controller: App\Controller\HomeController::hello
```
Note : Le fichier doit respecter la syntaxe yaml
- On a créé une nouvelle route qui a pour nom hoem_hello
- l’Url associée est /home/hello, et
- l’action déclenchée est la fonction hello du contrôleur HomeController

Ajouter le contrôleur HomeController et créer la méthode hello.

Modifier le fichier routes.yaml dans le répertoire config.

Vérifier dans votre navigateur que l’url est opérationnelle.

Symfony propose un outil qui automatise la création d’un contrôleur, et autres entités que nous utiliserons par la suite. Pour rendre disponible cet outil, il faut l’installer à l’aide de les commandes

composer require annotations
composer require symfony/maker-bundle --dev

Si l’installation c’est bien déroulé, la commande suivante vous permet de créer un nouveau contrôleur directement :

php bin/console make:controller WelcomeController

Note : La commande
php bin/console make:controller --help
vous indique comment utiliser la commande.

La commande crée un fichier WelcomeController.php dans le répertoire src/Controller qui contient le code suivant :

namespace App\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\Routing\Annotation\Route;

class WelcomeController extends AbstractController
{
    /**
     * @Route("/welcome", name="welcome")
     */
    public function index()
    {
        return $this->json([
            'message' => 'Welcome to your new controller!',
            'path' => 'src/Controller/WelcomeController.php',
        ]);
    }
}

Explications : Les annotations (commentaires PHP) sont créées automatiquement. Elles permettent d’associer l’url /welcome avec la méthode index du contrôleur WelcomeController sans avoir à ajouter la route dans le fichier routes.yaml dans le répertoire config.

Ajouter le contrôleur WelcomeController à l’aide de la commande make.

Vérifier dans votre navigateur que l’url est opérationnelle.

3.2 Ajout de la barre de debug

Il est possible d’ajouter un outil de bebug en utilisant la commande

 composer req symfony/profiler-pack

3.3 Ajouter une vue avec le moteur de templates twig.

Pour utiliser le moteur de templates twig dans le contrôleur HomeController, il faut modifier le contrôleur et indiquer que le contrôleur hérite de la classe AbstractController. En concéquence, le contrôleur disposera de la méthode render qui permet d’utiliser en paramètre un template.

namespace App\Controller;
//use Symfony\Component\HttpFoundation\Response;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;

class HomeController extends AbstractController {
    public function hello() {

        return $this->render('hello.html.twig');
        /*
        return new Response(
            '<html><body>Bonjour monde !</body></html>'
        );
        */
    }
}

Le contrôleur HomeController utilise le fichier hello.html.twig qui contient le template.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Bonjour</title>
</head>
<body>
    <h1>Bonjour Monde !</h1>
</body>
</html>

Il est possible d’échanger entre le contrôleur et la vue. Pour cela on ajoute un tableau associatif comme deuxième paramètre de la méthode render.

namespace App\Controller;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;

class HomeController extends AbstractController {
   public function hello() {

       return $this->render('hello.html.twig', ['nom' => 'Robert']);
   }
}

On modifie la vue et on inclut un paramètre

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Bonjour</title>
</head>
<body>
    <h1>Bonjour {{nom}}, bienvenue dans le monde du web !</h1>
</body>
</html>

Vous pouvez utiliser la vue base.html.twig qui est proposer par Symfony comme base.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Bonjour</title>
</head>
<body>
    <h1>Bonjour {{nom}}, bienvenue dans le monde du web !</h1>
</body>
</html>

Modifier le contrôleur WelcomeController pour qu’il utilise une vue twig.

Modifier à nouveau le contrôleur WelcomeController pour qu’il fournisse un paramètre dans la vue twig.

4 Sauvegarde du projet

Nous allons atteint une première étape qui consistait à mettre en place un contrôleur qui utilise une vue avec paramètres au format twig.

Nous allons sauvegarder cette étape dans le gestionnaire de version de projet de l’Université : la forge.

Il faut créer un nouveau projet sur la forge. Pour cela vous devez vous connecter sur la forge et ajouter un projet. Dès que vous avez créé le projet, vous devez récupérer le lien qui vous permet d’y accéder.
Dans votre projet vous devez initialiser le gestionnaire de versions
```
git init
```
Pour simplifier les opérations avec le gestionnaire de version, il est important de disposer d’un fichier .getignore (Symfony vous en propose un par défaut).
Ajouter les fichiers de votre projet (sauf ceux indiqués dans le fichier .getignore) dans la gestion de versions.
```
git status
git add .
git commit -m 'TP Hello Symfony - version initiale'
```
Si vous souhaitez sauvegarder votre projet sur la forge pour pouvoir le partager avec d’autres personnes, vous devez l’exporter (push) vers la forge.
```
git remote add origin https://forge.univ-artois.fr/symfony_FH/tp_hello.git
git push -u origin master
```
Création d’une nouvelle branche pour étendre notre travail
```
git git checkout -b avec_doctrine
```

Placez votre projet sous git et ajoutez ce projet sur la forge de l’Université.

5 Utilisation d’un modèle d’information

Dans cette section nous allons mettre en oeuvre la gestion de données stockées dans une base de données.

5.1 Ajout de l’outil `doctrine`

Pour ajouter la librairie doctrine dans votre projet vous devez taper les commandes suivantes :

composer require symfony/orm-pack
composer require symfony/maker-bundle --dev

Cette commande ajoute de nombreuses posibilités à la console, utilisez la commande suivante pour lister les nouvelles actions possibles :

php bin/console list doctrine

Le fichier .env permet d’indiquer la localisation de la base de données qui sera utilisée par l’application web. La ligne suivante du fichier doit être adaptée pour utiliser votre base de données :

DATABASE_URL=mysql://db_user:db_password@127.0.0.1:3306/db_name

nous allons utiliser un générateur de données aléatoires, pour l’ajouter à votre projet vous devez utiliser la commande suivante :

composer require --dev fzaninotto/faker

5.1.1 Modèle d’information

Nous allons mettre en oeuvre le modèle d’information suivant :

Figure 1. Modèle de données

L’entité Salle modélise une salle de formation et l’entité Materiel modélise le contenu que l’on peut trouver dans une salle de formation.

5.1.2 Pour créer les entités

Symfony propose une commande qui permet de créer une entity de manière intéractive.

php bin/console make:entity

Voici le résultat obtenu pour l’entité Salle et l’entité Materiel

Salle

<?php
namespace App\Entity;

use Doctrine\Common\Collections\ArrayCollection;
use Doctrine\ORM\Mapping as ORM;

/**
 * @ORM\Entity(repositoryClass="App\Repository\SalleRepository")
 */
class Salle {
    /**
     * @ORM\Id()
     * @ORM\GeneratedValue()
     * @ORM\Column(type="integer")
     */
    private $id;

    /**
     * @ORM\Column(type="string", length=20)
     */
    private $nom;

    /**
     * @ORM\Column(type="string", length=30)
     */
    private $batiment;

    public function getId(): ?int {
        return $this->id;
    }

    public function getNom(): ?string {
        return $this->nom;
    }

    public function setNom(string $nom): self {
        $this->nom = $nom;

        return $this;
    }

    public function getBatiment(): ?string {
        return $this->batiment;
    }

    public function setBatiment(string $batiment): self {
        $this->batiment = $batiment;

        return $this;
    }
}

Materiel

<?php

namespace App\Entity;

use Doctrine\ORM\Mapping as ORM;

/**
 * @ORM\Entity(repositoryClass="App\Repository\MaterielRepository")
 */
class Materiel {
    /**
     * @ORM\Id()
     * @ORM\GeneratedValue()
     * @ORM\Column(type="integer")
     */
    private $id;

    /**
     * @ORM\Column(type="string", length=100)
     */
    private $numero;

    /**
     * @ORM\Column(type="string", length=60)
     */
    private $type;

    /**
     * @ORM\Column(type="string", length=255, nullable=true)
     */


    public function getId(): ?int {
        return $this->id;
    }

    public function getNumero(): ?string {
        return $this->numero;
    }

    public function setNumero(string $numero): self {
        $this->numero = $numero;

        return $this;
    }

    public function getType(): ?string {
        return $this->type;
    }

    public function setType(string $type): self {
        $this->type = $type;

        return $this;
    }

    public function getDescription(): ?string {
        return $this->description;
    }

    public function setDescription(?string $description): self {
        $this->description = $description;

        return $this;
    }
}

Il faut ajouter l’association :

Dans la classe Materiel

    /**
     * @ORM\ManyToOne(inversedBy="materiels", targetEntity="\App\Entity\Salle")
     */
    private $salle;

/*
...
*/
    /**
     * @return mixed
     */
    public function getSalle() {
        return $this->salle;
    }

    /**
     * @param mixed $salle
     */
    public function setSalle($salle): void {
        $this->salle = $salle;
    }

Dans la classe Salle

   /**
   * @ORM\OneToMany(targetEntity="\App\Entity\Materiel", mappedBy="salle", cascade={"persist","remove"})
   */
  private $materiels;

  /**
   * Salle constructor.
   */
  public function __construct() {
      $this->materiels = new ArrayCollection();
  }

    /*
    ...
    */


  /**
   * @return mixed
   */
  public function getMateriels() {
      return $this->materiels;
  }

  /**
   * @param mixed $materiels
   */
  public function setMateriels($materiels): void {
      $this->materiels = $materiels;
  }

Créez les entités Salle et Materiel dans votre projet.

Créez les tables correspondendent dans une base de données.

Pour créer les tables dans la base de données on pourra utiliser la commande

php bin/console make:migration

Cette commande crée un script dans le répertoire src/Migrations qui contient les instructions sql pour créer les tables. Il suffit ensuite d’exécuter le script à l’aide de la commande suivante :

 php bin/console doctrine:migrations:migrate

Créez des données aléatoires dans les tables.

Pour créer des données aléatoires, on utilisera la librairie fzaninotto/faker. Il faut créer une classe InventaireFixtures dans un fichier InventaireFixtures.php dans le répertoire src/DataFixtures avec par exemple le contenu suivant :

<?php
namespace App\DataFixtures;


use App\Entity\Materiel;
use App\Entity\Salle;
use Doctrine\Bundle\FixturesBundle\Fixture;
use Doctrine\Common\Persistence\ObjectManager;
use Faker\ORM\Doctrine\Populator;

class InventaireFixtures extends Fixture {

    /**
     * Load data fixtures with the passed EntityManager
     *
     * @param ObjectManager $manager
     */
    public function load(ObjectManager $manager) {
        $generator = \Faker\Factory::create('fr_FR');
        $populator = new Populator($generator, $manager);
        for ($i = 0; $i < 10; $i++) {
            $populator->addEntity('\App\Entity\Salle', 1, array(
                'nom' => function() use ($generator) { return sprintf(('Salle E%2d'),$generator->unique()->randomNumber('2')); },
                'batiment' => function() use ($generator) { return $generator->streetName(); }
            ));
            $populator->addEntity('\App\Entity\Materiel', 25, array(
                'numero' => function() use ($generator) {return $generator->unique()->ean13();},
                'type' => function() use ($generator) {return $generator->optional($weight = 0.1, $default = 'Chaise')->randomElement(['Chaise', 'Table', 'Bureau', 'Estrade', 'Vidéo Projecteur', 'Tableau Blanc', 'Tableau Noir']);},
                'description' => function() use ($generator) {return $generator->realText(255);}
            ));
            $populator->execute();
        }
        $manager->flush();
    }
}

La fonction execute de la classe Populator va associer par défaut le matériel avec la salle qui a été créée. La commande suivante permet de déclencher le chargement des données :

php bin/console doctrine:fixtures:load

5.2 Mise en oeuvre d’une application CRUD

Pour créer un contrôleur qui gère une entité, nous allons utiliser une commande qui est proposée par symfony

php bin/console make:crud Salle

Si vous exécutez cette commande, elle génère une erreur.

                                                                                                                        
 [ERROR] Missing packages: to use the make:crud command, run:                                                           
                                                                                                                        
         composer require form validator security-csrf

Qui nous demande d’installer une nouvelle librairie.

Après installation de la librairie et exécution de la commande, un fichier SalleController.php a été créé dans le répertoire src/Controller. De plus si on visualise le contenu du fichier, on remarque que dans les annotations, les toutes ont été ajoutées automatiquement.

Note : La liste des routes disponibles dans votre application peut être visualisée dans la console à l’aide de la commande :
 php bin/console debug:route

Dans le répertoire templates, un répertoire salle a été créé. Il contient l’ensemble des vues qui vont permettre de manipuler l’entité Salle. Ce travail de départ demande généralement à être modifié pour vos besoins personnels.

Tester l’application CRUD pour l’entité Salle.

5.2.1 Adaptation de l’application CRUD

Pour notre application, nous aurons besoin de :

Lister les salles
Afficher une salle avec la liste des équipements (materiels) qu’elle contient
Modifier une salle, c’est à dire son nom et son bâtiment, mais aussi pouvoir ajouter et/ou supprimer des équipements.
Supprimer une salle et l’ensemble des équipements qu’elle contient.

Modifier l’application CRUD pour assurer les besoins énoncés précédemment.

5.2.2 Traitement des erreurs

Avec Symfony, une erreur de traitement est transformée en exception, il est possible de modifier le comportement de l’application lors de de la levée d’une exception en modifiant le contenu et le style de la page produite en réponse à la requête (d’autres modifications plus fines peuvent être utilisées).

Dans ce TP nous allons nous contenter d’une modification de contenu et de style des pages “erreur”.

Création d’un répertoire templates/bundles/TwigBundle/Exception/. Dans le répertoire nous allons placer les pages d’erreurs qui nous conviennent.
- error404.html.twig pour les erreurs de type 404
- error500.html.twig pour les erreurs de type 500
- etc…
- error.html.twig pour les erreurs dont on a pas trouver la page dans le répertoire.
Pour pouvoir tester ces pages d’erreurs en phase de développement, il faudra utiliser une url de la forme :
```
http://localhost/index.php/_error/{statusCode}
http://localhost/index.php/_error/{statusCode}.{format}
```
Par exemple pour tester une erreur de type 404, on utilisera l’url :
```
http://localhost/index.php/_error/404
```

Modifiez les pages erreurs de l’application.

Enregistrez les modifications sur la forge de l’université.

IUT de Lens Département Informatique

2018

Application web et Symfony

F. Hémery

2018

1 Création d’un projet symfony

2 Ajout d’un serveur web de développement

3 Ajout d’une page à notre application

3.1 Création d’un contrôleur

3.2 Ajout de la barre de debug

3.3 Ajouter une vue avec le moteur de templates twig.

4 Sauvegarde du projet

5 Utilisation d’un modèle d’information

5.1 Ajout de l’outil `doctrine`

5.1.1 Modèle d’information

5.1.2 Pour créer les entités

5.2 Mise en oeuvre d’une application CRUD

5.2.1 Adaptation de l’application CRUD

5.2.2 Traitement des erreurs

Application web et Symfony

F. Hémery

2018

1 Création d’un projet symfony

2 Ajout d’un serveur web de développement

3 Ajout d’une page à notre application

3.1 Création d’un contrôleur

3.2 Ajout de la barre de debug

3.3 Ajouter une vue avec le moteur de templates twig.

4 Sauvegarde du projet

5 Utilisation d’un modèle d’information

5.1 Ajout de l’outil doctrine

5.1.1 Modèle d’information

5.1.2 Pour créer les entités

5.2 Mise en oeuvre d’une application CRUD

5.2.1 Adaptation de l’application CRUD

5.2.2 Traitement des erreurs

5.1 Ajout de l’outil `doctrine`