Comment créer un CRUD simple dans Laravel ?

Comment créer un CRUD simple dans Laravel ?


english français العربية
Laravel il y a 4 mois

Tutoriel Laravel: CRUD complet et simple

Ce tutoriel vous guide pas à pas dans la création d'une application CRUD (Create, Read, Update, Delete) simple et complète en Laravel. Nous aborderons les concepts clés et les bonnes pratiques pour une implémentation efficace.

Prérequis:

PHP (version 7.4 ou supérieure) installé sur votre système. Vérifiez la version avec la commande php -v dans votre terminal.

Composer (gestionnaire de dépendances pour PHP) installé. Téléchargez-le depuis https://getcomposer.org/doc/faqs/how-to-install-composer-programmatically.md.

Une compréhension de base des concepts Laravel tels que les modèles, les contrôleurs, les vues et les migrations.

étapes:

Créer un nouveau projet Laravel:

Ouvrez votre terminal et naviguez vers le répertoire souhaité pour votre projet. Exécutez ensuite la commande suivante pour créer un nouveau projet Laravel nommé laravel-crud:

Bash

composer create-project laravel/laravel laravel-crud

Configurer la connexion à la base de données:

Modifiez le fichier .env situé dans le répertoire racine du projet. Mettez à jour les informations d'identification de la base de données (DB_CONNECTION, DB_HOST, DB_DATABASE, DB_USERNAME, et DB_PASSWORD) pour correspondre à votre configuration de base de données.

Créer un modèle et une migration:

Nous allons créer un modèle pour notre application CRUD, appelons-le Article (ou Post si vous préférez). Dans votre terminal, exécutez la commande suivante :

Bash

php artisan make:model Article -m

Cette commande crée un fichier Article.php dans le répertoire app/Models et un fichier de migration correspondant nommé YYYY_MM_DD_HHMMSS_create_articles_table.php dans le répertoire database/migrations.

Ouvrez le fichier de migration et modifiez la méthode up pour définir le schéma de votre table articles. Voici un exemple :

PHP

public function up()
{
    Schema::create('articles', function (Blueprint $table) {
        $table->id();
        $table->string('titre');
        $table->text('contenu');
        $table->timestamps();
    });
}

Exécutez la migration pour créer la table dans votre base de données :

Bash

php artisan migrate

Créer un contrôleur:

Générez un contrôleur nommé ArticleController en utilisant la commande Artisan :

Bash

php artisan make:controller ArticleController --resource

Cela crée un fichier ArticleController.php dans le répertoire app/Http/Controllers.

Implémenter les opérations CRUD dans le contrôleur:

Ouvrez le fichier ArticleController.php et personnalisez les méthodes pour les fonctionnalités CRUD. Voici une explication détaillée :

PHP

public function index()
{
    $articles = Article::all();
    return view('articles.index', compact('articles'));
}

PHP

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

public function store(Request $request)
{
    $validatedData = $request->validate([
        'titre' => 'required|string|max:255',
        'contenu' => 'required|string',
    ]);

    $article = Article::create($validatedData);

    return redirect('/articles')->with('success', 'Article créé avec succès !');
}

PHP

Index (Lire) : Récupère une liste d'articles et affiche la vue d'index.

Créer (Créer) : Affiche le formulaire de création d'un nouvel article et gère la soumission du formulaire.

Modifier (Mettre à jour) : Récupère l'article pour le modifier et affiche le formulaire d'édition. Gère la soumission du formulaire pour mettre à jour l'article.

5. Implémenter les opérations CRUD dans le contrôleur :

PHP

public function update(Request $request, Article $article) // Liaison de modèle de route
{
    $validatedData = $request->validate([
        'titre' => 'required|string|max:255',
        'contenu' => 'required|string',
    ]);

    $article->update($validatedData);

    return redirect('/articles')->with('success', 'Article mis à jour avec succès !');
}

Supprimer (Supprimer) : Supprime l'article spécifié.

PHP

public function destroy(Article $article) // Liaison de modèle de route
{
    $article->delete();

    return redirect('/articles')->with('success', 'Article supprimé avec succès !');
}

Créer des modèles Blade (Vues):

Générez des modèles Blade pour l'affichage et la gestion des articles :

Bash

php artisan make:view articles

7. Créer des modèles Blade (Vues) (Suite):

Cette commande crée plusieurs fichiers de modèles Blade dans le répertoire resources/views/articles :

 

Définir les routes:

Ouvrez le fichier routes/web.php et ajoutez des routes pour les opérations CRUD :

PHP

Route::resource('articles', ArticleController::class);

Cette ligne unique gère toutes les routes CRUD en utilisant le routage de ressources.

Ouvrez index.blade.php et ajoutez le code suivant pour afficher un tableau d'articles avec le titre, le contenu et les boutons d'édition/suppression :

HTML

@extends('layouts.app') @section('content')
    <h1>Articles</h1>

    @if (session('success'))
        <div class="alert alert-success" role="alert">
            {{ session('success') }}
        </div>
    @endif

    <table class="table table-striped">
        <thead>
            <tr>
                <th>Titre</th>
                <th>Contenu</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            @foreach ($articles as $article)
            <tr>
                <td>{{ $article->titre }}</td>
                <td>{{ Str::limit($article->contenu, 50) }}</td> <td>
                    <a href="{{ route('articles.edit', $article) }}" class="btn btn-sm btn-primary">Modifier</a>
                    <form action="{{ route('articles.destroy', $article) }}" method="POST" style="display: inline-block">
                        @csrf
                        @method('DELETE')
                        <button type="submit" class="btn btn-sm btn-danger">Supprimer</button>
                    </form>
                </td>
            </tr>
            @endforeach
        </tbody>
    </table>

    <a href="{{ route('articles.create') }}" class="btn btn-primary">Créer un nouvel article</a>
