Tutorial Membuat Aplikasi CRUD Sederhana dengan Laravel Indonesia: Panduan Lengkap

by

Laravel, framework PHP yang elegan dan populer, memudahkan para developer dalam membangun aplikasi web modern. Salah satu fondasi penting dalam pengembangan web adalah CRUD (Create, Read, Update, Delete). Dalam tutorial ini, kita akan membahas secara mendalam tentang tutorial membuat aplikasi CRUD sederhana dengan Laravel Indonesia. Panduan ini dirancang untuk pemula maupun developer yang ingin memperdalam pemahaman mereka tentang CRUD dengan Laravel. Mari kita mulai!

1. Pendahuluan: Apa itu CRUD dan Mengapa Laravel?

Sebelum kita terjun ke kode, mari kita pahami dulu apa itu CRUD dan mengapa Laravel adalah pilihan yang tepat untuk tugas ini.

Apa Itu CRUD?

CRUD adalah singkatan dari:

  • Create: Membuat data baru.
  • Read: Membaca data yang sudah ada.
  • Update: Memperbarui data yang sudah ada.
  • Delete: Menghapus data yang sudah ada.

CRUD adalah operasi dasar yang hampir selalu ada dalam aplikasi web berbasis data. Contohnya, dalam aplikasi blog, kita perlu membuat (create) postingan baru, membaca (read) daftar postingan, memperbarui (update) postingan yang sudah ada, dan menghapus (delete) postingan yang tidak relevan lagi.

Mengapa Laravel?

Laravel menawarkan berbagai keuntungan yang signifikan untuk membuat aplikasi CRUD:

  • Eloquent ORM: Eloquent menyediakan cara yang elegan dan mudah untuk berinteraksi dengan database. Kita tidak perlu menulis query SQL yang panjang dan rumit.
  • Routing yang Mudah: Sistem routing Laravel memungkinkan kita mendefinisikan URL dan controller yang sesuai dengan mudah.
  • Templating Engine Blade: Blade membuat proses membuat tampilan (view) menjadi lebih sederhana dan terstruktur.
  • Keamanan: Laravel menyediakan fitur-fitur keamanan yang kuat, seperti proteksi CSRF, untuk melindungi aplikasi kita dari serangan web.
  • Komunitas yang Besar: Komunitas Laravel yang besar berarti ada banyak sumber daya, tutorial, dan paket yang tersedia untuk membantu kita dalam mengembangkan aplikasi.

Dengan semua keunggulan ini, Laravel menjadi pilihan yang sangat baik untuk membuat aplikasi CRUD sederhana maupun kompleks.

2. Persiapan Awal: Instalasi Laravel dan Konfigurasi Database

Sebelum memulai coding, kita perlu menyiapkan lingkungan pengembangan kita. Langkah-langkahnya adalah sebagai berikut:

  1. Pastikan PHP dan Composer Terinstall: Laravel membutuhkan PHP versi 7.3 ke atas dan Composer, package manager untuk PHP. Pastikan keduanya sudah terinstall di sistem Anda. Jika belum, kunjungi situs resmi PHP dan Composer untuk mengunduh dan menginstalnya.

  2. Instalasi Laravel: Buka terminal atau command prompt Anda dan jalankan perintah berikut untuk membuat proyek Laravel baru:

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

    Ganti crud-laravel dengan nama proyek yang Anda inginkan. Proses ini akan mengunduh dan menginstal semua dependensi Laravel yang diperlukan.

  3. Konfigurasi Database: Buka file .env di direktori proyek Anda. Cari bagian yang mengatur konfigurasi database dan sesuaikan dengan detail database Anda. Contoh:

    DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=nama_database_anda
DB_USERNAME=username_database_anda
DB_PASSWORD=password_database_anda

    Ganti nama_database_anda, username_database_anda, dan password_database_anda dengan informasi yang sesuai. Pastikan database yang Anda tentukan sudah dibuat sebelumnya.

  4. Migrasi Database: Laravel menggunakan migration untuk mengelola struktur database. Jalankan perintah berikut untuk membuat tabel-tabel default:

    php artisan migrate

    Perintah ini akan menjalankan migration default yang sudah disediakan oleh Laravel, seperti tabel users dan password_resets.

3. Membuat Model dan Migrasi untuk Data yang Akan Dikelola

