Tutorial CRUD Laravel 11, MySQL 8, Breeze Bikin Projek Website Jual Beli Mobil

Pada kesempatan kali ini, kita akan belajar membuat sebuah website jual beli mobil menggunakan Laravel 11, MySQL 8, dan Laravel Breeze. Proyek ini akan disertai dengan beberapa fitur utama seperti CRUD (Create, Read, Update, Delete) untuk mengelola data mobil, transaksi, dan pelanggan.

Fitur CRUD sangat penting dalam sebuah website, terutama untuk mengelola data-data yang dinamis seperti produk yang dijual, pelanggan, serta transaksi yang terjadi. Mari kita bahas langkah-langkahnya secara lengkap.

Pentingnya Fitur CRUD

CRUD merupakan fitur dasar yang harus ada dalam hampir setiap website dinamis. Dengan fitur CRUD, pengguna website dapat:

  • Create: Menambahkan data baru, seperti menambahkan mobil yang akan dijual.
  • Read: Menampilkan data yang ada, misalnya melihat daftar mobil yang dijual.
  • Update: Mengubah data, seperti mengedit informasi mobil atau transaksi.
  • Delete: Menghapus data yang tidak diperlukan lagi, misalnya menghapus mobil yang sudah terjual.

Tanpa fitur CRUD, website tidak akan bisa mengelola data dengan baik, dan pengguna akan kesulitan berinteraksi dengan sistem. Inilah alasan mengapa kita perlu membangun CRUD untuk website jual beli mobil ini.

Langkah Awal: Install PHP, MySQL, XAMPP, Composer

Sebelum kita mulai, pastikan Anda sudah menginstall beberapa software penting, yaitu PHP, MySQL, XAMPP, dan Composer. Software ini diperlukan untuk menjalankan Laravel dan membuat koneksi ke database. Berikut langkah-langkah instalasi:

  1. Download PHP: Kunjungi situs resmi PHP di php.net dan download versi PHP terbaru. Ikuti instruksi instalasi sesuai sistem operasi Anda.
  2. Download MySQL: Untuk database, Anda bisa mendownload MySQL dari mysql.com. Pilih versi MySQL 8 dan ikuti instruksi instalasinya.
  3. Download XAMPP: XAMPP memudahkan kita dalam menjalankan server lokal. Download XAMPP dari apachefriends.org dan pastikan MySQL dan Apache sudah berjalan setelah instalasi.
  4. Install Composer: Composer adalah dependency manager untuk PHP yang digunakan untuk menginstall Laravel. Download Composer dari getcomposer.org. Setelah instalasi, pastikan Composer dapat dijalankan melalui terminal dengan mengetikkan perintah composer di command line.

Setelah semua software terinstall, kita siap untuk memulai proyek Laravel.

1. Membuat Projek Laravel 11 dengan Composer

Langkah pertama adalah membuat projek Laravel terbaru. Buka terminal atau command prompt, lalu jalankan perintah berikut:

composer create-project laravel/laravel jual-beli-mobil

Perintah ini akan membuat folder proyek baru bernama jual-beli-mobil dengan versi Laravel terbaru, yaitu Laravel 11.

2. Mengatur Database Connection

Setelah proyek berhasil dibuat, kita perlu menghubungkan Laravel dengan MySQL. Buka file .env di folder proyek Anda dan sesuaikan pengaturan database sesuai dengan konfigurasi MySQL Anda. Contoh:

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

Pastikan MySQL sudah berjalan melalui XAMPP, dan database jualbelimobil telah dibuat di phpMyAdmin.

3. Membuat Migration dan Model

Selanjutnya, kita akan membuat tabel dan model untuk products, categories, customers, dan transactions. Jalankan perintah berikut untuk membuat migration dan model sekaligus:

php artisan make:model Product -m
php artisan make:model Category -m
php artisan make:model Customer -m
php artisan make:model Transaction -m

Setiap perintah di atas akan membuat file migration dan model yang akan kita gunakan untuk mengatur struktur tabel dan hubungan antar data.

4. Mengatur Fields pada Schema Migration Secara Detail

Setelah kita membuat file migration dan model untuk masing-masing tabel seperti products, categories, customers, dan transactions, langkah berikutnya adalah mengatur struktur tabel (schema) di dalam file migration tersebut. Setiap file migration ini terletak di dalam folder database/migrations.

Mari kita lihat bagaimana kita bisa mengatur schema untuk setiap tabel dengan lengkap dan detail:

Tabel Products

Buka file migration untuk tabel products yang biasanya memiliki nama seperti create_products_table.php. Di dalam file ini, kita bisa mengatur kolom-kolom yang dibutuhkan untuk menyimpan informasi produk mobil, seperti nama, deskripsi, harga, dan kategori produk.

Contoh lengkap untuk schema tabel products:

Schema::create('products', function (Blueprint $table) {
    $table->id(); // Kolom ID unik untuk setiap produk
    $table->string('name'); // Nama produk, tipe data string
    $table->text('description'); // Deskripsi produk, tipe data text
    $table->decimal('price', 10, 2); // Harga produk, tipe data decimal dengan 10 digit total dan 2 digit setelah koma
    $table->unsignedBigInteger('category_id'); // ID dari kategori produk, tipe data unsignedBigInteger
    $table->timestamps(); // Kolom untuk mencatat waktu pembuatan dan perubahan data

    // Relasi antara produk dan kategori (Foreign Key)
    $table->foreign('category_id')->references('id')->on('categories')->onDelete('cascade');
});

Penjelasan:

  • $table->id(): Menambahkan kolom ID utama (primary key) dengan tipe big integer secara otomatis.
  • $table->string('name'): Menambahkan kolom name untuk menyimpan nama produk dengan tipe data string.
  • $table->text('description'): Menambahkan kolom description untuk menyimpan deskripsi produk dengan tipe text.
  • $table->decimal('price', 10, 2): Menambahkan kolom price dengan tipe decimal untuk menyimpan harga produk. Kolom ini memiliki 10 digit angka total dan 2 digit angka desimal.
  • $table->unsignedBigInteger('category_id'): Kolom category_id digunakan untuk menyimpan ID dari tabel categories sebagai foreign key.
  • $table->timestamps(): Laravel secara otomatis akan membuat kolom created_at dan updated_at.
  • $table->foreign('category_id'): Mendefinisikan relasi foreign key antara tabel products dan categories. Ketika kategori dihapus, produk terkait akan ikut dihapus karena menggunakan onDelete('cascade').

Tabel Categories

Buka file migration untuk tabel categories. Di dalam file ini, kita akan mengatur struktur tabel yang menyimpan data kategori dari produk yang dijual.

Contoh lengkap untuk schema tabel categories:

Schema::create('categories', function (Blueprint $table) {
    $table->id(); // Kolom ID unik untuk setiap kategori
    $table->string('name'); // Nama kategori, tipe data string
    $table->text('description')->nullable(); // Deskripsi kategori, opsional, tipe data text
    $table->timestamps(); // Kolom untuk mencatat waktu pembuatan dan perubahan data
});