@endsection

Explications:

 

index.blade.php : Cette vue affichera une liste de tous les articles.

create.blade.php : Cette vue présentera le formulaire de création d'un nouvel article.

edit.blade.php : Cette vue affichera le formulaire de modification d'un article existant.

La vue étend un fichier de mise en page (layouts.app) si vous en avez un pour la structure de base de la page.

Elle vérifie s'il existe un message de session de réussite et affiche une alerte si c'est le cas.

Un tableau affiche les titres des articles, des extraits de contenu limités (Str::limit), et des boutons d'édition/suppression.

Les boutons d'édition utilisent la liaison de modèle de route pour transmettre l'ID de l'article.

Le formulaire de suppression inclut la protection CSRF et la directive @method('DELETE').

Créez des vues similaires pour create.blade.php et edit.blade.php en utilisant des formulaires HTML et des règles de validation appropriées :

create.blade.php : Incluez des champs de formulaire pour le titre et le contenu avec des règles de validation.

edit.blade.php : Pré-remplissez le formulaire avec les données de l'article existant et incluez des règles de validation.

Certainly, here's the code for the create.blade.php and edit.blade.php views in the Laravel CRUD application, incorporating validation and CSRF protection:

create.blade.php:

HTML

@extends('layouts.app')

@section('content')
<h1>Créer un nouvel article</h1>

@if ($errors->any())
    <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif

<form method="POST" action="{{ route('articles.store') }}">
    @csrf

    <div class="form-group">
        <label for="titre">Titre</label>
        <input type="text" class="form-control @error('titre') is-invalid @enderror" id="titre" name="titre" value="{{ old('titre') }}">
        @error('titre')
            <span class="invalid-feedback" role="alert">
                <strong>{{ $message }}</strong>
            </span>
        @enderror
    </div>

    <div class="form-group">
        <label for="contenu">Contenu</label>
        <textarea class="form-control @error('contenu') is-invalid @enderror" id="contenu" name="contenu" rows="5">{{ old('contenu') }}</textarea>
        @error('contenu')
            <span class="invalid-feedback" role="alert">
                <strong>{{ $message }}</strong>
            </span>
        @enderror
    </div>

    <button type="submit" class="btn btn-primary">Créer</button>
</form>
@endsection

Explanation:

  • Extends your layouts.app for overall page structure.
  • Displays a heading "Créer un nouvel article".
  • Checks for validation errors and displays them in an alert box if any.
  • Includes a form with CSRF protection (@csrf) and POST method to submit data to the articles.store route.
  • Uses Blade directives for form elements and error handling:
    • @error directive checks for specific validation errors and displays them with appropriate Bootstrap classes for styling.
    • old('titre') and old('contenu') keep form data populated in case of validation errors, preventing users from re-entering information.
  • Includes fields for title (titre) and content (contenu).
  • Validates the form input using Laravel's validation classes. You'll need to add corresponding rules in the ArticleController for store method.
  • Submit button with the text "Créer".

edit.blade.php:

HTML

@extends('layouts.app')

@section('content')
<h1>Modifier l'article</h1>

@if ($errors->any())
    <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif

<form method="POST" action="{{ route('articles.update', $article->id) }}">
    @csrf
    @method('PUT') <div class="form-group">
        <label for="titre">Titre</label>
        <input type="text" class="form-control @error('titre') is-invalid @enderror" id="titre" name="titre" value="{{ $article->titre }}">
        @error('titre')
            <span class="invalid-feedback" role="alert">
                <strong>{{ $message }}</strong>
            </span>
        @enderror
    </div>

    <div class="form-group">
        <label for="contenu">Contenu</label>
        <textarea class="form-control @error('contenu') is-invalid @enderror" id="contenu" name="contenu" rows="5">{{ $article->contenu }}</textarea>
        @error('contenu')
            <span class="invalid-feedback" role="alert">
                <strong>{{ $message }}</strong>
            </span>
        @enderror
    </div>

    <button type="submit" class="btn btn-primary">Mettre à jour</button>
</form>
@endsection

 

9. Exécuter l'application:

Démarrez le serveur de développement Laravel en exécutant :

Bash

php artisan serve

Ouvrez http://localhost:8000 (ou votre port configuré) dans votre navigateur pour accéder à l'application.

10. Tester votre fonctionnalité CRUD:

Visitez http://localhost:8000/articles pour voir la liste des articles (vide au départ).

Cliquez sur "Créer un nouvel article" pour accéder au formulaire de création.

Remplissez le formulaire et soumettez-le pour créer un nouvel article.

 

Cliquez sur le bouton "Modifier" pour un article afin d'éditer ses détails.

Cliquez sur le bouton "Supprimer" (avec confirmation) pour supprimer un article.

Visitez à nouveau http://localhost:8000/articles pour voir le nouvel article créé dans la liste.

Considérations supplémentaires:

Validation: Implémentez des règles de validation pour les soumissions de formulaires à l'aide des classes de validation de Laravel afin de garantir l'intégrité des données.

Autorisation: Envisagez d'implémenter des contrôles d'autorisation (par exemple, en utilisant les politiques de Laravel) pour restreindre l'accès aux opérations CRUD en fonction des rôles des utilisateurs.

Pagination: Si vous prévoyez un grand nombre d'articles, implémentez la pagination pour les afficher par sections gérables.

Gestion des erreurs: Gérez les erreurs potentielles pendant les opérations CRUD (par exemple, les erreurs de base de données, les erreurs de validation) pour fournir des messages informatifs à l'utilisateur.

En suivant ces étapes et en incorporant les bonnes pratiques mentionnées, vous disposerez d'une application CRUD Laravel robuste et évolutive comme base pour vos futurs projets de développement web.