Tutoriel Laravel : Créer Votre Première Page d'Accueil

Introduction

Salut là, futurs développeurs web ! Je suis ravi de vous guider dans cette excitante aventure dans le monde de Laravel. En tant que quelqu'un qui enseigne l'informatique depuis plus d'une décennie, je peux vous dire que Laravel est l'un des frameworks les plus puissants et agréables à utiliser. Aujourd'hui, nous allons créer notre toute première page d'accueil en utilisant Laravel. Ne vous inquiétez pas si vous n'avez jamais codé auparavant - on va avancer pas à pas, et avant que vous ne vous en rendiez compte, vous serez en train de créer des pages web magnifiques comme un pro !

Qu'est-ce que Laravel ?

Avant de plonger dedans, parlons rapidement de ce qu'est réellement Laravel. Imaginez que vous construisez une maison. Laravel est comme votre boîte à outils fiable, remplie de tous sorts d'outils pratiques qui rendent le travail plus simple et plus rapide. C'est un framework PHP qui aide les développeurs à créer des applications web sans réinventer la roue à chaque fois. C'est comme avoir un tas de pièces de Lego préconstruites que vous pouvez assembler pour créer quelque chose d'incroyable !

Prérequis

Pour suivre ce tutoriel, vous aurez besoin de :

1. Un ordinateur (évidemment !)
2. PHP installé sur votre machine (version 7.3 ou supérieure)
3. Composer (un gestionnaire de dépendances PHP)
4. Un éditeur de texte (je recommande Visual Studio Code, mais utilisez celui avec lequel vous êtes à l'aise)
5. Un sens de l'aventure et une volonté d'apprendre !

Ne vous inquiétez pas si vous n'avez pas encore tout cela configuré. Il y a plein de tutoriels géniaux là-bas pour vous aider à préparer votre environnement.

Configuration de Laravel

Étape 1 : Installer Laravel

Premiers chose en premier, installons Laravel. Ouvrez votre terminal (ne soyez pas effrayé, c'est juste une manière textuelle de communiquer avec votre ordinateur) et tapez :

composer create-project --prefer-dist laravel/laravel mon-premier-projet-laravel

Cette commande dit à Composer de créer un nouveau projet Laravel dans un dossier appelé mon-premier-projet-laravel. Cela peut prendre quelques minutes, donc peut-être prendre un café ou faire une petite danse pendant que vous attendez.

Étape 2 : Naviguer dans Votre Projet

Une fois cela fait, naviguons dans notre nouveau dossier de projet :

cd mon-premier-projet-laravel

Félicitations ! Vous êtes maintenant dans votre tout premier projet Laravel. Ça fait du bien, non ?

Créer Votre Page d'Accueil

Étape 3 : Comprendre les Routes

Dans Laravel, les routes sont comme la réceptionniste de votre application. Elles décident où les visiteurs doivent aller lorsqu'ils arrivent sur votre site web. Ouvrons le fichier routes/web.php. C'est ici que nous dirons à Laravel quoi faire lorsque quelqu'un visite notre page d'accueil.

Vous verrez quelque chose comme cela :

Route::get('/', function () {
return view('welcome');
});

C'est la route par défaut de Laravel. Elle dit, "Lorsque quelqu'un visite la racine de notre site ('/'), montrez-lui la vue 'welcome'." Mais nous voulons créer notre propre page d'accueil, donc changeons cela !

Étape 4 : Créer un Contrôleur

Les contrôleurs sont comme les gestionnaires de votre application. Ils traitent les demandes et retournent des réponses. Créons-en un pour notre page d'accueil :

php artisan make:controller HomeController

Cette commande crée un nouveau fichier à app/Http/Controllers/HomeController.php. Ouvrez-le et ajoutons une méthode :

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class HomeController extends Controller
{
public function index()
{
return view('home');
}
}

Cette méthode index sera responsable de l'affichage de notre page d'accueil.

Étape 5 : Mettre à Jour la Route

Maintenant, mettons à jour notre fichier routes/web.php pour utiliser notre nouveau contrôleur :

use App\Http\Controllers\HomeController;

Route::get('/', [HomeController::class, 'index']);

Cela dit à Laravel, "Lorsque quelqu'un visite '/', utilisez la méthode index du HomeController."

Étape 6 : Créer la Vue

Maintenant, nous devons créer le HTML réel de notre page d'accueil. Créez un nouveau fichier à resources/views/home.blade.php et ajoutez du HTML :

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bienvenue sur Mon Premier Site Laravel !</title>
</head>
<body>
<h1>Bonjour, Monde Laravel !</h1>
<p>Ceci est ma toute première page d'accueil Laravel. Ça promet !</p>
</body>
</html>

Étape 7 : Exécuter Votre Application

Maintenant, le moment de vérité ! Dans votre terminal, exécutez :

php artisan serve

Cela démarre un serveur de développement. Ouvrez votre navigateur et allez à http://localhost:8000. Vous devriez voir votre nouvelle page d'accueil !

Ajouter un Peu de Pochette

Étape 8 : Utiliser les Templates Blade

Laravel utilise un moteur de templates appelé Blade. C'est comme du HTML avec des superpouvoirs. Mettons à jour notre home.blade.php pour utiliser certaines fonctionnalités de Blade :

@extends('layouts.app')

@section('content')
<h1>Bienvenue sur {{ config('app.name') }} !</h1>
<p>L'heure actuelle est {{ now() }}.</p>
@endsection

Maintenant, créez un nouveau fichier à resources/views/layouts/app.blade.php :

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@yield('title', config('app.name'))</title>
</head>
<body>
@yield('content')
</body>
</html>

Cela crée un gabarit réutilisable que notre page d'accueil (et les futures pages) peuvent utiliser.

Conclusion

Et voilà ! Vous avez créé votre toute première page d'accueil Laravel. Nous avons couvert beaucoup de terrain - de la configuration de Laravel à la création de routes, de contrôleurs et de vues. Souvenez-vous, apprendre à coder est un voyage, pas une destination. Continuez à pratiquer, continuez à explorer, et surtout, continuez à prendre du plaisir !

Voici un tableau de référence rapide des principaux concepts Laravel que nous avons couverts :

Concept	Description
Routes	Définissent les URLs et comment l'application répond aux demandes
Contrôleurs	Traitent la logique pour répondre aux demandes
Vues	Contiennent le HTML servi par votre application
Blade	Le moteur de templates de Laravel pour créer des vues dynamiques

Bonne programmation, et bienvenue dans le merveilleux monde de Laravel !

Credits: Image by storyset