Penjelasan:

  • $table->id(): Menambahkan kolom ID utama untuk setiap kategori.
  • $table->string('name'): Kolom name digunakan untuk menyimpan nama kategori.
  • $table->text('description')->nullable(): Kolom description bersifat opsional (nullable), digunakan untuk menyimpan deskripsi kategori.
  • $table->timestamps(): Menambahkan kolom created_at dan updated_at untuk menyimpan waktu pembuatan dan update kategori.

Tabel Customers

Selanjutnya, kita akan mengatur file migration untuk tabel customers yang menyimpan data pelanggan.

Contoh lengkap untuk schema tabel customers:

Schema::create('customers', function (Blueprint $table) {
    $table->id(); // Kolom ID unik untuk setiap customer
    $table->string('name'); // Nama customer, tipe data string
    $table->string('email')->unique(); // Email customer, tipe data string, harus unik
    $table->string('phone'); // Nomor telepon customer, tipe data string
    $table->text('address'); // Alamat customer, tipe data text
    $table->timestamps(); // Kolom untuk mencatat waktu pembuatan dan perubahan data
});

Penjelasan:

  • $table->id(): Menambahkan kolom ID utama untuk setiap customer.
  • $table->string('name'): Kolom name digunakan untuk menyimpan nama pelanggan.
  • $table->string('email')->unique(): Kolom email digunakan untuk menyimpan email pelanggan dan harus unik.
  • $table->string('phone'): Kolom phone digunakan untuk menyimpan nomor telepon pelanggan.
  • $table->text('address'): Kolom address digunakan untuk menyimpan alamat pelanggan.
  • $table->timestamps(): Menambahkan kolom created_at dan updated_at.

Tabel Transactions

Terakhir, kita akan membuat schema untuk tabel transactions yang menyimpan informasi transaksi jual beli mobil.

Contoh lengkap untuk schema tabel transactions:

Schema::create('transactions', function (Blueprint $table) {
    $table->id(); // Kolom ID unik untuk setiap transaksi
    $table->unsignedBigInteger('customer_id'); // ID dari customer yang melakukan transaksi
    $table->unsignedBigInteger('product_id'); // ID dari produk yang dibeli
    $table->decimal('total_price', 10, 2); // Total harga transaksi, tipe data decimal
    $table->date('transaction_date'); // Tanggal transaksi, tipe data date
    $table->timestamps(); // Kolom untuk mencatat waktu pembuatan dan perubahan data

    // Relasi ke tabel customers dan products
    $table->foreign('customer_id')->references('id')->on('customers')->onDelete('cascade');
    $table->foreign('product_id')->references('id')->on('products')->onDelete('cascade');
});

Penjelasan:

  • $table->id(): Menambahkan kolom ID unik untuk setiap transaksi.
  • $table->unsignedBigInteger('customer_id'): Kolom untuk menyimpan ID pelanggan dari tabel customers.
  • $table->unsignedBigInteger('product_id'): Kolom untuk menyimpan ID produk dari tabel products.
  • $table->decimal('total_price', 10, 2): Kolom total_price digunakan untuk menyimpan total harga transaksi.
  • $table->date('transaction_date'): Kolom transaction_date digunakan untuk menyimpan tanggal transaksi.
  • $table->timestamps(): Menambahkan kolom created_at dan updated_at.
  • $table->foreign('customer_id'): Relasi ke tabel customers dengan menggunakan foreign key.
  • $table->foreign('product_id'): Relasi ke tabel products dengan menggunakan foreign key.

5. Mengatur Mass Assignment dan Relationship dengan Detail pada Seluruh File Model

Setelah kita selesai membuat tabel dengan schema yang tepat di dalam file migration, langkah selanjutnya adalah mengatur mass assignment dan relationship di setiap model. Bagian ini sangat penting untuk memastikan data dapat dimasukkan secara aman ke dalam tabel melalui Laravel ORM (Eloquent), dan hubungan antar tabel dikelola dengan benar.

Berikut adalah langkah-langkah pengaturan mass assignment dan relationship untuk setiap model yang telah kita buat, yaitu Product, Category, Customer, dan Transaction.

Mass Assignment

Mass assignment dalam Laravel memungkinkan kita mengisi kolom-kolom tertentu secara massal dalam satu waktu menggunakan array. Namun, ini bisa menjadi celah keamanan jika kita tidak hati-hati dalam menentukan kolom mana saja yang boleh diisi secara massal. Untuk mencegah mass assignment vulnerability, kita menggunakan properti $fillable dalam model.

Berikut adalah pengaturan mass assignment untuk setiap model.

Model Product

Buka file model Product yang terletak di folder app/Models/Product.php. Pada model ini, kita akan menambahkan properti $fillable untuk menentukan kolom-kolom yang boleh diisi secara massal, yaitu name, description, price, dan category_id.

namespace App\\\\Models;

use Illuminate\\\\Database\\\\Eloquent\\\\Model;

class Product extends Model
{
    // Kolom yang boleh diisi secara massal
    protected $fillable = ['name', 'description', 'price', 'category_id'];

    // Relasi ke tabel categories
    public function category()
    {
        return $this->belongsTo(Category::class);
    }

    // Relasi ke tabel transactions
    public function transactions()
    {
        return $this->hasMany(Transaction::class);
    }
}

Penjelasan:

  • $fillable: Kolom-kolom ini dapat diisi ketika kita menggunakan metode seperti create() atau update() dengan array data.
  • category(): Relasi belongsTo menghubungkan produk dengan kategori. Satu produk hanya memiliki satu kategori.
  • transactions(): Relasi hasMany menghubungkan produk dengan banyak transaksi. Satu produk bisa dijual di beberapa transaksi.

Model Category

Selanjutnya, buka file model Category yang terletak di app/Models/Category.php. Model ini juga perlu diatur dengan $fillable dan relasi ke model Product.

namespace App\\\\Models;

use Illuminate\\\\Database\\\\Eloquent\\\\Model;

class Category extends Model
{
    // Kolom yang boleh diisi secara massal
    protected $fillable = ['name', 'description'];

    // Relasi ke tabel products
    public function products()
    {
        return $this->hasMany(Product::class);
    }
}

Penjelasan:

  • $fillable: Kolom-kolom yang boleh diisi adalah name dan description.
  • products(): Relasi hasMany menunjukkan bahwa satu kategori bisa memiliki banyak produk.

Model Customer

Buka file model Customer yang terletak di app/Models/Customer.php. Pada model ini, kita akan mengatur $fillable untuk kolom name, email, phone, dan address, serta menghubungkan customer dengan transaksi melalui relasi hasMany.

namespace App\\\\Models;

use Illuminate\\\\Database\\\\Eloquent\\\\Model;

