Zo voer je CRUD (Create, Read, Update en Delete) bewerkingen uit met Laravel

Laravel is een populair PHP framework voor het bouwen van moderne en dynamische webapplicaties in het snelle en steeds veranderende landschap van webdevelopment van vandaag de dag. Een van de belangrijkste features is Laravel Eloquent, een object-relatioal mapper (ORM) waarmee developers efficiënt CRUD bewerkingen (create, read, update en delete) op een database kunnen uitvoeren.

Deze tutorial laat zien hoe je deze bewerkingen kunt uitvoeren in je Laravel applicatie met behulp van Laravel’s Eloquent ORM en hoe je je Laravel CRUD applicatie kunt implementeren met behulp van MyKinsta.

CRUD functionaliteit in Laravel

CRUD bewerkingen vormen de ruggengraat van elke database-gedreven applicatie. Hiermee kun je de meest elementaire en essentiële databasebewerkingen uitvoeren, zoals het maken van nieuwe records, het lezen van bestaande records en het bijwerken en verwijderen ervan. Deze bewerkingen zijn cruciaal voor de functionaliteit van elke Laravel applicatie die met een database werkt.

Eloquent biedt een eenvoudige en intuïtieve manier van interactie met de database door de complexiteit van databasebeheer te verminderen, zodat je je kunt richten op het bouwen van je applicatie. Met de ingebouwde methoden en klassen kun je eenvoudig CRUD records in de database uitvoeren.

Vereisten

Om deze tutorial te kunnen volgen, moet je over het volgende beschikken:

• XAMPP
• Composer
• Een MyKinsta account
• Een account op GitHub, GitLab of Bitbucket om je code te pushen
• Bootstrap versie 5

Stappen

1. Laravel installeren en een nieuwe applicatie maken
2. Een database maken
3. Een tabel maken
4. Een controller maken
5. Het model instellen
6. Een route toevoegen
7. Blade bestanden genereren
8. Je CRUD applicatie deployen en testen

Bekijk de volledige code van de tutorial voor hulp tijdens het coderen.

Laravel installeren en een nieuwe applicatie maken

Open je terminal waar je je Laravel applicatie wilt maken en volg de onderstaande stappen.

1. Voer dit uit om Laravel te installeren:

composer global require laravel/installer

2. Om een nieuwe Laravel applicatie te maken, voer je uit:

laravel new crudposts

Database maken

Om een nieuwe database aan te maken voor je applicatie:

1. Start de Apache en MySQL servers in het XAMPP controlepaneel en ga naar http://localhost/phpmyadmin in je browser.

2. Klik op New in de linker zijbalk. Je zou het volgende moeten zien:

3. Voeg een databasenaam toe en klik op Create.

4. Bewerk het .env bestand van je applicatie in de root van je Laravel applicatie. Het bevat alle omgevingsvariabelen die door de applicatie worden gebruikt. Zoek de variabelen met het voorvoegsel DB_ en bewerk ze met je databasegegevens:

DB_CONNECTION=
DB_HOST=
DB_PORT=
DB_DATABASE=
DB_USERNAME=
DB_PASSWORD=

Een tabel maken

De rijen gegevens in je applicatie worden opgeslagen in tabellen. Je hebt maar één tabel nodig voor deze applicatie, die is gemaakt met Laravel migrations.

1. Voer Artisan, de opdrachtregelinterface van Laravel, uit om een tabel te maken en een migratiebestand te genereren:

php artisan make:migration create_posts_table

Het bovenstaande commando maakt een nieuw bestand,

yyyy_mm_dd_hhmmss_create_posts_table.php, in database/migrations.

2. Open yyyy_mm_dd_hhmmss_create_posts_table.php om de kolommen te definiëren die je in je database tabel wilt hebben in de up functie:

public function up()
{
  Schema::create('posts', function (Blueprint $table) {
    $table->id();
    $table->string('title');
    $table->text('body');
    $table->timestamps();
  });
}

Deze code definieert wat de posts tabel bevat. Het heeft vier kolommen: id, title, body, en timestamps.

3. Voer de migratiebestanden in de map database/migrations uit om tabellen aan te maken in de database:

php artisan migrate

De uitvoer ziet er als volgt uit:

4. Ga naar de database die je eerder hebt gemaakt om te bevestigen dat je de tabellen hebt gemaakt:

Een controller maken

