cara membuat crud di laravel 10

Cara Membuat CRUD di Laravel 10

2 Comments / Laravel / By

Pada artikel ini, kita akan membuat operasi crud laravel 10 langkah demi langkah. Seperti yang kita ketahui Laravel 10 telah resmi dirilis dengan banyak fungsi baru. Pada laravel 10 menyediakan paket Laravel Pennant baru, aturan validasi yang dapat dipanggil, deklarasi tipe native, dan masih banyak lagi.

Pada versi laravel 10 membutuhkan versi PHP minimal 8.1.

Pada operasi crud laravel 10 ini, kita akan melihat create, read, update, dan delete dengan aturan validasi. Selain itu, kita juga akan membuat migrasi untuk operasi crud laravel 10.

Langkah 1: Instal Laravel 10 Untuk Operasi CRUD

Pada langkah ini, kita akan menginstal laravel untuk operasi CRUD. Jadi, jalankan perintah berikut ini di terminal.

composer create-project --prefer-dist laravel/laravel laravel_10_crud

Langkah 2: Menyiapkan Konfigurasi Database

Sekarang, kita akan mengatur konfigurasi database seperti nama database, username, password, dll.

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel_10_crud
DB_USERNAME=root
DB_PASSWORD=

Langkah 3: Buat Migrasi

Di sini, kita akan membuat migrasi untuk tabel “products” menggunakan perintah laravel 10 php artisan.

php artisan make:migration create_products_table --create=products

Setelah itu, buka file migration yang barusan dibuat dan tambahkan code seperti berikut.

Schema::create('products', function (Blueprint $table) { 
       $table->bigIncrements('id');
       $table->string('name')->nullable();
       $table->longText('detail')->nullable();
       $table->timestamps();
  });
}

Sekarang, jalankan migrasi seperti di bawah ini.

php artisan migrate

Langkah 4: Tambah Resource Route

Sekarang, kita akan menambahkan resource route di file routes/web.php.

use App\Http\Controllers\ProductController;

...

Route::resource('products', ProductController::class);

Baca Juga

Cara Membuat Test-Driven Development Di Laravel

Langkah 5: Tambah Controller dan Model

Sekarang, kita akan membuat ProductController dengan menggunakan perintah berikut.

php artisan make:controller ProductController --resource --model=Product

Sekarang, kita akan membuat perubahan pada Model Product di file App/Models/Product.php. tambahkan nama kolom ke model.

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Product extends Model
{
    use HasFactory;

    protected $fillable = [
        'id', 'name', 'detail'
    ];
}

Setelah perubahan pada model, kita perlu menambahkan code pada file app/Http/Controllers/ProductController.php

<?php

namespace App\Http\Controllers;

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

class ProductController extends Controller
{
    public function index()
    {
        $products = Product::latest()->paginate(5);
        return view('products.index',compact('products'))->with('i', (request()->input('page', 1) - 1) * 5);
    }

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

    public function store(Request $request)
    {
        $request->validate([
            'name' => 'required',
            'detail' => 'required',
        ]);
  
        Product::create($request->all());
   
        return redirect()->route('products.index')->with('success','Product created successfully.');
    }

    public function show(Product $product)
    {
        return view('products.show',compact('product'));
    }

    public function edit(Product $product)
    {
        return view('products.edit',compact('product'));
    }

    public function update(Request $request, Product $product)
    {
        $request->validate([
            'name' => 'required',
            'detail' => 'required',
        ]);
  
        $product->update($request->all());
  
        return redirect()->route('products.index')->with('success','Product updated successfully');
    }

    public function destroy(Product $product)
    {
        $product->delete();
  
        return redirect()->route('products.index')->with('success','Product deleted successfully');
    }
}

Langkah 6: Tambah File Blade

Sekarang, kita akan membuat file blade untuk tata letak. Jadi, buatlah folder baru “products” dan kemudian buatlah file blade dari contoh CRUD di laravel.

  1. layout.blade.php
  2. index.blade.php
  3. create.blade.php
  4. edit.blade.php
  5. show.blade.php

resources/views/products/layout.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>How To Create CRUD Operation In Laravel 10 - Leravio</title>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.css" rel="stylesheet">
</head>
<body>
  
<div class="container" style="margin-top: 15px;">
    @yield('content')
</div>
   
</body>
</html>

resources/views/products/index.blade.php

@extends('products.layout')
 
