Académique Documents
Professionnel Documents
Culture Documents
Menu Sommaire
Introduction à Laravel
Sommaire
# Introduction
Pour pouvoir utiliser Laravel, nous allons avoir besoin de différents outils :
PHP 8.1
Composer
Windows
Xampp ou Wamp
Pour « installer » Laravel sous Windows, vous devez dans un premier temps
installer PHP 8 sur votre machine. Dans un premier temps, installer Wamp N PHP
8O
:
Installation de Wamp.
Installer Composer
Linux
Pour Linux c’est plus simple, il suffit d’installer PHP 8 sur votre machine
(regarder la documentation de votre distribution). Une fois que PHP est installé,
il vous suffit d'installer Composer
bash
1 curl -sS https://getcomposer.org/installer | php
2 sudo mv composer.phar /usr/local/bin/composer
3 chmod +x /usr/local/bin/composer
macOS
Sous macOS, il est possible d’utiliser la commande brew pour installer PHP 8.1.
Pour ça, il suffit de faire :
bash
1 brew install php
Brew est un gestionnaire de paquets pour macOS, il est très pratique pour
installer des logiciels. Pour l’installer, il suffit de suivre la documentation
officielle : https://brew.sh/fr/
:
Créer le premier Projet
Votre poste est maintenant configuré pour Laravel, vous pouvez donc créer un
nouveau projet grâce à la commande :
bash
1 composer create-project --prefer-dist laravel/laravel mon-premier-projet
Si vous avez récupéré le projet depuis GIT vous n'allez bien évidemment pas utiliser la
commande create-project … Par contre vous allez devoir réinstaller les
dépendances ( vendor ) de votre projet. C'est très simple :
sh
1 composer install
Initialisation
Votre nouveau projet contient un fichier .env ouvrez-le, et éditez par exemple
le nom du projet.
Questions :
bash
1 php artisan serve
php
1 return view('welcome');
en
php
1 return view('welcome', ['titre' => 'Mon premier exemple.']);
Vous pouvez également appeler des fonctions dans les templates, exemple
:
time() . Tester cette fonction en ajoutant :
html
1 <p>Le Timestamp est {{ time() }}</p>
Questions :
php
1 Route::get('/ping', function () {
2 return "pong";
3 });
Un instant
Nous avons écrit un peu de code. Vous avez pensé à GIT ? Git est en effet
préconfiguré dans Laravel, nous avons de base un fichier, .gitignore celui-ci limite
l'ajout de quelques fichiers :
.env
Question :
Créer le layout
html
1 <!DOCTYPE html>
2 <html lang="{{ app()->getLocale() }}">
3 <head>
4 <meta charset="utf-8" />
5 <meta http-equiv="X-UA-Compatible" content="IE=edge" />
6 <meta name="viewport" content="width=device-width, initial-scale=1"
7
8 <title>Laravel - @yield('title')</title>
9
10 <!-- Fonts -->
11 <link
12 href="https://fonts.googleapis.com/css?family=Raleway:100,600"
13 rel="stylesheet"
14 type="text/css"
15 />
16
17 <!-- Styles -->
18 <style>
:
19 html,
20 body {
21 background-color: #fff;
22 color: #636b6f;
23 font-family: "Raleway", sans-serif;
24 font-weight: 100;
25 height: 100vh;
26 margin: 0;
27 }
28 .full-height {
29 height: 100vh;
30 }
31 .flex-center {
32 align-items: center;
33 display: flex;
34 justify-content: center;
35 }
36 .position-ref {
37 position: relative;
38 }
39 .top-right {
40 position: absolute;
41 right: 10px;
42 top: 18px;
43 }
44 .content {
45 text-align: center;
46 }
47 .title {
48 font-size: 84px;
49 }
50 .links > a {
51 color: #636b6f;
52 padding: 0 25px;
53 font-size: 12px;
54 font-weight: 600;
55 letter-spacing: 0.1rem;
56 text-decoration: none;
57 text-transform: uppercase;
:
58 }
59 .m-b-md {
60 margin-bottom: 30px;
61 }
62 </style>
63 </head>
64 <body>
65 <div class="flex-center position-ref full-height">
66 @if (Route::has('login'))
67 <div class="top-right links">
68 @auth
69 <a href="{{ url('/home') }}">Home</a>
70 @else
71 <a href="{{ route('login') }}">Login</a>
72 <a href="{{ route('register') }}">Register</a>
73 @endauth
74 </div>
75 @endif
76
77 <div class="content">@yield('content')</div>
78 </div>
79 </body>
80 </html>
Question :
Maintenant que nous avons notre template de base, nous allons l’utiliser dans le
template « Welcome ». Remplacer le contenu de
resources/views/welcome.blade.php par :
:
html
1 @extends('layouts.base')
2
3 @section('title', 'Bienvenue')
4
5 @section('content')
6 <div class="title m-b-md">Laravel</div>
7
8 <div class="links">
9 <a href="https://laravel.com/docs">Documentation</a>
10 <a href="https://laracasts.com">Laracasts</a>
11 <a href="https://laravel-news.com">News</a>
12 <a href="https://forge.laravel.com">Forge</a>
13 <a href="https://github.com/laravel/laravel">GitHub</a>
14 </div>
15 @endsection
Bon, maintenant que nous avons déclaré un layout utilisons-le dans la 2nd route
(/ping) que nous avons créée tout à l’heure. Pour cette dernière action, je ne
vous donne pas de code, mais uniquement les étapes :
Avec ces quelques explications, vous allez pouvoir atteindre l’objectif. Bon
courage.
Cette notation est très récente et n'est disponible qu'à partir de Laravel 8.
Un composant
Utiliser un contrôleur
La force de Laravel est sa structure, nous avons vu ensemble que celui-ci
propose un découpage « précis » et clair des couches « MVC » qModèle, Vue,
Controlleur). Nous allons donc organiser notre code pour utiliser un Contrôleur
(qui je le rappelle à pour but de répondre aux requêtes HTTP des clients).
Le Contrôleur:
:
C'est la première étape, un tour dans la console / terminal pour créer notre
premier contrôleur.
sh
1 php artisan make:controller PingPongControleur
Laravel, viens donc de créer un nouveau fichier dans votre projet, pour l'instant
celui-ci est vide (aucune méthode).
Oui, c'est encore dans le terminal / console … Mais, nous gagnons du temps. Qui
maîtrise son clavier maîtrise son ordinateur .
Route Méthode
/ping ping()
/pong pong()
Nous allons donc devoir ajouter dans notre contrôleur les deux routes. Je
vous laisse ouvrir le PingPongControleur pour y ajouter les méthodes
suivantes :
php
1 public function ping()
2 {
3 return view('ping', []);
4 }
5
6 public function pong()
7 {
8 return view('pong', []);
9 }
:
AB ?
Vous avez oublié la signification des [] ? C'est « simplement » les données que nous
pourrions envoyer à notre vue. Pratique !
Les routes
Nous allons maintenant ajouter les routes, pour rappel les routes sont ce qui
permet aux utilisateurs d'accéder à vos contrôleurs. L'ensemble des routes sont
à déclarer dans le fichier routes/web.php , éditer le pour y ajouter vos routes :
php
1 Route::get('/ping', [PingPongControleur::class, 'ping']);
Une astuce ?
Vous pouvez simplement vérifier que votre route est bien prise en compte via la
commande :
sh
1 php artisan route:list
Les vues
Vous l'avez réalisé précédemment, je vous laisse écrire les deux vue /
layout . Attention à bien hériter de votre « Layout de base »
La base de données
:
L'avantage d'utiliser un Framework, c'est qu'il est très simple d'y intégrer la
partie base de données, contrairement à un développement classique où tout
est à « ré-inventer » un framework nous donne une structure / un cadre pour
aller plus vite. Comme pour la création du contrôleur, la première étape va
passer par de la ligne de commande.
sh
1 php artisan make:model Todo --migration
app/Models/Todo.php
database/migrations/YEAR_MONTH_DAY_TIME_create_todo_table.php
php
1 $table->string('texte');
2 $table->boolean('termine')->default(false);
Vous avez un doute sur comment faire ? (je vous invite vraiment à le faire sans
regarder la solution)
:
Définition du modèle
Vous vous en doutez, si nous avons ajouté un champ dans notre « migration » /
« table », nous allons devoir l'ajouter également dans notre modèle ! Pour ça je
vous laisse éditer le fichier app/Models/Todo.php pour y ajouter :
php
1 protected $fillable = ['texte', 'termine'];
Avec cet ajout, nous indiquons à Laravel que nous allons avoir un champ texte
qui pourra être assigné en automatique lors de la création d'une entrée en base
de données.
Cette propriété est optionnelle, elle vous autorisera plus tard à faire du « mass-
assignment » c'est-à-dire à créer un objet « Todo » depuis par exemple le POST HTTP.
Maintenant que le script est terminé, nous allons indiquer à Laravel d'effectuer «
la migration » c'est-à-dire de transformer votre définition PHP en instruction
SQL pour créer réellement la base de données.
sh
1 $ php artisan migrate
2 […]
3 Migrating: YEAR_MONTH_DAY_TIME_create_todos_table
4 Migrated: YEAR_MONTH_DAY_TIME_create_todos_table
Un instant
Je vous laisse configurer votre, .env mais également vérifier si votre base de
données fonctionne correctement (création etc.).
:
Requêter votre table
Pour vous montrer la simplicité de Eloquent, je vous laisse juste avec les appels
de méthodes (nous avons vu ça ensemble lors du cours)
Vous n’avez ici qu'une petite liste de ce qu'il est possible de faire. Pour voir
l'ensemble, je vous suggère plutôt la documentation officielle
Voilà un exemple de code pour obtenir l'ensemble des données dans la table
todo .
php
1 $valeursEnBase = Todo::all()
Voilà un exemple de code pour obtenir 10 lignes de données avec un filtre et trié
par id .
php
1 $valeursFiltre = Todo::where('texte', "YOLO")->orderBy('id')->take(10)
Vous avez ici des exemples, ça ne sert à rien de les prendre maintenant. Nous allons
les utiliser dans votre contrôleur.
Et c'est tellement simple que si vous souhaitez tout récupérer pour utiliser les
données il vous suffit de faire :
:
php
1 public function listTodo(Request $request){
2 // Retourne à l'utilisateur le template nommés « monLayout » avec dedans
3 // Votre template devra utiliser cette variable avec par exemple un @fore
4 return view("monLayout", ["todos" => Todo::all()]);
5 }
Un instant
php
1 use App\Models\Todo;
Si vous utilisez VSCode, il faudra passer par une extension disponible ici
php
1 public function addTodo(Request $request){
2 Todo::create($request->all());
3 return redirect("/todo");
4 }
Finaliser
À partir de maintenant vous avez tout ce qu'il faut pour interroger votre base de
données… Et oui c'est aussi simple que ça ! Pour la suite je vous laisse écrire le
:
code par vous-même, mais la procédure va être la suivante :
Un instant
Nous l'avons vu en cours, la syntaxe du moteur de template blade. Ici il faudra donc
bien utiliser Blade pour générer votre page, et plus particulièrement les directives de
blades. Vous allez devoir utiliser la boucle Foreach , la notation est rappelée dans
l'aide mémoire. Mais voilà une idée de ce qu'il faudra faire :
html
1 <table>
2 @foreach($LaVariableAvecLesValeursEnBase as $unElement)
3 <tr>
4 <td>{{$unElement->texte}}</td>
5 </tr>
6 @endforeach
7 </table>
N'oubliez pas
@csrf
:
Exemple :
html
1 <form method="POST" action="/VOTRE-ACTION-DEFINIE-DANS-LES-ROUTES">
2 @csrf
3
4 <!-- La suite de votre formulaire -->
5 </form>
PSO Je vous laisse constater l'impact dans le code en observant le code source via
votre navigateur.
Plus d'information
Rappel
php
1 // Rechercher celui avec l’id « L'ID QUE VOUS SOUHAITEZ MODIFIER » (Exemple : 1)
2 $todo = Todo::find("L'ID QUE VOUS SOUHAITEZ MODIFIER");
3
4 // Le passer à terminer
5 $todo->termine = true;
6
7 // Le sauvegarder en base de données. (Ici Eloquent va générer une requête de ty
8 $todo->save();
Besoin d'aide ?
Je ne vais pas vous donner le code. Mais plutôt la procédure, vous devez :
Pour chaque ligne de votre tableau : ajouter un lien qui permettra de modifier l'état
d'un élément en base. Le lien peut-être du type /todo/terminer/{{ $unElement-
>id}} .
:
Ajout d'une route permettant de faire fonctionner le lien. Exemple :
Route::get('/todo/terminer/{id}', [TodoControleur::class, 'markAsDone']); .
la TODO $id
Rappel
php
1 // Façon 1
2 // Rechercher celui avec l’id 1
3 $todo = Todo::find(1);
4 $todo->delete(); // Le supprimer
5
6 // Façon 2
7 // Le supprimer directement
8 Todo::destroy(1);
9
10 // Façon 3
11 // En supprimer plusieurs directement
12 Todo::destroy(1,2,3);
13
14 // Façon 4
15 // Supprimer avec une condition
16 Todo::where('termine', '==', 1)->delete();
N'oubliez pas la sécurité. Et n'oubliez pas également qu'il ne dois pas être
possible de supprimer une TODO qui n'est pas terminée en base de données.
:
Besoin d'aide ?
Évolution 1
Évolution 2
C'est à vous !