Selanjutnya, kita perlu membuat model dan migrasi untuk data yang akan kita kelola. Misalnya, kita akan membuat aplikasi CRUD untuk mengelola data “Artikel”.

  1. Membuat Model: Jalankan perintah berikut untuk membuat model Artikel:

    php artisan make:model Artikel -m

    Perintah ini akan membuat dua file: app/Models/Artikel.php (model) dan database/migrations/YYYY_MM_DD_HHMMSS_create_artikels_table.php (migrasi). Opsi -m akan otomatis membuat file migrasi untuk tabel artikels.

  2. Mengedit Migrasi: Buka file migrasi yang baru dibuat (di database/migrations). Modifikasi isi method up() untuk mendefinisikan struktur tabel artikels. Contoh:

    <?php

use IlluminateDatabaseMigrationsMigration;
use IlluminateDatabaseSchemaBlueprint;
use IlluminateSupportFacadesSchema;

class CreateArtikelsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('artikels', function (Blueprint $table) {
            $table->id();
            $table->string('judul');
            $table->text('isi');
            $table->string('penulis');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('artikels');
    }
}

    Dalam contoh ini, tabel artikels memiliki kolom id, judul, isi, penulis, created_at, dan updated_at.

  3. Menjalankan Migrasi: Jalankan kembali perintah migrate untuk membuat tabel artikels di database:

    php artisan migrate

  4. Mengedit Model: Buka file model app/Models/Artikel.php. Tambahkan kode berikut untuk mendefinisikan atribut yang dapat diisi (fillable):

    <?php

namespace AppModels;

use IlluminateDatabaseEloquentFactoriesHasFactory;
use IlluminateDatabaseEloquentModel;

class Artikel extends Model
{
    use HasFactory;

    protected $fillable = [
        'judul',
        'isi',
        'penulis',
    ];
}

    Atribut fillable menentukan kolom mana yang boleh diisi secara massal (mass assignment).

4. Membuat Controller untuk Mengelola Data Artikel

Controller bertanggung jawab untuk menangani logika bisnis aplikasi dan berinteraksi dengan model.

  1. Membuat Controller: Jalankan perintah berikut untuk membuat controller ArtikelController:

    php artisan make:controller ArtikelController

    Perintah ini akan membuat file app/Http/Controllers/ArtikelController.php.

  2. Mengedit Controller: Buka file ArtikelController.php dan tambahkan method-method berikut untuk menangani operasi CRUD:

    <?php

namespace AppHttpControllers;

use AppModelsArtikel;
use IlluminateHttpRequest;

