Nouveau : Datasets open source gratuits disponibles !Decouvrir →
🐘
Intermediaire 35 min Laravel

Laravel : creer une application web

Pourquoi Laravel : creer une application web ?

Laravel est un framework PHP très populaire pour créer des applications web robustes, performantes et bien structurées. Il offre une grande flexibilité tout en facilitant les tâches complexes de développement.

Un cas concret d'utilisation serait la création d'un site e-commerce : avec Laravel, on peut gérer facilement la gestion des produits, des paniers, des paiements, et même l'intégration de services tiers comme Google Analytics ou Stripe pour le traitement des transactions.

Prerequis

  • Connaissance de base en PHP
  • Familiarité avec les bases du MVC (Model-View-Controller)
  • Compréhension des concepts d'ORM (Object-Relational Mapping) et SQL

Outils à installer :

  • PHP >= 8.1
  • Composer (gestionnaire de dépendances)
  • Node.js (pour l'utilisation de packages comme Laravel Mix)
  • Un éditeur de code (ex: VSCode, PhpStorm)

Installation rapide de Laravel

## Installer Composer si ce n'est pas déjà fait
curl -sS https://getcomposer.org/installer | php -- --install-dir=/usr/local/bin --filename=composer

## Créer un nouveau projet Laravel
composer create-project --prefer-dist laravel/laravel my-app

Concepts fondamentaux

1. Routing

Le routing est le processus par lequel les URL sont mappées aux actions appropriées dans votre application.

// routes/web.php

Route::get('/hello', function () {
    return 'Bonjour, Laravel !';
});

2. Controllers

Les contrôleurs gèrent la logique métier de l'application.

// app/Http/Controllers/WelcomeController.php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class WelcomeController extends Controller
{
    public function index()
    {
        return view('welcome');
    }
}

3. Views (Vues)

Les vues définissent la structure de l'interface utilisateur.

<!-- resources/views/welcome.blade.php -->

<!DOCTYPE html>
<html>
<head>
    <title>Bienvenue</title>
</head>
<body>
    <h1>$message</h1>
</body>
</html>

4. Models (Modèles)

Les modèles représentent les données et interagissent avec la base de données.

// app/Models/User.php

namespace App\Models;

use Illuminate\Database\Eloquent\Model;

class User extends Model
{
    protected $fillable = ['name', 'email'];
}

5. Migrations (Migrations)

Les migrations permettent de gérer les schémas de la base de données.

// database/migrations/2014_10_12_000000_create_users_table.php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateUsersTable extends Migration
{
    public function up()
    {
        Schema::create('users', function (Blueprint $table) {
            $table->id();
            $table->string('name');
            $table->string('email')->unique();
            $table->timestamps();
        });
    }

    public function down()
    {
        Schema::dropIfExists('users');
    }
}

6. Middleware

Les middleware permettent de filtrer les requêtes HTTP avant qu'elles ne atteignent le contrôleur.

// app/Http/Middleware/Authenticate.php

namespace App\Http\Middleware;

use Closure;
use Illuminate\Support\Facades\Auth;

class Authenticate
{
    public function handle($request, Closure $next)
    {
        if (!Auth::check()) {
            return redirect('login');
        }

        return $next($request);
    }
}

7. Packages (Packages)

Les packages tiers augmentent les fonctionnalités de Laravel en ajoutant des composants supplémentaires.

## Installer un package via Composer
composer require laravel/ui

## Utiliser le package pour créer une interface d'authentification
php artisan ui vue --auth
npm install && npm run dev

Mise en pratique : projet fil rouge

Créer un gestionnaire de tâches simple

## Créer un nouveau projet Laravel
composer create-project --prefer-dist laravel/laravel task-manager

## Installer les dépendances
cd task-manager
npm install && npm run dev

Étape 1 : Création d'une migration pour la table des tâches

// database/migrations/2023_04_01_000000_create_tasks_table.php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateTasksTable extends Migration
{
    public function up()
    {
        Schema::create('tasks', function (Blueprint $table) {
            $table->id();
            $table->string('title');
            $table->text('description')->nullable();
            $table->boolean('completed')->default(false);
            $table->timestamps();
        });
    }

    public function down()
    {
        Schema::dropIfExists('tasks');
    }
}
bash
## Exécuter la migration
php artisan migrate

Étape 2 : Création d'un modèle pour les tâches

// app/Models/Task.php

namespace App\Models;

use Illuminate\Database\Eloquent\Model;

class Task extends Model
{
    protected $fillable = ['title', 'description', 'completed'];
}

Étape 3 : Création d'une migration pour l'authentification des utilisateurs

## Installer le package Laravel UI et créer les vues d'authentification
composer require laravel/ui
php artisan ui vue --auth
npm install && npm run dev

Étape 4 : Création de la contrôleur pour les tâches

// app/Http/Controllers/TaskController.php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Models\Task;

class TaskController extends Controller
{
    public function index()
    {
        $tasks = Task::all();
        return view('tasks.index', compact('tasks'));
    }

    public function create()
    {
        return view('tasks.create');
    }

    public function store(Request $request)
    {
        $task = Task::create($request->all());
        return redirect()->route('tasks.index');
    }

    public function edit(Task $task)
    {
        return view('tasks.edit', compact('task'));
    }

    public function update(Request $request, Task $task)
    {
        $task->update($request->all());
        return redirect()->route('tasks.index');
    }

    public function destroy(Task $task)
    {
        $task->delete();
        return redirect()->route('tasks.index');
    }
}

Étape 5 : Création des vues pour les tâches

<!-- resources/views/tasks/index.blade.php -->

@extends('layouts.app')

@section('content')
<div class="container">
    <h1>Tâches</h1>
    <a href="route('tasks.create')" class="btn btn-primary mb-2">Nouvelle Tâche</a>
    <table class="table">
        <thead>
            <tr>
                <th>ID</th>
                <th>Titre</th>
                <th>Description</th>
                <th>Complétée</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody>
            @foreach ($tasks as $task)
            <tr>
                <td>$task->id</td>
                <td>$task->title</td>
                <td>$task->description</td>
                <td>$task->completed ? 'Oui' : 'Non'</td>
                <td>
                    <a href="route('tasks.edit', $task)" class="btn btn-warning">Modifier</a>
                    <form action="route('tasks.destroy', $task)" method="POST" style="display: inline-block;">
                        @csrf
                        @method('DELETE')
                        <button type="submit" class="btn btn-danger">Supprimer</button>
                    </form>
                </td>
            </tr>
            @endforeach
        </tbody>
    </table>
</div>
@endsection

<!-- resources/views/tasks/create.blade.php -->

@extends('layouts.app')

@section('content')
<div class="container">
    <h1>Nouvelle Tâche</h1>
    <form action="route('tasks.store')" method="POST">
        @csrf
        <div class="mb-3">
            <label for="title" class="form-label">Titre</label>
            <input type="text" name="title" id="title" class="form-control" required>
        </div>
        <div class="mb-3">
            <label for="description" class="form-label">Description</label>
            <textarea name="description" id="description" class="form-control"></textarea>
        </div>
        <button type="submit" class="btn btn-primary">Enregistrer</button>
    </form>
</div>
@endsection

<!-- resources/views/tasks/edit.blade.php -->

@extends('layouts.app')

@section('content')
<div class="container">
    <h1>Modifier Tâche</h1>
    <form action="route('tasks.update', $task)" method="POST">
        @csrf
        @method('PUT')
        <div class="mb-3">
            <label for="title" class="form-label">Titre</label>
            <input type="text" name="title" id="title" class="form-control" value="$task->title" required>
        </div>
        <div class="mb-3">
            <label for="description" class="form-label">Description</label>
            <textarea name="description" id="description" class="form-control">$task->description</textarea>
        </div>
        <button type="submit" class="btn btn-primary">Mettre à jour</button>
    </form>
</div>
@endsection

Étape 6 : Configuration des routes

// routes/web.php

use App\Http\Controllers\TaskController;

Route::get('/tasks', [TaskController::class, 'index'])->name('tasks.index');
Route::get('/tasks/create', [TaskController::class, 'create'])->name('tasks.create');
Route::post('/tasks', [TaskController::class, 'store'])->name('tasks.store');
Route::get('/tasks/{task}/edit', [TaskController::class, 'edit'])->name('tasks.edit');
Route::put('/tasks/{task}', [TaskController::class, 'update'])->name('tasks.update');
Route::delete('/tasks/{task}', [TaskController::class, 'destroy'])->name('tasks.destroy');

Erreurs frequentes et debugging

1. ErrorException : Trying to get property 'id' of non-object

## ❌ Mauvais
$task = Task::find($id);

## ✅ Correct
$task = Task::where('id', $id)->first();

2. InvalidArgumentException : Expected argument of type [string], null given

## ❌ Mauvais
Route::get('/tasks/{task}', function ($task) {
    return view('tasks.show', compact('task'));
});

## ✅ Correct
Route::get('/tasks/{id}', function ($id) {
    $task = Task::find($id);
    if (!$task) {
        abort(404, 'Tâche non trouvée');
    }
    return view('tasks.show', compact('task'));
});

3. SQLSTATE[42S22]: Column not found: 1054 Unknown column 'id' in 'where clause'

## ❌ Mauvais
$task = Task::whereId($id)->first();

## ✅ Correct
$task = Task::find($id);

Pour aller plus loin

1. Traitement des formulaires avec Laravel Collective

2. Utilisation de Vue.js pour la gestion frontale

3. Intégration avec un service d'API RESTful

Défi pratique : Créer un simple blog

  1. Installer Laravel.
  2. Créer un modèle Post et sa migration correspondante.
  3. Créer un contrôleur pour les articles de blog.
  4. Créer des vues pour afficher, créer, modifier et supprimer des articles.

Code du contrôleur :

// app/Http/Controllers/PostController.php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Models\Post;

class PostController extends Controller
{
    public function index()
    {
        $posts = Post::all();
        return view('posts.index', compact('posts'));
    }

    public function create()
    {
        return view('posts.create');
    }

    public function store(Request $request)
    {
        Post::create($request->all());
        return redirect()->route('posts.index');
    }

    public function show(Post $post)
    {
        return view('posts.show', compact('post'));
    }

    public function edit(Post $post)
    {
        return view('posts.edit', compact('post'));
    }

    public function update(Request $request, Post $post)
    {
        $post->update($request->all());
        return redirect()->route('posts.index');
    }

    public function destroy(Post $post)
    {
        $post->delete();
        return redirect()->route('posts.index');
    }
}

Code des vues :

<!-- resources/views/posts/index.blade.php -->

@extends('layouts.app')

@section('content')
<div class="container">
    <h1>Articles</h1>
    <a href="route('posts.create')" class="btn btn-primary mb-2">Nouvel Article</a>
    <table class="table">
        <thead>
            <tr>
                <th>ID</th>
                <th>Title</th>
                <th>Description</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody>
            @foreach ($posts as $post)
            <tr>
                <td>$post->id</td>
                <td>$post->title</td>
                <td>$post->description</td>
                <td>
                    <a href="route('posts.show', $post)" class="btn btn-info">Voir</a>
                    <a href="route('posts.edit', $post)" class="btn btn-warning">Modifier</a>
                    <form action="route('posts.destroy', $post)" method="POST" style="display: inline-block;">
                        @csrf
                        @method('DELETE')
                        <button type="submit" class="btn btn-danger">Supprimer</button>
                    </form>
                </td>
            </tr>
            @endforeach
        </tbody>
    </table>
</div>
@endsection

<!-- resources/views/posts/create.blade.php -->

@extends('layouts.app')

@section('content')
<div class="container">
    <h1>Nouvel Article</h1>
    <form action="route('posts.store')" method="POST">
        @csrf
        <div class="mb-3">
            <label for="title" class="form-label">Titre</label>
            <input type="text" name="title" id="title" class="form-control" required>
        </div>
        <div class="mb-3">
            <label for="description" class="form-label">Description</label>
            <textarea name="description" id="description" class="form-control"></textarea>
        </div>
        <button type="submit" class="btn btn-primary">Enregistrer</button>
    </form>
</div>
@endsection

<!-- resources/views/posts/edit.blade.php -->

@extends('layouts.app')

@section('content')
<div class="container">
    <h1>Modifier Article</h1>
    <form action="route('posts.update', $post)" method="POST">
        @csrf
        @method('PUT')
        <div class="mb-3">
            <label for="title" class="form-label">Titre</label>
            <input type="text" name="title" id="title" class="form-control" value="$post->title" required>
        </div>
        <div class="mb-3">
            <label for="description" class="form-label">Description</label>
            <textarea name="description" id="description" class="form-control">$post->description</textarea>
        </div>
        <button type="submit" class="btn btn-primary">Mettre à jour</button>
    </form>
</div>
@endsection

Code de la migration :

// database/migrations/xxxx_xx_xx_create_posts_table.php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreatePostsTable extends Migration
{
    public function up()
    {
        Schema::create('posts', function (Blueprint $table) {
            $table->id();
            $table->string('title');
            $table->text('description')->nullable();
            $table->timestamps();
        });
    }

    public function down()
    {
        Schema::dropIfExists('posts');
    }
}

Code du modèle :

// app/Models/Post.php

namespace App\Models;

use Illuminate\Database\Eloquent\Model;

class Post extends Model
{
    protected $fillable = ['title', 'description'];
}

En suivant ces étapes, vous devriez être en mesure de créer un simple blog avec Laravel.

Besoin d'aide sur Laravel ?

Besoin d'aide sur un projet technique ? Decrivez-le pour des conseils personnalises.

Recevoir des conseils

Questions frequentes

Quelle est la différence entre Laravel et d'autres frameworks PHP comme Symfony ou CodeIgniter ?
Laravel est un framework full-stack qui propose une architecture MVC robuste, des outils de développement intégrés et une grande communauté. Il est connu pour sa simplicité et sa facilité à apprendre. Symfony est également un framework full-stack avec une large gamme de fonctionnalités, mais il est souvent considéré comme plus complexe. CodeIgniter, en revanche, est connu pour son minimalisme et ses performances.
Comment installe-t-on Laravel sur mon ordinateur ?
Pour installer Laravel, vous devez d'abord avoir PHP et Composer installés sur votre système. Ensuite, vous pouvez utiliser la commande 'composer create-project --prefer-dist laravel/laravel nom_du_projet' dans votre terminal pour créer un nouveau projet Laravel.
Quelle est la structure de base d'une application Laravel ?
Une application Laravel se structure autour des principaux composants suivants : les routes, les contrôleurs, les vues et le modèle. Les routes définissent comment une URL correspond à une action spécifique. Les contrôleurs gèrent les logiques métier. Les vues affichent la sortie utilisateur. Le modèle interagit avec la base de données.

Pages liees

Chaque semaine, le meilleur de la tech francaise

Tendances, salaires, outils et opportunites — directement dans votre boite mail.

Gratuit. Desabonnement en un clic. Pas de spam.