class Customer extends Model
{
    // Kolom yang boleh diisi secara massal
    protected $fillable = ['name', 'email', 'phone', 'address'];

    // Relasi ke tabel transactions
    public function transactions()
    {
        return $this->hasMany(Transaction::class);
    }
}

Penjelasan:

  • $fillable: Kolom-kolom yang dapat diisi adalah name, email, phone, dan address.
  • transactions(): Relasi hasMany menunjukkan bahwa satu customer bisa melakukan banyak transaksi.

Model Transaction

Terakhir, buka file model Transaction yang terletak di app/Models/Transaction.php. Model ini akan dihubungkan dengan Customer dan Product menggunakan belongsTo, dan kita juga akan mengatur $fillable untuk kolom customer_id, product_id, total_price, dan transaction_date.

namespace App\\\\Models;

use Illuminate\\\\Database\\\\Eloquent\\\\Model;

class Transaction extends Model
{
    // Kolom yang boleh diisi secara massal
    protected $fillable = ['customer_id', 'product_id', 'total_price', 'transaction_date'];

    // Relasi ke tabel customers
    public function customer()
    {
        return $this->belongsTo(Customer::class);
    }

    // Relasi ke tabel products
    public function product()
    {
        return $this->belongsTo(Product::class);
    }
}

Penjelasan:

  • $fillable: Kolom-kolom yang dapat diisi secara massal adalah customer_id, product_id, total_price, dan transaction_date.
  • customer(): Relasi belongsTo menghubungkan transaksi dengan pelanggan yang melakukan transaksi. Satu transaksi hanya dilakukan oleh satu pelanggan.
  • product(): Relasi belongsTo menghubungkan transaksi dengan produk yang dibeli. Satu transaksi hanya mencakup satu produk.

6. Menginstall Laravel Breeze Secara Detail

Pada tahap ini, kita akan membuat fitur login untuk admin website jual beli mobil menggunakan Laravel Breeze. Laravel Breeze adalah starter kit yang menyediakan implementasi autentikasi sederhana dengan login, registrasi, verifikasi email, reset password, dan logout. Selain itu, Laravel Breeze sudah terintegrasi dengan Blade dan Tailwind CSS sehingga memudahkan kita dalam membangun UI untuk fitur autentikasi.

Berikut adalah langkah-langkah detail untuk menginstall dan mengkonfigurasi Laravel Breeze pada proyek Laravel 11 kita.

Langkah 1: Install Laravel Breeze

Pertama, kita perlu menambahkan Laravel Breeze ke dalam proyek Laravel menggunakan Composer. Composer akan mengelola dependensi dan menginstall Laravel Breeze secara otomatis.

Buka terminal atau command prompt di direktori proyek Laravel Anda.

Jalankan perintah berikut untuk menginstall Laravel Breeze:

composer require laravel/breeze --dev

Perintah ini akan mengunduh dan menginstall Laravel Breeze ke dalam proyek. Opsi --dev menandakan bahwa Breeze hanya diinstall di environment pengembangan (development), dan tidak dibutuhkan di environment produksi (production).

Langkah 2: Menginstall Breeze

Setelah Laravel Breeze berhasil diinstall, langkah berikutnya adalah menjalankan perintah untuk meng-setup Breeze dalam proyek Laravel kita. Perintah ini akan mengatur file-file terkait autentikasi seperti login, registrasi, dan lainnya.

Jalankan perintah berikut di terminal:

php artisan breeze:install

Perintah ini akan menghasilkan beberapa file dan folder baru, antara lain:

  • File Blade untuk halaman login, registrasi, dan dashboard yang terletak di folder resources/views/auth dan resources/views/dashboard.blade.php.
  • Controller untuk menangani proses autentikasi di folder app/Http/Controllers/Auth.
  • Routes yang terletak di routes/web.php sudah otomatis terisi dengan rute-rute untuk login, registrasi, dan dashboard.

Breeze menyediakan implementasi autentikasi dasar yang siap digunakan dan sudah terintegrasi dengan Tailwind CSS sebagai framework CSS-nya.

Langkah 3: Menginstall Dependency Frontend

Setelah menjalankan instalasi Laravel Breeze, langkah berikutnya adalah menginstall dependency frontend untuk memastikan Tailwind CSS dan semua asset frontend lainnya berfungsi dengan baik. Jalankan perintah berikut:

npm install

Perintah ini akan mengunduh dan menginstall semua package frontend yang diperlukan oleh Laravel Breeze. Proses ini menggunakan npm (Node Package Manager) untuk mengelola package JavaScript dan CSS yang dibutuhkan oleh proyek.

Setelah semua dependency terinstall, Anda harus melakukan build asset frontend agar semua file CSS dan JavaScript siap digunakan. Jalankan perintah berikut:

npm run dev

Perintah ini akan melakukan compile terhadap semua file CSS dan JavaScript, kemudian meletakkannya di folder public agar bisa diakses oleh browser.

Langkah 4: Menjalankan Migrasi Database

Laravel Breeze juga menyediakan tabel user untuk menyimpan data pengguna seperti admin, pelanggan, atau siapa pun yang akan menggunakan sistem autentikasi. Sebelum kita bisa menggunakan fitur login dan registrasi, kita harus membuat tabel pengguna ini di dalam database.

Untuk itu, jalankan perintah migrasi berikut:

php artisan migrate

Perintah ini akan membuat beberapa tabel di dalam database, antara lain:

  • users: Tabel ini menyimpan informasi dasar tentang pengguna seperti nama, email, password, dan timestamps.
  • password_resets: Tabel ini digunakan untuk menyimpan token yang diperlukan saat pengguna ingin mereset password mereka.
  • failed_jobs dan personal_access_tokens: Tabel ini dibutuhkan untuk manajemen job dan token akses pribadi.

Setelah perintah ini dijalankan, tabel-tabel tersebut akan dibuat di dalam database yang sudah kita hubungkan sebelumnya di file .env.

Langkah 5: Konfigurasi Authentication (Opsional)

Jika diperlukan, Anda dapat mengkonfigurasi berbagai aspek autentikasi yang digunakan oleh Laravel Breeze, seperti redirect setelah login, halaman dashboard, atau middleware yang digunakan untuk memproteksi rute-rute tertentu.

Konfigurasi autentikasi terletak di file config/auth.php. Di sini, Anda bisa mengubah pengaturan seperti guard yang digunakan atau provider untuk autentikasi pengguna.

Contoh: Jika Anda ingin mengubah halaman dashboard setelah login, Anda dapat menyesuaikan route di HomeController atau langsung di dalam web.php seperti berikut:

Route::get('/dashboard', function () {
    return view('dashboard');
})->middleware(['auth'])->name('dashboard');

Langkah 6: Menguji Fitur Login dan Registrasi

Sekarang kita sudah berhasil menginstall dan mengkonfigurasi Laravel Breeze beserta dependensi frontend-nya. Untuk menguji apakah fitur login dan registrasi berfungsi dengan baik, jalankan server Laravel dengan perintah:

php artisan serve

Akses aplikasi melalui browser di alamat http://127.0.0.1:8000, dan Anda akan melihat halaman utama dari Laravel. Untuk mengakses halaman login atau registrasi, buka URL berikut:

  • Login: http://127.0.0.1:8000/login
  • Registrasi: http://127.0.0.1:8000/register

Coba daftarkan akun baru melalui halaman registrasi, kemudian login dengan akun tersebut. Setelah berhasil login, Anda akan diarahkan ke halaman dashboard yang sudah disediakan oleh Breeze.

7. Membuat File Blade untuk Menambahkan dan Menampilkan Data

Setelah kita membuat tabel dan model, serta mengatur mass assignment dan relationship, langkah berikutnya adalah membuat file Blade di folder resources/views. File Blade ini akan digunakan untuk menampilkan antarmuka halaman admin, di mana admin bisa menambahkan, mengedit, melihat, dan menghapus data produk.

Kita akan membuat beberapa file Blade yang akan digunakan untuk:

  1. Menampilkan formulir untuk menambahkan produk baru (Create).
  2. Menampilkan daftar produk yang sudah ditambahkan (Read).
  3. Mengedit produk yang sudah ada (Update).
  4. Menghapus produk (Delete).

Berikut ini adalah detail dan koding untuk setiap file Blade yang diperlukan.

1. Membuat Formulir Menambahkan Produk Baru (Create)

Buat file baru bernama create.blade.php di dalam folder resources/views/products/. File ini akan menampilkan formulir yang digunakan untuk menambahkan produk baru ke dalam database.

Kode lengkap untuk file create.blade.php:

@extends('layouts.app')

@section('content')
<div class="container">
    <h1>Tambah Produk Baru</h1>

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

    <!-- Form untuk menambahkan produk baru -->
    <form method="POST" action="{{ route('products.store') }}">
        @csrf
        <div class="mb-3">
            <label for="name" class="form-label">Nama Produk</label>
            <input type="text" class="form-control" id="name" name="name" value="{{ old('name') }}" required>
        </div>

        <div class="mb-3">
            <label for="description" class="form-label">Deskripsi Produk</label>
            <textarea class="form-control" id="description" name="description" required>{{ old('description') }}</textarea>
        </div>

        <div class="mb-3">
            <label for="price" class="form-label">Harga Produk</label>
            <input type="number" class="form-control" id="price" name="price" value="{{ old('price') }}" step="0.01" required>
        </div>

        <div class="mb-3">
            <label for="category_id" class="form-label">Kategori Produk</label>
            <select class="form-control" id="category_id" name="category_id" required>
                <option value="">-- Pilih Kategori --</option>
                @foreach($categories as $category)
                    <option value="{{ $category->id }}" {{ old('category_id') == $category->id ? 'selected' : '' }}>
                        {{ $category->name }}
                    </option>
                @endforeach
            </select>
        </div>

        <button type="submit" class="btn btn-primary">Simpan</button>
    </form>
</div>
@endsection

Penjelasan:

  • @extends('layouts.app'): Menandakan bahwa file Blade ini menggunakan layout utama yang terletak di layouts/app.blade.php.
  • @csrf: Token CSRF (Cross-Site Request Forgery) untuk mencegah serangan keamanan.
  • old('field_name'): Mengambil input yang sebelumnya diisi jika terjadi validasi error.
  • $errors: Menampilkan error jika ada masalah validasi.

2. Menampilkan Daftar Produk (Read)

Selanjutnya, kita perlu membuat halaman untuk menampilkan daftar produk yang sudah ada. Buat file baru bernama index.blade.php di dalam folder resources/views/products/.

Kode lengkap untuk file index.blade.php:

@extends('layouts.app')

@section('content')
<div class="container">
    <h1>Daftar Produk</h1>

    <!-- Tombol untuk menambahkan produk baru -->
    <a href="{{ route('products.create') }}" class="btn btn-success mb-3">Tambah Produk Baru</a>

    <!-- Menampilkan pesan sukses jika ada -->
    @if(session('success'))
        <div class="alert alert-success">
            {{ session('success') }}
        </div>
    @endif

    <!-- Menampilkan tabel daftar produk -->
    <table class="table table-bordered">
        <thead>
            <tr>
                <th>Nama Produk</th>
                <th>Deskripsi</th>
                <th>Harga</th>
                <th>Kategori</th>
                <th>Aksi</th>
            </tr>
        </thead>
        <tbody>
            @foreach($products as $product)
            <tr>
                <td>{{ $product->name }}</td>
                <td>{{ $product->description }}</td>
                <td>{{ $product->price }}</td>
                <td>{{ $product->category->name }}</td>
                <td>
                    <a href="{{ route('products.edit', $product->id) }}" class="btn btn-warning">Edit</a>
                    <form action="{{ route('products.destroy', $product->id) }}" method="POST" style="display:inline;">
                        @csrf
                        @method('DELETE')
                        <button type="submit" class="btn btn-danger" onclick="return confirm('Apakah Anda yakin ingin menghapus produk ini?')">Hapus</button>
                    </form>
                </td>
            </tr>
            @endforeach
        </tbody>
    </table>

    <!-- Menampilkan pagination -->
    {{ $products->links() }}
</div>
@endsection

Penjelasan:

  • @foreach($products as $product): Looping melalui daftar produk yang diterima dari controller.
  • $product->category->name: Menampilkan nama kategori dari produk. Ini bekerja karena kita sudah mengatur relasi belongsTo pada model Product.
  • @method('DELETE'): Digunakan untuk mengirimkan request DELETE untuk menghapus produk.
  • $products->links(): Menampilkan pagination untuk memecah daftar produk jika terlalu panjang.

3. Mengedit Produk (Update)

Untuk mengedit produk yang sudah ada, kita perlu membuat file edit.blade.php. File ini hampir mirip dengan create.blade.php, tetapi form-nya sudah terisi dengan data produk yang akan di-edit.

Kode lengkap untuk file edit.blade.php:

@extends('layouts.app')

@section('content')
<div class="container">
    <h1>Edit Produk</h1>

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

    <!-- Form untuk mengedit produk -->
    <form method="POST" action="{{ route('products.update', $product->id) }}">
        @csrf
        @method('PUT')
        <div class="mb-3">
            <label for="name" class="form-label">Nama Produk</label>
            <input type="text" class="form-control" id="name" name="name" value="{{ $product->name }}" required>
        </div>

        <div class="mb-3">
            <label for="description" class="form-label">Deskripsi Produk</label>
            <textarea class="form-control" id="description" name="description" required>{{ $product->description }}</textarea>
        </div>

        <div class="mb-3">
            <label for="price" class="form-label">Harga Produk</label>
            <input type="number" class="form-control" id="price" name="price" value="{{ $product->price }}" step="0.01" required>
        </div>

        <div class="mb-3">
            <label for="category_id" class="form-label">Kategori Produk</label>
            <select class="form-control" id="category_id" name="category_id" required>
                <option value="">-- Pilih Kategori --</option>
                @foreach($categories as $category)
                    <option value="{{ $category->id }}" {{ $product->category_id == $category->id ? 'selected' : '' }}>
                        {{ $category->name }}
                    </option>
                @endforeach
            </select>
        </div>

        <button type="submit" class="btn btn-primary">Update</button>
    </form>