@section('content')
    <div class="row">
        <div class="col-lg-12 margin-tb">
            <div class="pull-left">
                <h2>How To Create CRUD Operation In Laravel 10 - Leravio</h2>
            </div>
            <div class="pull-right">
                <a class="btn btn-success" href="{{ route('products.create') }}"> Create New Product</a>
            </div>
        </div>
    </div>
   
    @if ($message = Session::get('success'))
        <div class="alert alert-success">
            <p>{{ $message }}</p>
        </div>
    @endif
   
    <table class="table table-bordered">
        <tr>
            <th>No</th>
            <th>Name</th>
            <th>Details</th>
            <th width="280px">Action</th>
        </tr>
        @foreach ($products as $product)
        <tr>
            <td>{{ ++$i }}</td>
            <td>{{ $product->name }}</td>
            <td>{{ $product->detail }}</td>
            <td>
                <form action="{{ route('products.destroy',$product->id) }}" method="POST">
   
                    <a class="btn btn-info" href="{{ route('products.show',$product->id) }}">Show</a>
    
                    <a class="btn btn-primary" href="{{ route('products.edit',$product->id) }}">Edit</a>
   
                    @csrf
                    @method('DELETE')
      
                    <button type="submit" class="btn btn-danger">Delete</button>
                </form>
            </td>
        </tr>
        @endforeach
    </table>
  
    {!! $products->links() !!}
      
@endsection

resources/views/products/create.blade.php

@extends('products.layout')
  
@section('content')
<div class="row">
    <div class="col-lg-12 margin-tb">
        <div class="pull-left">
            <h2>Add New Product</h2>
        </div>
        <div class="pull-right">
            <a class="btn btn-primary" href="{{ route('products.index') }}"> Back</a>
        </div>
    </div>
</div>
   
@if ($errors->any())
    <div class="alert alert-danger">
        <strong>Error!</strong> <br>
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif
   
<form action="{{ route('products.store') }}" method="POST">
    @csrf
  
     <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Name:</strong>
                <input type="text" name="name" class="form-control" placeholder="Name">
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Detail:</strong>
                <textarea class="form-control" style="height:150px" name="detail" placeholder="Detail"></textarea>
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12 text-center">
                <button type="submit" class="btn btn-primary">Submit</button>
        </div>
    </div>
   
</form>
@endsection

resources/views/products/edit.blade.php

@extends('products.layout')
   
@section('content')
    <div class="row">
        <div class="col-lg-12 margin-tb">
            <div class="pull-left">
                <h2>Edit Product</h2>
            </div>
            <div class="pull-right">
                <a class="btn btn-primary" href="{{ route('products.index') }}"> Back</a>
            </div>
        </div>
    </div>
   
    @if ($errors->any())
        <div class="alert alert-danger">
            <strong>Error!</strong> <br>
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
  
    <form action="{{ route('products.update',$product->id) }}" method="POST">
        @csrf
        @method('PUT')
   
         <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12">
                <div class="form-group">
                    <strong>Name:</strong>
                    <input type="text" name="name" value="{{ $product->name }}" class="form-control" placeholder="Name">
                </div>
            </div>
            <div class="col-xs-12 col-sm-12 col-md-12">
                <div class="form-group">
                    <strong>Detail:</strong>
                    <textarea class="form-control" style="height:150px" name="detail" placeholder="Detail">{{ $product->detail }}</textarea>
                </div>
            </div>
            <div class="col-xs-12 col-sm-12 col-md-12 text-center">
              <button type="submit" class="btn btn-primary">Submit</button>
            </div>
        </div>
   
    </form>
@endsection

resources/views/products/show.blade.php

@extends('products.layout')
@section('content')
    <div class="row">
        <div class="col-lg-12 margin-tb">
            <div class="pull-left">
                <h2> Show Product</h2>
            </div>
            <div class="pull-right">
                <a class="btn btn-primary" href="{{ route('products.index') }}"> Back</a>
            </div>
        </div>
    </div>
   
    <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Name:</strong>
                {{ $product->name }}
            </div>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="form-group">
                <strong>Details:</strong>
                {{ $product->detail }}
            </div>
        </div>
    </div>
@endsection

Langkah 7: Jalankan Laravel 10

Sekarang, jalankan perintah berikut dan mulai server.

php artisan serve

Kesimpulan

Dalam tutorial ini, Anda telah mempelajari langkah-langkah membuat CRUD di Laravel 10. Dengan mengikuti panduan ini, Anda dapat mengimplementasikan operasi dasar seperti membuat, membaca, memperbarui, dan menghapus data dalam proyek Laravel Anda.

Selanjutnya, Anda dapat memperluas fungsionalitas sesuai dengan kebutuhan Anda. Selamat mencoba!

2 thoughts on “Cara Membuat CRUD di Laravel 10”

    1. admin

      Jika terdapat pesan kesalahan “Route [products.create] not defined” saat mengakses URL /products/create, itu menandakan bahwa route tersebut belum didefinisikan dengan benar. Coba cek kembali file routes/web.php. Pastikan untuk menggunakan nama route yang sesuai seperti ‘products.create’ di bagian views.

      Reply

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top