Laravel est un framework PHP populaire qui permet de créer des applications web modernes et dynamiques dans le paysage actuel du développement web, en constante évolution. L’une de ses principales fonctionnalités est Laravel Eloquent, un mappeur objet-relationnel (ORM) qui permet aux développeurs d’effectuer efficacement des opérations de création, de lecture, de mise à jour et de suppression (Create, Read, Update, Delete ou CRUD) sur une base de données.
Ce tutoriel montre comment effectuer ces opérations dans votre application Laravel en utilisant l’ORM Eloquent de Laravel et comment déployer votre application CRUD Laravel en utilisant MyKinsta.
Fonctionnalité CRUD dans Laravel
Les opérations CRUD sont l’épine dorsale de toute application basée sur une base de données. Elles vous permettent d’effectuer les opérations les plus élémentaires et les plus essentielles de la base de données, telles que la création de nouveaux enregistrements, la lecture des enregistrements existants, leur mise à jour et leur suppression. Ces opérations sont cruciales pour la fonctionnalité de toute application Laravel qui interagit avec une base de données.
Eloquent fournit un moyen simple et intuitif d’interagir avec la base de données en réduisant la complexité de la gestion de la base de données afin que vous puissiez vous concentrer sur la construction de votre application. Ses méthodes et classes intégrées vous permettent d’accéder facilement aux enregistrements de la base de données.
Pré-requis
Pour suivre ce tutoriel, assurez-vous d’avoir les éléments suivants :
- XAMPP
- Composer
- Un compte MyKinsta
- Un compte sur GitHub, GitLab, ou Bitbucket pour pousser votre code
- Bootstrap version 5
Étapes
- Installez Laravel et créez une nouvelle application
- Créez une base de données
- Créez une table
- Créez un contrôleur
- Configurez le modèle
- Ajouter une route
- Générer des fichiers Blade
- Déployez et testez votre application CRUD
Pour vous guider tout au long du processus, consultez le code complet du tutoriel.
Installer Laravel et créer une nouvelle application
Ouvrez le terminal dans lequel vous souhaitez créer votre application Laravel et suivez les étapes ci-dessous.
- Pour installer Laravel, exécutez :
composer global require laravel/installer- Pour créer une nouvelle application Laravel, exécutez :
laravel new crudpostsCréer une base de données
Pour créer une nouvelle base de données pour votre application :
- Démarrez les serveurs Apache et MySQL dans le panneau de contrôle XAMPP et visitez
http://localhost/phpmyadmindans votre navigateur.
- Cliquez sur Nouveau dans la colonne latérale de gauche. Vous devriez voir ce qui suit :
- Ajoutez un nom de base de données et cliquez sur Créer.
- Modifiez le fichier .env de votre application à la racine de votre application Laravel. Il contient toutes les variables d’environnement utilisées par l’application. Localisez les variables préfixées par
DB_et modifiez-les avec les informations d’identification de votre base de données :
DB_CONNECTION=
DB_HOST=
DB_PORT=
DB_DATABASE=
DB_USERNAME=
DB_PASSWORD=Créer une table
Les lignes de données de votre application sont stockées dans des tables. Pour cette application, vous n’avez besoin que d’une seule table, créée à l’aide des migrations Laravel.
- Pour créer une table et générer un fichier de migration à l’aide de l’interface en ligne de commande de Laravel, Artisan, exécutez :
php artisan make:migration create_posts_tableLa commande ci-dessus crée un nouveau fichier,
yyyy_mm_dd_hhmmss_create_posts_table.php, dans database/migrations.
- Ouvrez le fichier yyyy_mm_dd_hhmmss_create_posts_table.php pour définir les colonnes que vous voulez dans votre table de base de données dans la fonction up :
public function up()
{
Schema::create('posts', function (Blueprint $table) {
$table->id();
$table->string('title');
$table->text('body');
$table->timestamps();
});
}Ce code définit le contenu de la table posts. Elle comporte quatre colonnes : id, title, body, et timestamps.
- Exécutez les fichiers de migration dans le dossier database/migrations pour créer des tables dans la base de données :
php artisan migrateLe résultat ressemble à ceci :
- Accédez à la base de données que vous avez créée précédemment pour confirmer que vous avez créé les tables :
Créer un contrôleur
Le contrôleur contient toutes les fonctions pour CRUD les posts de la base de données.
Générez un fichier de contrôleur dans votre application Laravel en utilisant Artisan :
php artisan make:controller PostController --apiL’exécution de cette commande crée un fichier PostController.php dans app/Http/Controllers, avec un code passe-partout et des déclarations de fonctions vides index, store, show, update, et destroy.
Créer des fonctions
Ensuite, créez les fonctions qui stockent, indexent, mettent à jour, détruisent, créent, affichent et modifient les données.
Vous pouvez les ajouter au fichier app/Http/Controller/PostController.php illustré ci-dessous.
La fonction store
La fonction store ajoute un message à la base de données.
Allez jusqu’à la fonction store et ajoutez le code suivant à l’intérieur des accolades vides :
$request->validate([
'title' => 'required|max:255',
'body' => 'required',
]);
Post::create($request->all());
return redirect()->route('posts.index')
->with('success','Post created successfully.');Ce code prend un objet contenant le titre et le corps de l’article, valide les données, ajoute un nouvel article à la base de données si les données sont valides et redirige l’utilisateur vers la page d’accueil avec un message de réussite.
La fonction index
La fonction index récupère tous les messages de la base de données et envoie les données au fichier posts.index à la page posts.index.
La fonction update
La fonction <update contient le id de l’article à mettre à jour, le nouvel article title et le body. Après avoir validé les données, elle recherche l’article ayant le même id. Si elle le trouve, la fonction update met à jour le message dans la base de données avec les nouveaux title et body. Ensuite, elle redirige l’utilisateur vers la page d’accueil avec un message de réussite.
La fonction destroy
La fonction destroy trouve un message avec le nom id et le supprime de la base de données, puis redirige l’utilisateur vers la page d’accueil avec un message de succès.
Les fonctions ci-dessus sont les fonctions utilisées pour CRUD les messages de la base de données. Cependant, vous devez définir d’autres fonctions dans le contrôleur pour rendre les pages nécessaires dans resources/views/posts/.
La fonction create
La fonction create rend la page resources/views/posts/create.blade.php qui contient le formulaire d’ajout d’articles à la base de données.
La fonction show
La fonction show trouve un article avec l’adresse id dans la base de données et affiche la page resources/views/posts/show.blade.php avec l’article.
La fonction edit
La fonction edit trouve un article avec l’adresse id dans la base de données et affiche le fichier resources/views/posts/show.blade.php avec le message resources/views/posts/edit.blade.php avec les détails de l’article à l’intérieur d’un formulaire.
Mise en place du modèle
Le modèle Post interagit avec la table posts de la base de données.
- Pour créer un modèle avec Artisan, exécutez :
php artisan make:model PostCe code crée un fichier Post.php dans le dossier App/Models.
- Créez un tableau
<fillable. Ajoutez le code suivant dans la classePostet sous la ligneuse HasFactory;
protected $fillable = [
'title',
'body',
];Ce code crée un tableau fillable qui vous permet d’ajouter des éléments à la base de données depuis votre application Laravel.
- Connectez le modèle
Postau fichier PostController.php. Ouvrez PostController.php et ajoutez la ligne ci-dessous soususe IlluminateHttpRequest;. Elle se présente comme suit :
use Illuminate\Http\Request;
use App\Models\Post;Le fichier PostController.php devrait maintenant ressembler à ceci :
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Post;
class PostController extends Controller
{
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
$posts = Post::all();
return view('posts.index', compact('posts'));
}
/**
* Store a newly created resource in storage.
*
* @param \Illuminate\Http\Request $request
* @return \Illuminate\Http\Response
*/
public function store(Request $request)
{
$request->validate([
'title' => 'required|max:255',
'body' => 'required',
]);
Post::create($request->all());
return redirect()->route('posts.index')
->with('success', 'Post created successfully.');
}
/**
* Update the specified resource in storage.
*
* @param \Illuminate\Http\Request $request
* @param int $id
* @return \Illuminate\Http\Response
*/
public function update(Request $request, $id)
{
$request->validate([
'title' => 'required|max:255',
'body' => 'required',
]);
$post = Post::find($id);
$post->update($request->all());
return redirect()->route('posts.index')
->with('success', 'Post updated successfully.');
}
/**
* Remove the specified resource from storage.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function destroy($id)
{
$post = Post::find($id);
$post->delete();
return redirect()->route('posts.index')
->with('success', 'Post deleted successfully');
}
// routes functions
/**
* Show the form for creating a new post.
*
* @return \Illuminate\Http\Response
*/
public function create()
{
return view('posts.create');
}
/**
* Display the specified resource.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function show($id)
{
$post = Post::find($id);
return view('posts.show', compact('post'));
}
/**
* Show the form for editing the specified post.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function edit($id)
{
$post = Post::find($id);
return view('posts.edit', compact('post'));
}
}Ajouter des routes
Après avoir créé les fonctions du contrôleur et le modèle Post, vous devez ajouter des routes pour les fonctions de votre contrôleur.
- Ouvrez routes/web.php et supprimez la route « boilerplate » générée par l’application. Remplacez-la par le code ci-dessous pour connecter les fonctions du contrôleur à leurs routes respectives :
// returns the home page with all posts
Route::get('/', PostController::class .'@index')->name('posts.index');
// returns the form for adding a post
Route::get('/posts/create', PostController::class . '@create')->name('posts.create');
// adds a post to the database
Route::post('/posts', PostController::class .'@store')->name('posts.store');
// returns a page that shows a full post
Route::get('/posts/{post}', PostController::class .'@show')->name('posts.show');
// returns the form for editing a post
Route::get('/posts/{post}/edit', PostController::class .'@edit')->name('posts.edit');
// updates a post
Route::put('/posts/{post}', PostController::class .'@update')->name('posts.update');
// deletes a post
Route::delete('/posts/{post}', PostController::class .'@destroy')->name('posts.destroy');- Pour connecter les routes, ouvrez app/Http/Controllers/PostController.php et ajoutez la ligne ci-dessous sous la ligne
use Illuminate\Support\Facades\Route;:
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\PostController;Le fichier routes/web.php devrait maintenant ressembler à ceci :
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\PostController;
// returns the home page with all posts
Route::get('/', PostController::class .'@index')->name('posts.index');
// returns the form for adding a post
Route::get('/posts/create', PostController::class . '@create')->name('posts.create');
// adds a post to the database
Route::post('/posts', PostController::class .'@store')->name('posts.store');
// returns a page that shows a full post
Route::get('/posts/{post}', PostController::class .'@show')->name('posts.show');
// returns the form for editing a post
Route::get('/posts/{post}/edit', PostController::class .'@edit')->name('posts.edit');
// updates a post
Route::put('/posts/{post}', PostController::class .'@update')->name('posts.update');
// deletes a post
Route::delete('/posts/{post}', PostController::class .'@destroy')->name('posts.destroy');Générer les fichiers Blade
Maintenant que vous avez les routes, vous pouvez créer les fichiers Laravel Blade. Avant d’utiliser Artisan pour générer les fichiers Blade, créez la commande make:view, avec laquelle vous pouvez générer les fichiers blade.php.
- Exécutez le code suivant dans le CLI pour créer un fichier de commande MakeViewCommand dans le dossier app/Console/Commands :
php artisan make:command MakeViewCommand- Créez une commande pour générer des fichiers .blade.php à partir de l’interface de programmation en remplaçant le code du fichier MakeViewCommand par le suivant :
<?php
namespace App\Console\Commands;
use Illuminate\Console\Command;
use File;
class MakeViewCommand extends Command
{
/**
* The name and signature of the console command.
*
* @var string
*/
protected $signature = 'make:view {view}';
/**
* The console command description.
*
* @var string
*/
protected $description = 'Create a new blade template.';
/**
* Execute the console command.
*
* @return mixed
*/
public function handle()
{
$view = $this->argument('view');
$path = $this->viewPath($view);
$this->createDir($path);
if (File::exists($path))
{
$this->error("File {$path} already exists!");
return;
}
File::put($path, $path);
$this->info("File {$path} created.");
}
/**
* Get the view full path.
*
* @param string $view
*
* @return string
*/
public function viewPath($view)
{
$view = str_replace('.', '/', $view) . '.blade.php';
$path = "resources/views/{$view}";
return $path;
}
/**
* Create a view directory if it does not exist.
*
* @param $path
*/
public function createDir($path)
{
$dir = dirname($path);
if (!file_exists($dir))
{
mkdir($dir, 0777, true);
}
}
}Créer une page d’accueil
Créez ensuite votre page d’accueil. La page d’accueil est le fichier index.blade.php, qui répertorie tous les articles.
- Pour créer la page d’accueil, exécutez :
php artisan make:view posts.indexCela crée un dossier posts dans le dossier /resources/views et un fichier index.blade.php en dessous. Le chemin résultant est /resources/views/posts/index.blade.php.
- Ajoutez le code suivant dans le fichier index.blade.php:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
<title>Posts</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-warning">
<div class="container-fluid">
<a class="navbar-brand h1" href={{ route('posts.index') }}>CRUDPosts</a>
<div class="justify-end ">
<div class="col ">
<a class="btn btn-sm btn-success" href={{ route('posts.create') }}>Add Post</a>
</div>
</div>
</div>
</nav>
<div class="container mt-5">
<div class="row">
@foreach ($posts as $post)
<div class="col-sm">
<div class="card">
<div class="card-header">
<h5 class="card-title">{{ $post->title }}</h5>
</div>
<div class="card-body">
<p class="card-text">{{ $post->body }}</p>
</div>
<div class="card-footer">
<div class="row">
<div class="col-sm">
<a href="{{ route('posts.edit', $post->id) }}"
class="btn btn-primary btn-sm">Edit</a>
</div>
<div class="col-sm">
<form action="{{ route('posts.destroy', $post->id) }}" method="post">
@csrf
@method('DELETE')
<button type="submit" class="btn btn-danger btn-sm">Delete</button>
</form>
</div>
</div>
</div>
</div>
</div>
@endforeach
</div>
</div>
</body>
</html>Le code ci-dessus crée une page HTML simple qui utilise Bootstrap pour le style. Il établit une barre de navigation et un modèle de grille qui répertorie tous les articles de la base de données avec des détails et deux boutons d’action – modifier et supprimer – en utilisant l’aide @foreach Blade.
Le bouton Modifier permet à l’utilisateur d’accéder à la page Modifier l’article, où il peut modifier l’article. Le bouton Supprimer supprime l’article de la base de données en utilisant {{ route('posts.destroy', $post->id) }} avec une méthode DELETE.
Remarque : le code de la barre de navigation pour tous les fichiers est le même que celui du fichier précédent.
- Créez la page create.blade.php. Le fichier Blade appelé create ajoute des articles à la base de données. Utilisez la commande suivante pour générer le fichier :
php artisan make:view posts.createCela génère un fichier create.blade.php dans le dossier /resources/views/posts.
- Ajoutez le code suivant au fichier create.blade.php:
// same as the previous file. Add the following after the nav tag and before the closing body tag.
<div class="container h-100 mt-5">
<div class="row h-100 justify-content-center align-items-center">
<div class="col-10 col-md-8 col-lg-6">
<h3>Add a Post</h3>
<form action="{{ route('posts.store') }}" method="post">
@csrf
<div class="form-group">
<label for="title">Title</label>
<input type="text" class="form-control" id="title" name="title" required>
</div>
<div class="form-group">
<label for="body">Body</label>
<textarea class="form-control" id="body" name="body" rows="3" required></textarea>
</div>
<br>
<button type="submit" class="btn btn-primary">Create Post</button>
</form>
</div>
</div>
</div>Le code ci-dessus crée un formulaire avec les champs title et body et un bouton submit pour ajouter un message à la base de données via l’action {{ route('posts.store') }} avec une méthode POST.
- Créez la page Modifier l’article pour modifier les articles dans la base de données. Utilisez la commande suivante pour générer le fichier :
php artisan make:view posts.editCela crée un fichier edit.blade.php dans le dossier /resources/views/posts.
- Ajoutez le code suivant au fichier edit.blade.php:
<div class="container h-100 mt-5">
<div class="row h-100 justify-content-center align-items-center">
<div class="col-10 col-md-8 col-lg-6">
<h3>Update Post</h3>
<form action="{{ route('posts.update', $post->id) }}" method="post">
@csrf
@method('PUT')
<div class="form-group">
<label for="title">Title</label>
<input type="text" class="form-control" id="title" name="title"
value="{{ $post->title }}" required>
</div>
<div class="form-group">
<label for="body">Body</label>
<textarea class="form-control" id="body" name="body" rows="3" required>{{ $post->body }}</textarea>
</div>
<button type="submit" class="btn mt-3 btn-primary">Update Post</button>
</form>
</div>
</div>
</div>Le code ci-dessus crée un formulaire avec des champs title et body et un bouton de soumission pour modifier un article avec le numéro spécifié id dans la base de données via l’action {{ route('posts.update') }} avec une méthode PUT.
- Redémarrez ensuite votre serveur d’application à l’aide du code ci-dessous :
php artisan serveVisitez http://127.0.0.1:8000 sur votre navigateur pour voir votre nouveau blog. Cliquez sur le bouton Ajouter un article pour ajouter de nouveaux articles.
Déployer et tester votre application CRUD
Préparez votre application pour le déploiement comme suit.
- Facilitez le déploiement en déclarant le dossier public. Ajoutez un fichier .htaccess à la racine du dossier de l’application avec le code suivant :
<IfModule mod_rewrite.c >
RewriteEngine On
RewriteRule ^(.*)$ public/$1 [L]
</IfModule >- Forcez votre application à utiliser
HTTPSen ajoutant le code suivant au-dessus de vos routes dans le fichier routes/web.php:
use Illuminate\Support\Facades\URL;
URL::forceScheme('https');- Poussez votre code vers un dépôt Git. Kinsta prend en charge les déploiements à partir de GitHub, GitLab ou Bitbucket.
Configurer un projet sur MyKinsta
- Créez un compte MyKinsta si vous n’en avez pas déjà un.
- Connectez-vous à votre compte et cliquez sur le bouton Ajouter un service dans le tableau de bord pour créer une nouvelle application.
- Si vous ne connaissez pas encore l’application, connectez-vous à votre compte GitHub, GitLab ou Bitbucket et donnez des autorisations spécifiques.
- Remplissez le formulaire et ajoutez la valeur
APP_KEY. Vous pouvez trouver la valeur correspondante dans votre fichier .env.
- Sélectionnez vos ressources de construction et si vous voulez utiliser le chemin de construction de votre application ou construire votre application avec Dockerfile. Pour cette démonstration, laissez MyKinsta construire l’application sur la base de votre dépôt.
- Spécifiez les différents processus que vous voulez exécuter pendant le déploiement. Vous pouvez laisser ce champ vide à ce stade.
- Enfin, ajoutez votre moyen de paiement.
Après avoir confirmé votre moyen de paiement, MyKinsta déploie votre application et vous attribue une URL comme indiqué ci-dessous :
Vous pouvez visiter le lien, mais vous obtenez une page 500 | Server Error parce que l’application a besoin d’une connexion valide à la base de données pour fonctionner. La section suivante résout ce problème.
Créer une base de données via MyKinsta
- Pour créer une base de données, allez sur votre tableau de bord MyKinsta et cliquez sur Ajouter un service.
- Sélectionnez Base de données et remplissez le formulaire avec le nom et le type de votre base de données, votre nom d’utilisateur et votre mot de passe. Ajoutez un centre de données et une taille de base de données adaptée à votre application.
- La page suivante affiche le récapitulatif des coûts et votre moyen de paiement. Cliquez sur Créer une base de données pour terminer la procédure.
- Après avoir créé la base de données, MyKinsta vous redirige vers votre liste de services. Cliquez sur la base de données que vous venez de créer et descendez jusqu’à Connexions externes. Copiez les informations d’identification de la base de données.
- Retournez à la page Déploiement de l’application et cliquez sur Réglages. Ensuite, faites défiler vers le bas jusqu’à Variables d’environnement et cliquez sur Ajouter des variables d’environnement. Ajoutez les informations d’identification de la base de données en tant que variables d’environnement dans l’ordre suivant :
DB_CONNECTION=mysql
DB_HOST=External hostname
DB_PORT=External port
DB_DATABASE=Database name
DB_USERNAME=Username
DB_PASSWORD=PasswordLa liste des variables d’environnement de l’application devrait maintenant ressembler à ceci :
- Allez sur la page Déploiements de votre application et déployez manuellement votre application en cliquant sur Déployer maintenant pour appliquer ces changements. Jusqu’à présent, vous avez créé une base de données et l’avez connectée à votre application.
- Enfin, pour créer les tables de votre base de données MyKinsta, connectez la base de données à votre application locale en mettant à jour votre fichier .env avec les mêmes informations d’identification que vous avez saisies dans votre application MyKinsta et exécutez la commande suivante :
php artisan migrateCette commande exécute tous les fichiers de migration. Elle crée toutes les tables définies dans votre application MyKinsta.
Maintenant, vous pouvez tester votre application avec l’URL assignée après le premier déploiement.
Résumé
Laravel est un framework complet pour créer des applications web robustes et évolutives qui nécessitent des fonctionnalités CRUD. Grâce à sa syntaxe intuitive et à ses puissantes fonctionnalités, Laravel facilite l’intégration d’opérations CRUD dans votre application.
Cet article couvre les concepts fondamentaux des opérations CRUD et la manière de les mettre en œuvre en utilisant les fonctionnalités intégrées de Laravel. Il explique également :
- Comment créer une base de données dans MyKinsta et la connecter à votre application
- Comment utiliser les migrations de Laravel pour définir la table de la base de données, créer le fichier du contrôleur et ses fonctions
- Définir un modèle et le connecter au contrôleur. Le routage de Laravel génère des fichiers Blade pour créer les pages et formulaires correspondants et pour déployer et tester l’application en utilisant MyKinsta
Maintenant que vous avez vu à quel point il est facile d’effectuer des opérations CRUD dans Laravel, consultez MyKinsta pour le développement et l’hébergement d’applications web.
Laisser un commentaire