class ArtikelController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return IlluminateHttpResponse
     */
    public function index()
    {
        $artikels = Artikel::all();
        return view('artikels.index', compact('artikels'));
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return IlluminateHttpResponse
     */
    public function create()
    {
        return view('artikels.create');
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  IlluminateHttpRequest  $request
     * @return IlluminateHttpResponse
     */
    public function store(Request $request)
    {
        $request->validate([
            'judul' => 'required',
            'isi' => 'required',
            'penulis' => 'required',
        ]);

        Artikel::create($request->all());

        return redirect()->route('artikels.index')
                        ->with('success','Artikel berhasil ditambahkan.');
    }

    /**
     * Display the specified resource.
     *
     * @param  AppModelsArtikel  $artikel
     * @return IlluminateHttpResponse
     */
    public function show(Artikel $artikel)
    {
        return view('artikels.show',compact('artikel'));
    }

    /**
     * Show the form for editing the specified resource.
     *
     * @param  AppModelsArtikel  $artikel
     * @return IlluminateHttpResponse
     */
    public function edit(Artikel $artikel)
    {
        return view('artikels.edit',compact('artikel'));
    }

    /**
     * Update the specified resource in storage.
     *
     * @param  IlluminateHttpRequest  $request
     * @param  AppModelsArtikel  $artikel
     * @return IlluminateHttpResponse
     */
    public function update(Request $request, Artikel $artikel)
    {
        $request->validate([
            'judul' => 'required',
            'isi' => 'required',
            'penulis' => 'required',
        ]);

        $artikel->update($request->all());

        return redirect()->route('artikels.index')
                        ->with('success','Artikel berhasil diperbarui.');
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  AppModelsArtikel  $artikel
     * @return IlluminateHttpResponse
     */
    public function destroy(Artikel $artikel)
    {
        $artikel->delete();

        return redirect()->route('artikels.index')
                        ->with('success','Artikel berhasil dihapus.');
    }
}
    • index(): Menampilkan daftar artikel.
    • create(): Menampilkan form untuk membuat artikel baru.
    • store(): Menyimpan artikel baru ke database.
    • show(): Menampilkan detail artikel.
    • edit(): Menampilkan form untuk mengedit artikel.
    • update(): Memperbarui artikel di database.
    • destroy(): Menghapus artikel dari database.

5. Membuat View dengan Blade Templating Engine

View adalah tampilan yang dilihat oleh pengguna. Laravel menggunakan Blade, templating engine yang sederhana dan kuat.

  1. Membuat Direktori View: Buat direktori artikels di dalam direktori resources/views. Di dalam direktori artikels, buat file-file berikut:

    • index.blade.php
    • create.blade.php
    • edit.blade.php
    • show.blade.php

  2. Mengisi File View: Isi file-file view dengan kode HTML dan Blade directive yang sesuai. Contoh isi file index.blade.php:

    <!DOCTYPE html>
<html>
<head>
    <title>CRUD Artikel</title>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>

<div class="container">
    @if ($message = Session::get('success'))
        <div class="alert alert-success">
            <p>{{ $message }}</p>
        </div>
    @endif
    <div class="row">
        <div class="col-lg-12 margin-tb">
            <div class="pull-left">
                <h2>CRUD Artikel Laravel</h2>
            </div>
            <div class="pull-right">
                <a class="btn btn-success" href="{{ route('artikels.create') }}"> Buat Artikel Baru</a>
            </div>
        </div>
    </div>

    <table class="table table-bordered">
        <tr>
            <th>No</th>
            <th>Judul</th>
            <th>Isi</th>
            <th>Penulis</th>
            <th width="280px">Aksi</th>
        </tr>
        @foreach ($artikels as $artikel)
        <tr>
            <td>{{ ++$i }}</td>
            <td>{{ $artikel->judul }}</td>
            <td>{{ $artikel->isi }}</td>
            <td>{{ $artikel->penulis }}</td>
            <td>
                <form action="{{ route('artikels.destroy',$artikel->id) }}" method="POST">
                    <a class="btn btn-info" href="{{ route('artikels.show',$artikel->id) }}">Lihat</a>
                    <a class="btn btn-primary" href="{{ route('artikels.edit',$artikel->id) }}">Edit</a>
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="btn btn-danger">Hapus</button>
                </form>
            </td>
        </tr>
        @endforeach
    </table>
    {!! $artikels->links() !!}
</div>
</body>
</html>

    Sesuaikan isi file view lainnya (create.blade.php, edit.blade.php, show.blade.php) dengan kebutuhan Anda. Gunakan form HTML untuk menginput data dan Blade directive untuk menampilkan data dari controller.

6. Mendefinisikan Route untuk Mengakses Controller

Route menghubungkan URL dengan method controller yang sesuai.

  1. Mengedit File Route: Buka file routes/web.php. Tambahkan route untuk mengakses method-method di ArtikelController. Contoh:

    <?php

use IlluminateSupportFacadesRoute;
use AppHttpControllersArtikelController;

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::resource('artikels', ArtikelController::class);

Route::get('/', function () {
    return view('welcome');
});

    Kode Route::resource('artikels', ArtikelController::class); akan otomatis membuat route untuk semua method CRUD di ArtikelController.

7. Uji Coba Aplikasi CRUD Anda: Membuat, Membaca, Memperbarui, dan Menghapus Data

Sekarang, saatnya untuk menguji coba aplikasi CRUD Anda.

  1. Jalankan Server Pengembangan Laravel: Buka terminal atau command prompt Anda dan jalankan perintah berikut:

    php artisan serve

    Perintah ini akan menjalankan server pengembangan Laravel di alamat http://127.0.0.1:8000.

  2. Akses Aplikasi CRUD: Buka browser Anda dan kunjungi alamat http://127.0.0.1:8000/artikels. Anda akan melihat daftar artikel (jika ada).

  3. Uji Operasi CRUD:

    • Klik tombol “Buat Artikel Baru” untuk membuat artikel baru.
    • Isi form dan klik tombol “Simpan”. Artikel baru akan ditambahkan ke daftar.
    • Klik tombol “Lihat” untuk melihat detail artikel.
    • Klik tombol “Edit” untuk mengedit artikel.
    • Klik tombol “Hapus” untuk menghapus artikel.

    Pastikan semua operasi CRUD berjalan dengan lancar.

8. Validasi Data: Memastikan Data yang Diinput Benar

Validasi data adalah langkah penting untuk memastikan bahwa data yang diinput oleh pengguna benar dan sesuai dengan format yang diharapkan.

  1. Menambahkan Validasi di Controller: Kita sudah menambahkan validasi di method store() dan update() pada ArtikelController. Gunakan method validate() untuk menentukan aturan validasi. Contoh:

    $request->validate([
    'judul' => 'required|max:255',
    'isi' => 'required',
    'penulis' => 'required|max:255',
]);

    Dalam contoh ini, kita memastikan bahwa kolom judul dan penulis wajib diisi dan tidak boleh lebih dari 255 karakter. Kolom isi juga wajib diisi.

  2. Menampilkan Pesan Error: Laravel secara otomatis akan menampilkan pesan error jika validasi gagal. Kita dapat menyesuaikan tampilan pesan error ini di view. Contoh:

    @if ($errors->any())
    <div class="alert alert-danger">
        <strong>Whoops!</strong> Ada beberapa masalah dengan input Anda.<br><br>
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif

9. Pagination: Menangani Data dalam Jumlah Besar

Jika data yang kita kelola sangat banyak, menampilkan semua data dalam satu halaman akan membuat halaman menjadi lambat dan sulit dinavigasi. Pagination adalah solusi untuk masalah ini.

  1. Menggunakan Pagination di Controller: Ubah method index() di ArtikelController untuk menggunakan pagination. Contoh:

    public function index()
{
    $artikels = Artikel::paginate(5); // Menampilkan 5 artikel per halaman
    return view('artikels.index', compact('artikels'))
            ->with('i', (request()->input('page', 1) - 1) * 5);
}

    Method paginate() akan membagi data menjadi beberapa halaman dan mengembalikan objek Paginator.

  2. Menampilkan Link Pagination di View: Tambahkan kode berikut di view index.blade.php untuk menampilkan link pagination:

    {!! $artikels->links() !!}

    Kode ini akan menampilkan link untuk berpindah antar halaman.

10. Menggunakan Resource Controller untuk Simplifikasi Kode

Laravel menyediakan Resource Controller yang dapat menyederhanakan pembuatan controller CRUD.

  1. Membuat Resource Controller: Buat controller baru menggunakan opsi --resource.

    php artisan make:controller ArtikelController --resource

  2. Isi Resource Controller: Controller ini sudah memiliki method-method dasar CRUD yang telah dibuat. Anda hanya perlu mengimplementasikan logika bisnis di dalamnya.

  3. Definisikan Route Resource: Gunakan Route::resource di routes/web.php untuk menautkan route ke resource controller.

Dengan menggunakan resource controller, kode Anda akan menjadi lebih ringkas dan mudah dikelola.

11. Tambahan: Fitur Pencarian Data (Search)

Fitur pencarian data sangat berguna untuk aplikasi yang mengelola data dalam jumlah besar.

  1. Menambahkan Form Pencarian di View: Tambahkan form pencarian di view index.blade.php. Contoh:

    <form action="{{ route('artikels.index') }}" method="GET">
    <div class="input-group mb-3">
        <input type="text" class="form-control" placeholder="Cari artikel..." name="search">
        <button class="btn btn-outline-secondary" type="submit">Cari</button>
    </div>
</form>

  2. Memproses Pencarian di Controller: Ubah method index() di ArtikelController untuk memproses permintaan pencarian. Contoh:

    public function index(Request $request)
{
    $search = $request->get('search');
    $artikels = Artikel::where('judul', 'LIKE', "%$search%")
                     ->orWhere('isi', 'LIKE', "%$search%")
                     ->paginate(5);

    return view('artikels.index', compact('artikels'))
            ->with('i', (request()->input('page', 1) - 1) * 5);
}

    Kode ini akan mencari artikel yang judul atau isinya mengandung kata kunci yang dimasukkan oleh pengguna.

12. Kesimpulan: Langkah Selanjutnya dalam Pengembangan Laravel

Selamat! Anda telah berhasil membuat aplikasi CRUD sederhana dengan Laravel. Ini hanyalah langkah awal. Ada banyak hal lain yang dapat Anda pelajari dan eksplorasi di Laravel, seperti:

  • Autentikasi: Menambahkan fitur login dan registrasi pengguna.
  • Otorisasi: Mengatur hak akses pengguna ke berbagai fitur aplikasi.
  • Testing: Menulis unit test dan feature test untuk memastikan aplikasi berjalan dengan benar.
  • Deployment: Menyebarkan aplikasi ke server produksi.
  • Penggunaan Package: Memanfaatkan package yang tersedia untuk mempercepat pengembangan.

Teruslah belajar dan bereksperimen. Dengan latihan yang cukup, Anda akan menjadi developer Laravel yang handal. Semoga tutorial membuat aplikasi CRUD sederhana dengan Laravel Indonesia ini bermanfaat! Selamat mencoba dan semoga sukses!