</div>
@endsection

Penjelasan:

  • value="{{ $product->name }}": Form sudah terisi dengan data produk yang diambil dari database.
  • @method('PUT'): Digunakan untuk mengirimkan request PUT untuk memperbarui data produk.

Penulisan Koding CRUD pada Controller untuk Setiap Model

Di Laravel, Controller digunakan untuk mengelola logika aplikasi yang berhubungan dengan CRUD (Create, Read, Update, Delete). Pada proyek jual beli mobil ini, kita akan membuat sebuah Controller untuk mengelola produk. Di sini, kita akan membahas kode CRUD untuk ProductController, namun pendekatannya bisa diterapkan juga pada model-model lain seperti Category, Customer, dan Transaction.

1. Membuat Controller

Pertama, buatlah controller untuk Product menggunakan perintah Artisan:

php artisan make:controller ProductController

Perintah ini akan membuat file ProductController di direktori app/Http/Controllers/. Kita akan menambahkan semua logika CRUD di dalam controller ini.

2. Kode CRUD di ProductController

Di bawah ini adalah kode lengkap untuk menangani operasi CRUD pada Product di ProductController:

namespace App\\\\Http\\\\Controllers;

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

class ProductController extends Controller
{
    // Menampilkan daftar produk (Read)
    public function index()
    {
        // Mengambil semua produk dari database dan mem-paginate 10 data per halaman
        $products = Product::with('category')->paginate(10);

        // Return view dengan data produk
        return view('products.index', compact('products'));
    }

    // Menampilkan form untuk membuat produk baru (Create)
    public function create()
    {
        // Mengambil semua kategori untuk ditampilkan pada form select
        $categories = Category::all();

        // Return view untuk menampilkan form
        return view('products.create', compact('categories'));
    }

    // Menyimpan data produk baru ke database (Store)
    public function store(Request $request)
    {
        // Validasi data yang dikirimkan dari form
        $request->validate([
            'name' => 'required|string|max:255',
            'description' => 'required|string',
            'price' => 'required|numeric|min:0',
            'category_id' => 'required|exists:categories,id',
        ]);

        // Menyimpan produk baru ke database
        Product::create($request->all());

        // Redirect ke halaman daftar produk dengan pesan sukses
        return redirect()->route('products.index')->with('success', 'Produk berhasil ditambahkan.');
    }

    // Menampilkan form untuk mengedit produk yang ada (Edit)
    public function edit($id)
    {
        // Cari produk berdasarkan ID
        $product = Product::findOrFail($id);

        // Ambil semua kategori untuk form select
        $categories = Category::all();

        // Return view dengan data produk yang akan di-edit
        return view('products.edit', compact('product', 'categories'));
    }

    // Memperbarui data produk di database (Update)
    public function update(Request $request, $id)
    {
        // Validasi data dari form
        $request->validate([
            'name' => 'required|string|max:255',
            'description' => 'required|string',
            'price' => 'required|numeric|min:0',
            'category_id' => 'required|exists:categories,id',
        ]);

        // Cari produk berdasarkan ID
        $product = Product::findOrFail($id);

        // Update produk di database
        $product->update($request->all());

        // Redirect ke halaman daftar produk dengan pesan sukses
        return redirect()->route('products.index')->with('success', 'Produk berhasil diupdate.');
    }

    // Menghapus produk dari database (Delete)
    public function destroy($id)
    {
        // Cari produk berdasarkan ID
        $product = Product::findOrFail($id);

        // Hapus produk dari database
        $product->delete();

        // Redirect ke halaman daftar produk dengan pesan sukses
        return redirect()->route('products.index')->with('success', 'Produk berhasil dihapus.');
    }
}

Penjelasan Kode ProductController:

  • index(): Method ini digunakan untuk menampilkan daftar produk. Data produk dipaginate menggunakan paginate(10) sehingga hanya 10 produk yang ditampilkan per halaman.
  • create(): Method ini menampilkan form untuk menambahkan produk baru. Kita juga mengambil semua kategori untuk ditampilkan pada form select kategori.
  • store(Request $request): Method ini digunakan untuk menyimpan produk baru ke dalam database. Sebelum menyimpan, kita melakukan validasi terhadap data yang dikirim dari form untuk memastikan semua field diisi dengan benar.
  • edit($id): Method ini digunakan untuk menampilkan form edit produk yang ada. Produk diambil berdasarkan ID, dan kita juga mengambil semua kategori untuk ditampilkan pada form select.
  • update(Request $request, $id): Method ini digunakan untuk memperbarui data produk di database. Sama seperti store(), method ini juga memvalidasi data sebelum menyimpan perubahan.
  • destroy($id): Method ini digunakan untuk menghapus produk dari database. Setelah produk dihapus, pengguna akan diarahkan kembali ke halaman daftar produk dengan pesan sukses.

3. Route untuk CRUD di web.php dengan Detail dan Lengkap

Untuk mengaktifkan semua operasi CRUD di aplikasi Laravel, kita perlu mendefinisikan route di dalam file routes/web.php. Laravel menyediakan fitur resource route, yang memungkinkan kita untuk menangani semua operasi CRUD (Create, Read, Update, Delete) dengan satu baris kode saja. Ini akan secara otomatis menghasilkan rute untuk setiap operasi CRUD yang kita perlukan dalam aplikasi.

Berikut adalah langkah-langkah dan detail untuk mengelola route CRUD di web.php:

Langkah 1: Definisikan Resource Route untuk Produk

Kita bisa menggunakan resource route untuk ProductController seperti berikut:

use App\\\\Http\\\\Controllers\\\\ProductController;

// Definisikan resource route untuk produk
Route::resource('products', ProductController::class);

Perintah Route::resource('products', ProductController::class) akan menghasilkan serangkaian route secara otomatis yang menangani operasi CRUD pada produk. Rute-rute ini mencakup operasi untuk menampilkan daftar produk, membuat produk baru, mengedit, memperbarui, dan menghapus produk.

Rute yang Dihasilkan oleh Resource Route

Dengan hanya mendefinisikan Route::resource('products', ProductController::class), Laravel akan menghasilkan rute berikut secara otomatis:

HTTP MethodURLActionKegunaan
GET/productsindexMenampilkan daftar produk
GET/products/createcreateMenampilkan form untuk membuat produk
POST/productsstoreMenyimpan produk baru ke database
GET/products/{product}showMenampilkan detail produk tertentu
GET/products/{product}/editeditMenampilkan form untuk mengedit produk
PUT/PATCH/products/{product}updateMemperbarui data produk di database
DELETE/products/{product}destroyMenghapus produk dari database