De controller bevat alle functies om posts uit de database te CRUD-en.

Genereer een controllerbestand in je Laravel applicatie met Artisan:

php artisan make:controller PostController --api

Door deze opdracht uit te voeren maak je een PostController.php bestand in app/Http/Controllers, met boilerplate code en de lege functiedeclaraties index, store, show, update, en destroy.

Functies maken

Maak vervolgens de functies die de gegevens opslaan, indexeren, bijwerken, vernietigen, aanmaken, tonen en bewerken.

Je kunt ze toevoegen aan het bestand app/Http/Controller/PostController.php zoals hieronder getoond.

De functie store

De functie store voegt een post toe aan de database.

Blader naar de functie store en voeg de volgende code toe binnen de lege accolades:

$request->validate([
  'title' => 'required|max:255',
  'body' => 'required',
]);
Post::create($request->all());
return redirect()->route('posts.index')
  ->with('success','Post created successfully.');

Deze code neemt een object dat de titel en de inhoud van de post bevat, valideert de gegevens, voegt een nieuwe post toe aan de database als de gegevens geldig zijn en stuurt de gebruiker door naar de homepage met een succesbericht.

De functie index

De functie index haalt alle posts op uit de database en stuurt de gegevens naar de posts.index pagina.

De functie update

De functie <update bevat de id van de bij te werken post, de nieuwe post title en de body. Na het valideren van de gegevens wordt de post met dezelfde id gevonden. Als die gevonden is, werkt de functie update de post in de database bij met de nieuwe title en body. Daarna wordt de gebruiker doorgestuurd naar de homepage met een succesmelding.

De functie destroy

De functie destroy vindt een post met het gegeven id en verwijdert het uit de database, waarna de gebruiker naar de homepage wordt doorgestuurd met een succesmelding.

De bovenstaande functies zijn de functies die worden gebruikt om posts uit de database te CRUD-en. Je moet echter meer functies definiëren in de controller om de benodigde pagina’s te renderen in resources/views/posts/.

De functie create

De functie create rendert de resources/views/posts/create.blade.php pagina, die het formulier bevat voor het toevoegen van posts aan de database.

De functie show

De show functie vindt een post met het gegeven id in de database en rendert de resources/views/posts/show.blade.php bestand met de post.

De functie edit

De edit functie vindt een post met het gegeven id in de database en rendert het resources/views/posts/edit.blade.php bestand met de details van de post in een formulier.

Het model instellen

Het Post model werkt samen met de posts tabel in de database.

1. Om een model te maken met Artisan, voer je uit:

php artisan make:model Post

Deze code maakt een Post.php bestand in de App/Models map.

2. Maak een <fillable array. Voeg de volgende code toe binnen de klasse Post en onder de regel use HasFactory;

protected $fillable = [
  'title',
  'body',
];

Deze code maakt een fillable array waarmee je items aan de database kunt toevoegen vanuit je Laravel applicatie.

3. Verbind het Post model met het PostController.php bestand. Open PostController.php en voeg onderstaande regel toe onder use IlluminateHttpRequest;. Het ziet er als volgt uit:

use IlluminateHttpRequest;
use AppModelsPost;

Het bestand PostController.php zou er nu zo uit moeten zien:

<?php
namespace AppHttpControllers;
use IlluminateHttpRequest;
use AppModelsPost;
class PostController extends Controller
{
  /**
   * Display a listing of the resource.
   *
   * @return IlluminateHttpResponse
   */
  public function index()
  {
    $posts = Post::all();
    return view('posts.index', compact('posts'));
  }
  /**
   * Store a newly created resource in storage.
   *
   * @param  IlluminateHttpRequest  $request
   * @return IlluminateHttpResponse
   */
  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  IlluminateHttpRequest  $request
   * @param  int  $id
   * @return IlluminateHttpResponse
   */
  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 IlluminateHttpResponse
   */
  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 IlluminateHttpResponse
   */
  public function create()
  {
    return view('posts.create');
  }
  /**
   * Display the specified resource.
   *
   * @param  int  $id
   * @return IlluminateHttpResponse
   */
  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 IlluminateHttpResponse
   */
  public function edit($id)
  {
    $post = Post::find($id);
    return view('posts.edit', compact('post'));
  }
}

Routes toevoegen

Nadat je de controllerfuncties en het Post model hebt gemaakt, moet je routes toevoegen voor je controllerfuncties.

