Contoh Tutorial Aplikasi CRUD Laravel 9

SHARE :

Halo,

Saya akan menunjukkan kepada Anda contoh contoh operasi laravel 9 crud. Saya jelaskan secara sederhana step by step build aplikasi laravel 9 crud. contoh ini akan membantu Anda aplikasi laravel 9 crud untuk pemula. Anda akan belajar cara membuat crud di laravel 9. Di sini, Membuat contoh dasar operasi crud di laravel 9.

Laravel 9 baru saja dirilis kemarin, Laravel 9 memberikan beberapa fitur baru dan dukungan LTS. Jadi jika Anda baru mengenal laravel maka tutorial ini akan membantu Anda membuat aplikasi insert update delete di laravel 9.

Dalam contoh ini, kita akan membuat aplikasi crud produk menggunakan laravel 9. kita akan membuat tabel produk dengan kolom nama dan detail menggunakan migrasi laravel 9, kemudian kita akan membuat file rute, pengontrol, tampilan, dan model untuk modul produk. kami akan menggunakan bootstrap 5 untuk desain sekarang. jadi mari ikuti langkah di bawah ini untuk membuat operasi kasar dengan laravel 9.

Install Laravel 9

Mari kita mulai tutorialnya dengan menginstall aplikasi laravel 9 yang baru. jika Anda sudah membuat proyek, lewati langkah berikut.

composer create-project laravel/laravel example-app

Database Configuration

Pada langkah kedua, kita akan membuat konfigurasi database, kita perlu menambahkan nama database, username dan password mysql. Jadi mari kita buka file .env dan isi semua detail seperti di bawah ini:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=here your database name(blog)
DB_USERNAME=here database username(root)
DB_PASSWORD=here database password(root)

Create Migration

Di sini, kita akan membuat tabel "products" menggunakan migrasi laravel. jadi mari gunakan perintah berikut untuk membuat file migrasi.

php artisan make:migration create_products_table --create=products

Setelah perintah ini, Anda akan menemukan satu file di jalur "database/migration" berikut dan Anda harus memasukkan kode di bawah ini ke dalam file migrasi Anda untuk membuat tabel produk.

<?php
  
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
  
return new class extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('products', function (Blueprint $table) {
            $table->id();
            $table->string('name');
            $table->text('detail');
            $table->timestamps();
        });
    }
  
    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('products');
    }
};

Sekarang Anda harus menjalankan migrasi ini dengan perintah berikut:

php artisan migrate

Create Controller and Model

Pada langkah ini, sekarang kita harus membuat resource controller baru sebagai ProductController. Jadi jalankan perintah di bawah dan buat pengontrol baru. di bawah pengontrol untuk membuat resources controller.

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

Setelah perintah di bawah, Anda akan menemukan file baru di jalur ini "app/Http/Controllers/ProductController.php".

Dalam pengontrol ini akan membuat tujuh metode secara default sebagai metode di bawah ini:

  1. index()
  2. create()
  3. store()
  4. show()
  5. edit()
  6. update()
  7. destroy()

Jadi, mari salin kode di bawah ini dan letakkan di file ProductController.php.

<?php
  
namespace App\Http\Controllers;
  
use App\Models\Product;
use Illuminate\Http\Request;
  
class ProductController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        $products = Product::latest()->paginate(5);
      
        return view('products.index',compact('products'))
            ->with('i', (request()->input('page', 1) - 1) * 5);
    }
  
    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        return view('products.create');
    }
  
    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    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.');
    }
  
    /**
     * Display the specified resource.
     *
     * @param  \App\Models\Product  $product
     * @return \Illuminate\Http\Response
     */
    public function show(Product $product)
    {
        return view('products.show',compact('product'));
    }
  
    /**
     * Show the form for editing the specified resource.
     *
     * @param  \App\Models\Product  $product
     * @return \Illuminate\Http\Response
     */
    public function edit(Product $product)
    {
        return view('products.edit',compact('product'));
    }
  
    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \App\Models\Product  $product
     * @return \Illuminate\Http\Response
     */
    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');
    }
    /**
     * Remove the specified resource from storage.
     *
     * @param  \App\Models\Product  $product
     * @return \Illuminate\Http\Response
     */
    public function destroy(Product $product)
    {
        $product->delete();
       
        return redirect()->route('products.index')
                        ->with('success','Product deleted successfully');
    }
}

Oke, jadi setelah menjalankan perintah di bawah ini Anda akan menemukan "app/Models/Product.php" dan meletakkan konten di bawah ini di file Product.php:

<?php
  
namespace App\Models;
  
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
  
class Product extends Model
{
    use HasFactory;
  
    protected $fillable = [
        'name', 'detail'
    ];
}

Add Resource Route

Di sini, kita perlu menambahkan resource route untuk aplikasi product crud. jadi buka file "route/web.php" Anda dan tambahkan rute berikut.

<?php
  
use Illuminate\Support\Facades\Route;
  
use App\Http\Controllers\ProductController;
  
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group that
| contains the "web" middleware group. Now create something great!
|
*/
  
Route::resource('products', ProductController::class);

Add Blade Files

Pada langkah terakhir. Pada langkah ini kita harus membuat file blade saja. Jadi terutama kita harus membuat file tata letak dan kemudian membuat folder "products" baru kemudian membuat file blade dari aplikasi kasar. Jadi akhirnya Anda harus membuat file blade di bawah ini:

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

Jadi mari kita buat file berikut dan masukkan kode di bawah ini.

layout.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>Laravel 9 CRUD Application - ookinfo.com</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    
<div class="container">
    @yield('content')
</div>
    
</body>
</html>

index.blade.php

@extends('products.layout')
 
@section('content')
    <div class="row">
        <div class="col-lg-12 margin-tb">
            <div class="pull-left">
                <h2>Laravel 9 CRUD Example from scratch - ookinfo.com</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

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>Whoops!</strong> There were some problems with your input.<br><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

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>Whoops!</strong> There were some problems with your input.<br><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

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

Run Laravel App

Semua langkah yang diperlukan telah dilakukan, sekarang Anda harus mengetikkan perintah di bawah ini dan tekan enter untuk menjalankan aplikasi Laravel:

php artisan serve

Sekarang, Buka browser web Anda, ketik URL yang diberikan dan lihat keluaran aplikasi:

http://localhost:8000/products

OOKINFO

Jasa pembuatan Aplikasi Mobile dan Web. Siap memberikan solusi digital untuk bisnis anda. Tugas Kuliah, Organisasi, Perusahaan, E-Commerce.