Penjelasan rute yang dihasilkan:

  1. GET /products: Rute ini digunakan untuk menampilkan daftar semua produk. Biasanya, halaman ini berisi tabel atau daftar produk.
  2. GET /products/create: Rute ini akan menampilkan formulir untuk membuat produk baru.
  3. POST /products: Rute ini digunakan untuk menyimpan produk baru ke dalam database. Data produk akan dikirimkan melalui formulir menggunakan metode POST.
  4. GET /products/{product}: Rute ini menampilkan detail produk tertentu berdasarkan ID produk. Meskipun sering tidak digunakan dalam aplikasi berbasis dashboard admin, rute ini bisa berguna dalam aplikasi front-end untuk melihat detail produk.
  5. GET /products/{product}/edit: Rute ini akan menampilkan formulir untuk mengedit produk yang sudah ada. Produk diambil berdasarkan ID yang diberikan pada URL.
  6. PUT/PATCH /products/{product}: Rute ini digunakan untuk memperbarui data produk yang sudah ada. Data yang diperbarui dikirim melalui formulir menggunakan metode PUT atau PATCH.
  7. DELETE /products/{product}: Rute ini digunakan untuk menghapus produk dari database berdasarkan ID produk.

Langkah 2: Mengelola Route CRUD untuk Model Lain

Untuk model lain seperti Customer dan Transaction, kita bisa mendefinisikan resource route dengan cara yang sama. Misalnya, untuk CustomerController dan TransactionController, kita tambahkan kode berikut di file web.php:

use App\\\\Http\\\\Controllers\\\\CustomerController;
use App\\\\Http\\\\Controllers\\\\TransactionController;

// Definisikan resource route untuk pelanggan
Route::resource('customers', CustomerController::class);

// Definisikan resource route untuk transaksi
Route::resource('transactions', TransactionController::class);

Penjelasan:

  • Route::resource('customers', CustomerController::class) akan menghasilkan rute CRUD untuk mengelola pelanggan, seperti menampilkan daftar pelanggan, membuat pelanggan baru, mengedit, memperbarui, dan menghapus pelanggan.
  • Route::resource('transactions', TransactionController::class) akan menghasilkan rute CRUD untuk mengelola transaksi, seperti menampilkan daftar transaksi, menambahkan transaksi baru, mengedit, memperbarui, dan menghapus transaksi.

Dengan ini, kita dapat menangani semua operasi CRUD untuk setiap model di aplikasi dengan menggunakan resource route, sehingga tidak perlu menuliskan setiap rute CRUD secara manual.

Langkah 3: Customizing Resource Route

Jika Anda hanya ingin menggunakan sebagian dari operasi CRUD, Anda bisa menyesuaikan resource route dengan menambahkan parameter only atau except. Sebagai contoh:

  • Menggunakan only untuk hanya menyediakan rute tertentu: Route::resource('products', ProductController::class)->only(['index', 'create', 'store']); Rute di atas hanya akan menghasilkan rute untuk index, create, dan store, tanpa rute lain seperti edit, update, atau destroy.
  • Menggunakan except untuk mengecualikan rute tertentu: Route::resource('products', ProductController::class)->except(['show']); Rute di atas akan menghasilkan semua rute CRUD kecuali show (menampilkan detail produk).

Langkah 4: Route Names

Setiap resource route juga memiliki nama yang secara otomatis dihasilkan oleh Laravel. Nama ini bisa digunakan untuk membuat link atau redirect. Berikut adalah nama yang dihasilkan oleh resource route:

HTTP MethodURLActionRoute Name
GET/productsindexproducts.index
GET/products/createcreateproducts.create
POST/productsstoreproducts.store
GET/products/{product}showproducts.show
GET/products/{product}/editeditproducts.edit
PUT/PATCH/products/{product}updateproducts.update
DELETE/products/{product}destroyproducts.destroy

Sebagai contoh, untuk membuat link ke halaman daftar produk, Anda bisa menggunakan nama route products.index seperti ini:

<a href="{{ route('products.index') }}">Daftar Produk</a>

4. Kode CRUD untuk Model Lain (Category, Customer, Transaction)

Langkah-langkah dan koding CRUD untuk model lainnya seperti Category, Customer, dan Transaction pada dasarnya mengikuti pola yang sama dengan ProductController. Perbedaannya hanya pada field-field yang dimasukkan ke dalam validasi, dan penyesuaian relasi model yang diperlukan.

Contoh untuk CategoryController:

namespace App\\\\Http\\\\Controllers;

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

class CategoryController extends Controller
{
    public function index()
    {
        $categories = Category::paginate(10);
        return view('categories.index', compact('categories'));
    }

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

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

        Category::create($request->all());
        return redirect()->route('categories.index')->with('success', 'Kategori berhasil ditambahkan.');
    }

    public function edit($id)
    {
        $category = Category::findOrFail($id);
        return view('categories.edit', compact('category'));
    }

    public function update(Request $request, $id)
    {
        $request->validate([
            'name' => 'required|string|max:255',
            'description' => 'nullable|string',
        ]);

        $category = Category::findOrFail($id);
        $category->update($request->all());
        return redirect()->route('categories.index')->with('success', 'Kategori berhasil diupdate.');
    }

    public function destroy($id)
    {
        $category = Category::findOrFail($id);
        $category->delete();
        return redirect()->route('categories.index')->with('success', 'Kategori berhasil dihapus.');
    }
}

Kode CRUD untuk CustomerController dan TransactionController dengan Detail dan Lengkap

Setelah memahami struktur CRUD pada ProductController, berikut adalah implementasi CRUD untuk CustomerController dan TransactionController. Kedua controller ini mengikuti pola yang sama dengan ProductController, namun dengan penyesuaian pada field dan relasi yang relevan dengan model Customer dan Transaction.

1. CustomerController

CustomerController digunakan untuk mengelola data pelanggan, seperti menambah pelanggan baru, mengedit data pelanggan, menampilkan daftar pelanggan, dan menghapus pelanggan.

Berikut adalah kode lengkap CustomerController:

namespace App\\\\Http\\\\Controllers;

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

class CustomerController extends Controller
{
    // Menampilkan daftar pelanggan (Read)
    public function index()
    {
        // Mengambil semua data pelanggan dan mem-paginate 10 data per halaman
        $customers = Customer::paginate(10);

        // Return view dengan data pelanggan
        return view('customers.index', compact('customers'));
    }

    // Menampilkan form untuk membuat pelanggan baru (Create)
    public function create()
    {
        // Return view untuk menampilkan form pendaftaran pelanggan baru
        return view('customers.create');
    }