1. Open routes/web.php en verwijder de boilerplate route die de applicatie heeft gegenereerd. Vervang deze door de onderstaande code om de controllerfuncties te verbinden met hun respectievelijke routes:

// 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');

2. Om de routes te verbinden, open je app/Http/Controllers/PostController.php en voeg je onderstaande regel toe onder de regel use IlluminateSupportFacadesRoute;:

use IlluminateSupportFacadesRoute;
use AppHttpControllersPostController;

Het bestand routes/web.php zou er nu zo uit moeten zien:

<?php
use IlluminateSupportFacadesRoute;
use AppHttpControllersPostController;
// 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');

Blade bestanden genereren

Nu je de routes hebt, kun je de Laravel Blade bestanden maken. Voordat je Artisan gebruikt om de Blade bestanden te genereren, moet je het commando make:view maken, waarmee je blade.php bestanden kunt genereren.

1. Voer de volgende code uit in de CLI om een MakeViewCommand opdrachtbestand te maken in de app/Console/Commands map:

php artisan make:command MakeViewCommand

2. Maak een commando voor het genereren van .blade.php bestanden vanuit de CLI door de code in het MakeViewCommand bestand te vervangen door het volgende:

<?php
namespace AppConsoleCommands;
use IlluminateConsoleCommand;
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);
    }
  }
}

Homepage maken

Maak vervolgens je startpagina. De homepage is het bestand index.blade.php, waarin alle posts staan.

1. Om de homepage te maken, voer je uit:

php artisan make:view posts.index

Dit maakt een map posts in de map /resources/views en een bestand index.blade.php eronder. Het resulterende pad is /resources/views/posts/index.blade.php.

2. Voeg de volgende code toe aan het bestand 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>

De bovenstaande code maakt een eenvoudige HTML pagina die Bootstrap gebruikt voor styling. Het maakt een navigatiebalk en een rastertemplate dat alle posts in de database weergeeft met details en twee actieknoppen – edit en delete – met behulp van de @foreach Blade helper.

De knop Edit brengt de gebruiker naar de pagina Edit post, waar hij de post kan bewerken. De knop Delete verwijdert de post uit de database met behulp van {{ route('posts.destroy', $post->id) }} met een methode DELETE.

Opmerking: De navbarcode voor alle bestanden is hetzelfde als in het vorige bestand.

3. Maak de pagina create.blade.php. Het Blade bestand genaamd create voegt posts toe aan de database. Gebruik het volgende commando om het bestand te genereren:

php artisan make:view posts.create

Dit genereert een bestand create.blade.php in de map /resources/views/posts .

4. Voeg de volgende code toe aan het bestand 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>

Bovenstaande code maakt een formulier met title en body velden en een submit knop voor het toevoegen van een post aan de database via de {{ route('posts.store') }} actie met een POST methode.

5. Maak de pagina Edit post om posts in de database te bewerken. Gebruik het volgende commando om het bestand te genereren:

php artisan make:view posts.edit

Dit maakt een edit.blade.php bestand in de map /resources/views/posts .

6. Voeg de volgende code toe aan het edit.blade.php bestand:

<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>

Bovenstaande code maakt een formulier met title en body velden en een verzendknop voor het bewerken van een post met de opgegeven id in de database via de {{ route('posts.update') }} actie met een PUT methode.

7. Start vervolgens je applicatieserver opnieuw op met de onderstaande code:

php artisan serve

Ga naar http://127.0.0.1:8000 in je browser om je nieuwe blog te bekijken. Klik op de knop Post toevoegen om nieuwe posts toe te voegen.

Je CRUD applicatie deployen en testen

Bereid je applicatie als volgt voor op de deployment.

1. Maak de deployment soepel en eenvoudig door de public map te declaren. Voeg een .htaccess bestand toe aan de root van de applicatiemap met de volgende code:

<IfModule mod_rewrite.c >
  RewriteEngine On
  RewriteRule ^(.*)$ public/$1 [L]
</IfModule >

2. Forceer je app om HTTPS te gebruiken door de volgende code toe te voegen boven je routes in het bestand routes/web.php:

use IlluminateSupportFacadesURL;
URL::forceScheme('https');

3. Zet je code op een Git repository. Kinsta ondersteunt deployments vanaf GitHub, GitLab of Bitbucket.

