-
On va initialiser un projet de type
website-skeletonavec la commande suivante en console :composer create-project symfony/website-skeleton symfony -
Ensuite, pointez vers votre dossier de travail (
cd symfony) et pensez à faire ungit initafin de versionner votre travail.
Note: pensez à faire un commit à chaque étape ! Les commits vous serviront de fiche de révision.
-
Le projet créé, ouvrez-le dans VSCode et éditez le fichier .env afin de configurer l'accès à la base de données.
-
Comme la console l'indique lors de l'installation de Symfony, vous pouvez dès à présent accéder à votre application en lançant le serveur natif :
php bin/console server:runet aller sur l'URLhttp://127.0.0.1:8000. -
Prenez un moment pour découvrir les outils de débogage inclus !
Il existe plusieurs façons de créer nos routes. Nous utiliserons le fichier routes.yaml :
home:
path: /home
controller: App\Controller\HomeController::home
On définit ici que la route /home pointera vers le contrôleur App\Controller\HomeController, et sa méthode home().
Nos contrôleurs seront dans le namespace App\Controller.
On sait grâce au fichier
composer.jsonque le namespace App pointe vers le dossiersrc.
On va donc créer notre contrôleur dans le dossier src/controller, et bien indiquer le namespace correspondant.
Voici le contenu d'un contrôleur type :
- On définit le namespace comme prévu
- On définit la classe et la méthode indiquée dans la route
<?php
namespace App\Controller;
class HomeController {
public function home() {
}
}- Notre méthode retournera un objet de type
Response(précisémentSymfony\Component\HttpFoundation\Response) .
Comme il est long d'utiliser
Symfony\Component\HttpFoundation\Response, si notre IDE est bien configuré, lorsque l'on précise que la méthode doit il devrait importer l'aliasuse Symfony\Component\HttpFoundation\Responseafin de pouvoir utiliser l'aliasResponsedirectement.
<?php
namespace App\Controller;
use Symfony\Component\HttpFoundation\Response;
class HomeController {
public function home() : Response {
}
}On peut indiquer le type de retour de la méthode est une Response avec
method() : Response. C'est une feature de PHP 7, qui est un prérequis à Symfony 4.
Le type
Responseest issu du composant HttpFoundation, qui permet d'ajouter une couche d'abstraction aux Requests et Response HTTP et les gérer pour nous. Il nous permet de faire des choses comme :// url : http://www.example.com/user?name=Julie $request->query->get('name'); // retourne 'Julie' // url : http://www.example.com/user/hello-world $request->getPathInfo(); // retourne /user/hello-world
Toutes les actions de routes doivent retourner un type Response (en effet, lorsque l'on saisit une URL, on attend bien une réponse HTTP !). On utilisera donc ce composant pour chaque action.
On va donc retourner un objet Response pour compléter l'action :
public function home() : Response {
return new Response('Hello world!');
}En allant sur localhost:8000/home, on voit 'Hello world!' s'afficher.
Pour créer des routes, nous avons vu le fichier yaml. Nous pouvons également rédiger nos routes directement au dessus de la méthode correspondante ! Par exemple, créons la page d'accueil (la route est / et la méthode sera accueil()) .
Attention ! N'oubliez pas d'importer l'alias pour Route avec
use.
[...]
use Symfony\Component\Routing\Annotation\Route;
[...]
/**
* @Route("/", name="accueil")
*/
public function accueil() : Response {
return new Response('Page d\'accueil');
}En testant localhost:8000, on tombe bien sur la bonne route.
L'avantage est d'avoir la route directement liée à l'action dans le code, le désavantage étant d'avoir des routes de partout et qu'il peut parfois être difficile de s'y retrouver.
Créez une route pour "localhost:8000/profil" qui affichera
Profil de l'utilisateur, via un contrôleur de Users et avec une route en YAML. Créez une route pour "localhost:8000/apropos" qui afficheraA propos du site, via le contrôleur de Home et avec une route en Annotations.
Maintenant que nous avons réussi à retourner une réponse à notre route, nous allons voir comment retourner du HTML. Symfony utilise un moteur de template, Twig, nous verrons un peu plus tard comment il s'utilise.
Nous pourrions importer Twig dans notre contrôleur afin d'utiliser cet outil :
class HomeController {
private $twig;
public function __construct(Environment $twig) {
$this->twig = $twig;
}
public function home() : Response {
return Response($this->twig->render('home.html.twig'));
}
}Mais ça serait contraignant d'importer différents services à chaque contrôleur.
Pour cela, nous allons dire à notre contrôleur d'hériter de AbstractController (fichier ici) qui contient des tas de helpers disponibles, et notamment Twig. C'est une classe abstraite, qui est en quelque sorte un modèle de classe (exemple: une classe abstraite Félin, inutilisable seule, et des classes qui Tigre et Chat qui en héritent).
Nous allons donc plutôt hériter de AbstractController:
namespace App\Controller;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
class HomeController extends AbstractController {
public function home() : Response {
return $this->render('home.html.twig');
}
}Décryptons la ligne
return $this->render('home.html.twig');:
return: nous allons retourner une vue. En fait, toujours un objet de type Response, qui va retourner du HTML via un template Twig$this->render()est issu du traitControllerTrait, importé dans la classe abstraiteAbstractController. Il permet d'effectuer le rendu de...template.twig.html, qui est un fichier template qui contient du HTML et du code Twig.
Créons enfin le template dans le dossier suivant : /templates/home/home.html.twig, dans lequel nous saisissons juste Hello world.
Si tout se passe bien, en allant sur http://localhost:8000/home, nous voyons le contenu du fichier Twig.
Symfony vient avec un fichier template de base que nous pouvons utiliser plutôt que d'écrire une page HTML complète dans ce fichier ! En étudiant le fichier base.html.twig, on découvre qu'il y a des éléments "block". Ce sont les blocs que nous pouvons remplir dans un fichier Twig enfant, voici comment étendre home.html.twig:
{% extends "base.html.twig" %}
{% block title %}Home !{% endblock %}
{% block body %}
<h1>Hello world</h1>
{% endblock %}Si tout se passe bien, en retournant sur /home, nous retrouvons notre Hello world mais avec la barre de débug Symfony !
Pour agrémenter notre vue, nous allons importer Bootstrap 4 et la navbar de base : dans
base.html.twig, avant le blockstylesheetset avant le blockjavascripts, vous importerez les assets de Bootstrap 4. Pour décorer tout cela, vous importerez la navbar par défaut de Bootstrap, que vous mettrez juste avant le blockbody, toujours dans le fichierbase.html.twig. Créez une vue pour chacune des routes créées.
Dans base.html.twig, nous allons modifier le lien vers la page d'accueil. Pour cela, nous utiliserons la fonction path() qui prend en argument non pas une URL mais un nom de route.
Par exemple, pour la page d'accueil, ce sera path('accueil').
Pour executer du PHP dans twig, nous allons utiliser des double-accolades :
<a class="navbar-brand" href="{{ path('home') }}">TestApp</a>