    // Menyimpan data pelanggan baru ke database (Store)
    public function store(Request $request)
    {
        // Validasi input dari form
        $request->validate([
            'name' => 'required|string|max:255',
            'email' => 'required|email|unique:customers,email',
            'phone' => 'required|string|max:15',
            'address' => 'required|string',
        ]);

        // Menyimpan data pelanggan baru ke database
        Customer::create($request->all());

        // Redirect ke halaman daftar pelanggan dengan pesan sukses
        return redirect()->route('customers.index')->with('success', 'Pelanggan berhasil ditambahkan.');
    }

    // Menampilkan form untuk mengedit pelanggan (Edit)
    public function edit($id)
    {
        // Cari pelanggan berdasarkan ID
        $customer = Customer::findOrFail($id);

        // Return view untuk mengedit data pelanggan
        return view('customers.edit', compact('customer'));
    }

    // Memperbarui data pelanggan di database (Update)
    public function update(Request $request, $id)
    {
        // Validasi input dari form
        $request->validate([
            'name' => 'required|string|max:255',
            'email' => 'required|email|unique:customers,email,' . $id,
            'phone' => 'required|string|max:15',
            'address' => 'required|string',
        ]);

        // Cari pelanggan berdasarkan ID
        $customer = Customer::findOrFail($id);

        // Update data pelanggan di database
        $customer->update($request->all());

        // Redirect ke halaman daftar pelanggan dengan pesan sukses
        return redirect()->route('customers.index')->with('success', 'Data pelanggan berhasil diupdate.');
    }

    // Menghapus pelanggan dari database (Delete)
    public function destroy($id)
    {
        // Cari pelanggan berdasarkan ID
        $customer = Customer::findOrFail($id);

        // Hapus pelanggan dari database
        $customer->delete();

        // Redirect ke halaman daftar pelanggan dengan pesan sukses
        return redirect()->route('customers.index')->with('success', 'Pelanggan berhasil dihapus.');
    }
}

Penjelasan Kode CustomerController:

  • index(): Menampilkan daftar pelanggan dengan pagination.
  • create(): Menampilkan form untuk membuat pelanggan baru.
  • store(): Validasi data dari form dan menyimpan pelanggan baru ke database.
  • edit(): Menampilkan form untuk mengedit data pelanggan yang sudah ada berdasarkan ID.
  • update(): Memperbarui data pelanggan di database setelah melakukan validasi.
  • destroy(): Menghapus pelanggan dari database berdasarkan ID.

2. TransactionController

TransactionController digunakan untuk mengelola data transaksi, seperti menambah transaksi baru, mengedit transaksi, menampilkan daftar transaksi, dan menghapus transaksi. Setiap transaksi biasanya berhubungan dengan customer dan product, sehingga kita juga perlu mengelola relasi ini.

Berikut adalah kode lengkap TransactionController:

namespace App\\\\Http\\\\Controllers;

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

class TransactionController extends Controller
{
    // Menampilkan daftar transaksi (Read)
    public function index()
    {
        // Mengambil semua data transaksi beserta relasi ke customer dan produk
        $transactions = Transaction::with(['customer', 'product'])->paginate(10);

        // Return view dengan data transaksi
        return view('transactions.index', compact('transactions'));
    }

    // Menampilkan form untuk membuat transaksi baru (Create)
    public function create()
    {
        // Mengambil semua customer dan product untuk form select
        $customers = Customer::all();
        $products = Product::all();

        // Return view untuk menampilkan form
        return view('transactions.create', compact('customers', 'products'));
    }

    // Menyimpan data transaksi baru ke database (Store)
    public function store(Request $request)
    {
        // Validasi input dari form
        $request->validate([
            'customer_id' => 'required|exists:customers,id',
            'product_id' => 'required|exists:products,id',
            'total_price' => 'required|numeric|min:0',
            'transaction_date' => 'required|date',
        ]);

        // Menyimpan transaksi baru ke database
        Transaction::create($request->all());

        // Redirect ke halaman daftar transaksi dengan pesan sukses
        return redirect()->route('transactions.index')->with('success', 'Transaksi berhasil ditambahkan.');
    }

    // Menampilkan form untuk mengedit transaksi yang ada (Edit)
    public function edit($id)
    {
        // Cari transaksi berdasarkan ID
        $transaction = Transaction::findOrFail($id);

        // Ambil semua customer dan product untuk form select
        $customers = Customer::all();
        $products = Product::all();

        // Return view untuk mengedit transaksi
        return view('transactions.edit', compact('transaction', 'customers', 'products'));
    }

    // Memperbarui data transaksi di database (Update)
    public function update(Request $request, $id)
    {
        // Validasi input dari form
        $request->validate([
            'customer_id' => 'required|exists:customers,id',
            'product_id' => 'required|exists:products,id',
            'total_price' => 'required|numeric|min:0',
            'transaction_date' => 'required|date',
        ]);

        // Cari transaksi berdasarkan ID
        $transaction = Transaction::findOrFail($id);

        // Update data transaksi di database
        $transaction->update($request->all());

        // Redirect ke halaman daftar transaksi dengan pesan sukses
        return redirect()->route('transactions.index')->with('success', 'Transaksi berhasil diupdate.');
    }

    // Menghapus transaksi dari database (Delete)
    public function destroy($id)
    {
        // Cari transaksi berdasarkan ID
        $transaction = Transaction::findOrFail($id);

        // Hapus transaksi dari database
        $transaction->delete();

        // Redirect ke halaman daftar transaksi dengan pesan sukses
        return redirect()->route('transactions.index')->with('success', 'Transaksi berhasil dihapus.');
    }
}

Penjelasan Kode TransactionController:

  • index(): Mengambil data transaksi bersama dengan relasinya ke customer dan product menggunakan metode with() dan menampilkan daftar transaksi dengan pagination.
  • create(): Menampilkan form untuk membuat transaksi baru, mengambil data customer dan product untuk ditampilkan dalam form select.
  • store(): Menyimpan transaksi baru ke database setelah memvalidasi input dari form.
  • edit(): Menampilkan form untuk mengedit transaksi yang sudah ada berdasarkan ID transaksi.
  • update(): Memperbarui data transaksi di database setelah validasi.
  • destroy(): Menghapus transaksi berdasarkan ID dan mengarahkan kembali ke halaman daftar transaksi dengan pesan sukses.

8. Uji Coba Fitur CRUD Secara Detail dan Lengkap

Setelah menyelesaikan semua langkah dalam membangun fitur CRUD (Create, Read, Update, Delete) untuk aplikasi jual beli mobil, langkah terakhir adalah melakukan uji coba untuk memastikan bahwa semua fungsi bekerja dengan baik.

Dalam tahap ini, kita akan menguji setiap operasi CRUD di aplikasi Laravel yang telah kita bangun, mulai dari menambahkan data, menampilkan data, mengedit data, hingga menghapus data.

Berikut adalah langkah-langkah detail untuk melakukan uji coba fitur CRUD:

Langkah 1: Menjalankan Server Lokal