Een project instellen op MyKinsta

1. Maak een MyKinsta account aan als je er nog geen hebt.

2. Log in op je account en klik op de knop Dienst toevoegen op het dashboard om een nieuwe applicatie te maken.

3. Als de app nieuw voor je is, maak dan verbinding met je GitHub, GitLab of Bitbucket account en geef specifieke rechten.

4. Vul het formulier in en voeg de APP_KEY toe. Je kunt de bijbehorende waarde vinden in je .env bestand.

5. Selecteer je build resources en of je het build pad van je applicatie wilt gebruiken of je applicatie wilt bouwen met Dockerfile. Voor deze demonstratie laat je MyKinsta de app bouwen op basis van je repository.

6. Geef de verschillende processen op die je wilt uitvoeren tijdens de deployment. Je kunt het op dit punt leeg laten.

7. Voeg tot slot je betaalmethode toe.

Na het bevestigen van je betaalmethode, deployt MyKinsta je applicatie en wijst je een URL toe zoals hieronder getoond:

Je kunt de link bezoeken, maar je krijgt een 500 | Server Error pagina omdat de app een geldige databaseverbinding nodig heeft om te werken. De volgende sectie lost dit probleem op.

Een database maken via MyKinsta

1. Om een database aan te maken, ga je naar je MyKinsta dashboard en klik je op Dienst toevoegen.

2. Selecteer Database en vul het formulier in met je gewenste databasenaam, -type, gebruikersnaam en wachtwoord. Voeg een locatie voor een datacenter toe en een databasegrootte die past bij je toepassing.

3. Op de volgende pagina zie je het kostenoverzicht en je betaalmethode. Klik op Database aanmaken om het proces te voltooien.

4. Nadat je de database hebt gemaakt, verwijst MyKinsta je door naar je lijst met diensten. Klik op de database die je zojuist hebt gemaakt en scroll naar beneden naar Externe verbindingen. Kopieer de databasegegevens.

5. Ga terug naar de Deployment pagina van de applicatie en klik op Instellingen. Scroll vervolgens naar beneden naar Omgevingsvariabelen en klik op Omgevingsvariabelen toevoegen. Voeg de databasegegevens toe als omgevingsvariabelen in de volgende volgorde:

DB_CONNECTION=mysql
DB_HOST=External hostname
DB_PORT=External port
DB_DATABASE=Database name
DB_USERNAME=Username
DB_PASSWORD=Password

De lijst met omgevingsvariabelen voor de applicatie zou er nu zo uit moeten zien:

6. Ga naar de Deployments pagina van je applicatie en deploy je applicatie handmatig door op Deploy nu te klikken om deze wijzigingen toe te passen. Tot nu toe heb je een database gemaakt en verbonden met je applicatie.

7. Ten slotte, om de databasetabellen in je MyKinsta database te maken, verbind je de database met je lokale app door je .env bestand bij te werken met dezelfde referenties die je hebt ingevoerd in je app op MyKinsta en voer je het volgende commando uit:

php artisan migrate

Dit commando voert alle migratiebestanden uit. Het creëert alle gedefinieerde tabellen in je MyKinsta applicatie.

Nu kun je je applicatie testen met de URL die is toegewezen na de eerste deployment.

Samenvatting

Laravel is een uitgebreid framework voor het maken van robuuste en schaalbare webapplicaties die CRUD functionaliteit vereisen. Met zijn intuïtieve syntaxis en krachtige functies maakt Laravel het eenvoudig om CRUD bewerkingen in je applicatie in te bouwen.

Dit artikel behandelt de fundamentele concepten van CRUD-bewerkingen en hoe je ze kunt deployen met behulp van de ingebouwde functies van Laravel. Het legt ook uit:

• Hoe je een database aanmaakt in MyKinsta en deze verbindt met je applicatie
• Hoe je Laravel’s migraties gebruikt om de databasetabel te definiëren, het controllerbestand en zijn functies te maken
• Een model definiëren en koppelen aan de controller. De routing van Laravel genereert Blade bestanden om bijbehorende pagina’s en formulieren te maken en om de applicatie uit te rollen en te testen met MyKinsta

Nu je hebt gezien hoe eenvoudig het is om CRUD bewerkingen uit te voeren in Laravel, kun je MyKinsta bekijken voor de ontwikkeling en hosting van webapplicaties.