Untuk menguji aplikasi Laravel yang kita buat, kita perlu menjalankan server lokal. Laravel menyediakan command bawaan untuk menjalankan server menggunakan Artisan. Buka terminal di direktori proyek Laravel Anda dan jalankan perintah berikut:

php artisan serve

Perintah ini akan menjalankan server di alamat http://127.0.0.1:8000 (atau bisa jadi alamat lain tergantung konfigurasi). Jika Anda ingin menjalankan server di port tertentu, Anda bisa menambahkan port yang diinginkan:

php artisan serve --port=8080

Setelah server berjalan, buka browser Anda dan akses aplikasi melalui URL http://127.0.0.1:8000.

Langkah 2: Uji Coba Create (Menambahkan Produk Baru)

  1. Akses halaman Tambah Produk dengan membuka URL http://127.0.0.1:8000/products/create atau klik tombol Tambah Produk Baru pada halaman daftar produk.
  2. Isi formulir untuk menambahkan produk baru. Pastikan semua field seperti Nama Produk, Deskripsi, Harga, dan Kategori diisi dengan benar.
  3. Klik tombol Simpan.
  4. Jika produk berhasil ditambahkan, Anda akan diarahkan kembali ke halaman daftar produk, dan produk baru yang Anda tambahkan akan terlihat di tabel.

Catatan:

  • Jika ada validasi yang gagal (seperti kolom yang wajib diisi tidak terisi), pesan error akan muncul di atas formulir.

Langkah 3: Uji Coba Read (Menampilkan Daftar Produk)

  1. Buka halaman utama produk di URL http://127.0.0.1:8000/products untuk melihat daftar produk yang sudah ada.
  2. Pastikan produk yang telah Anda tambahkan muncul di tabel dengan informasi lengkap seperti Nama Produk, Deskripsi, Harga, dan Kategori.
  3. Periksa juga apakah tombol Edit dan Hapus tersedia di setiap baris produk untuk mengelola data lebih lanjut.

Catatan:

  • Jika jumlah produk melebihi batas per halaman, pastikan pagination bekerja dengan baik dan menampilkan produk secara bertahap.

Langkah 4: Uji Coba Update (Mengedit Produk)

  1. Pada halaman daftar produk, klik tombol Edit di salah satu produk yang ingin Anda ubah.
  2. Anda akan diarahkan ke halaman Edit Produk (http://127.0.0.1:8000/products/{id}/edit), di mana formulir yang terisi dengan data produk saat ini akan ditampilkan.
  3. Ubah informasi produk sesuai kebutuhan, misalnya, ganti Harga atau Deskripsi.
  4. Klik tombol Update untuk menyimpan perubahan.
  5. Setelah perubahan disimpan, Anda akan diarahkan kembali ke halaman daftar produk, dan produk yang di-edit akan menampilkan data yang sudah di-update.

Catatan:

  • Jika ada kesalahan dalam input, seperti kolom yang wajib diisi kosong, pesan error akan muncul, dan Anda dapat memperbaiki kesalahan tersebut.

Langkah 5: Uji Coba Delete (Menghapus Produk)

  1. Pada halaman daftar produk, klik tombol Hapus pada produk yang ingin Anda hapus.
  2. Sebuah pesan konfirmasi akan muncul meminta Anda untuk memastikan apakah Anda benar-benar ingin menghapus produk tersebut. Jika Anda yakin, klik OK.
  3. Setelah mengklik OK, produk akan dihapus dari database, dan Anda akan diarahkan kembali ke halaman daftar produk dengan pesan sukses yang memberitahukan bahwa produk berhasil dihapus.

Catatan:

  • Produk yang dihapus tidak akan muncul lagi di daftar, dan data terkait produk tersebut akan dihapus secara permanen dari database.

Langkah 6: Pengujian Keseluruhan

Untuk memastikan semua fitur bekerja dengan baik, lakukan pengujian keseluruhan dengan skenario berikut:

  • Tambahkan beberapa produk untuk menguji apakah fitur Create berfungsi.
  • Tampilkan daftar produk untuk memastikan Read bekerja.
  • Ubah informasi beberapa produk untuk memastikan Update berfungsi dengan baik.
  • Hapus beberapa produk untuk memastikan fitur Delete berjalan lancar.
  • Pastikan tidak ada bug atau masalah validasi yang muncul selama pengujian.

Langkah 7: Penanganan Error dan Validasi

Pastikan aplikasi sudah menangani semua validasi dan error dengan baik. Coba skenario berikut untuk memastikan error handling berfungsi:

  • Coba tambahkan produk tanpa mengisi semua field yang diperlukan, dan pastikan pesan error muncul.
  • Coba edit produk dengan mengisi field dengan nilai yang tidak valid, dan pastikan validasi berfungsi.
  • Pastikan jika mencoba menghapus produk yang tidak ada, aplikasi menampilkan pesan error yang sesuai.

Kesimpulan

Dengan melakukan uji coba ini, kita dapat memastikan bahwa fitur CRUD pada aplikasi jual beli mobil berfungsi dengan baik. Semua operasi Create, Read, Update, dan Delete dapat dijalankan dengan lancar, dan pengguna dapat mengelola data produk dengan mudah melalui antarmuka yang kita buat. Pengujian ini penting untuk memastikan aplikasi bekerja secara optimal sebelum di-deploy ke production.

Penutup: Terus Belajar dan Mengasah Kemampuan sebagai Programmer

Sebagai programmer, kita memiliki tanggung jawab untuk terus belajar dan mengasah kemampuan, terutama dalam menguasai framework yang populer seperti Laravel. Setiap proyek yang kita bangun, seperti aplikasi jual beli mobil dengan fitur CRUD ini, adalah kesempatan untuk meningkatkan skill dan memperdalam pemahaman kita tentang berbagai konsep pemrograman, mulai dari manajemen database, validasi input, hingga penerapan arsitektur yang baik.

Tidak hanya itu, membangun banyak proyek untuk portfolio juga sangat penting untuk menunjukkan kemampuan kita kepada calon klien atau perusahaan. Portfolio yang solid akan meningkatkan peluang kita dalam mendapatkan proyek atau pekerjaan yang lebih baik.

Jika Anda ingin belajar lebih dalam lagi, terutama dengan bimbingan dari mentor yang sudah expert di bidangnya, Anda dapat belajar di Buildwithangga. Di sana, Anda akan mendapatkan akses kelas seumur hidup, yang memungkinkan Anda untuk belajar kapan saja dan mengulang materi sesuai kebutuhan. Selain itu, Anda juga bisa mendapatkan berbagai manfaat seperti konsultasi langsung dengan mentor, bergabung dengan grup diskusi bersama siswa lain, dan mempersiapkan diri dengan lebih baik untuk dunia kerja.

Jadi, jangan ragu untuk terus belajar, eksplorasi proyek baru, dan jadikan setiap kesempatan sebagai langkah untuk menjadi programmer yang lebih baik. Selamat belajar dan semoga sukses!