Laravel 7 Basic CRUD
Halloo, kali ini kita bakal belajar sama-sama lagi nih tentang crud data dari database
Apa Itu Laravel
Apa itu Laravel?? Dari dokumentasi resmi Laravel katanya gini, "Laravel adalah framework aplikasi web dengan sintaks yang ekspresif dan elegan. Kami percaya pengembangan harus menjadi pengalaman yang menyenangkan dan kreatif agar benar-benar memuaskan. Laravel mencoba untuk menghilangkan rasa sakit dari pengembangan dengan mengurangi tugas-tugas umum yang digunakan di sebagian besar proyek web"
Oke tanpa long-long again, markicob!
Install Laravel
Penginstallan laravel ini kalo di dokumentasinya, bisa pake Laravel
Installer & Composer
Ohya, kita gunain laravel versi 7 yaa,
Contoh installasi laravel adalah sebagai berikut:
composer create-project --prefer-dist laravel/laravel:^7.0 AplikasiPertama
Install Dengan Laravel Installer
Kalo mau install laravel pake Installernya, kita pasang dulu installer Laravel di pc/laptop kita masing-masing.
composer global require laravel/installer
Aku asumsikan penginstallan installer Laravel kalian success yaa:D, kalo udah berhasil, kita ke sintax selanjutnya!
laravel new AplikasiPertama --7.0
Untuk installasi, aku mau pake yang cara install dengan composer. Karna di dokumentasi Laravelnya, kalo mau aplikasi yang sesuai / kostum versi disarankan pake composer.
Generating optimized autoload files
> Illuminate\Foundation\ComposerScripts::postAutoloadDump
> @php artisan package:discover --ansi
Discovered Package: facade/ignition
Discovered Package: fideloper/proxy
Discovered Package: fruitcake/laravel-cors
Discovered Package: laravel/tinker
Discovered Package: nesbot/carbon
Discovered Package: nunomaduro/collision
Package manifest generated successfully.
76 packages you are using are looking for funding.
Use the `composer fund` command to find out more!
> @php artisan key:generate --ansi
Application key set successfully.
Jika installasi sukses maka akan tampil sintax seperti yang ada di atas, sekarang kita akan coba jalankan laravelnya cukup ketik sintax seperti contoh berikut
cd AplikasiPertama
php artisan serve
Pastikan response dari sintax tersebut adalah ip dari aplikasi laravel kita. Buka ip tersebut di browser dan boom!!! Kita sekarang udah punya aplikasi laravel pertama kita:D
Sistem Penyimpanan / Direktori Dari Framework Laravel
Direktori pada laravel udah pake konsep MVC lho, jadi untuk alur url dan tampilan itu di Laravel sudah ada aturannya, untuk lebih paham tentang konsep MVC boleh di googling aja yaa..
Route / Alur Web Aplikasi
Alur Aplikasi Laravel ada di file web.php yang ada di folder routes. File ini nantinya akan kita sering gunakan
Controller
Controller ini maksudnya adalah tempat dimana kita melakukan logic / algoritma di aplikasi Laravel kita
Melakukan CRUD Di Aplikasi Laravel
Konfigurasi file .env dan buat Database
Sekarang kita konfigurasi file .env di aplikasi kita untuk menghubungkan antara aplikasi & database
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=db_crud_aplikasi
DB_USERNAME=root
DB_PASSWORD=
Untuk pengaturan database, silahkan masukkan konfigurasi database masing-masing.
Setelah kita atur file .env , sekarang kita buat dulu database baru. Disini aku pake mysql untuk database nya. Setelah buat database baru, kita langsung aja ke kodinganya!
Membuat Migrasi Database, Controller, Model, Seeder & Ubah Route
php artisan make:migration create_tb_musik_table
Setelah berhasil dibuat, buka file migrasi tersebut di folder database/migrations dan kita konfigurasikan kolom-kolom yang akan kita buat di table tersebut
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
class CreateTbMusikTable extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::create('tb_musik', function (Blueprint $table) {
$table->id();
$table->string('judul');
$table->string('pencipta');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::dropIfExists('tb_musik');
}
}
Pada func_ up itu adalah gambaran untuk struktur table yang akan kita buat, setelah pengkonfigurasian selesai sekarang kita hanya perlu jalankan migrasi nya
php artisan migrate
Sintax diatas merupakan sintax untuk menjalankan migrasi yang sebelumnya kita buat. Jika berhasil, maka di database kita akan ada table yang kita buat sendiri & table bawaan dari Laravel.
Lanjut membuat controller, sama halnya membuat migrasi membuat controller juga kita gunakan terminal & menggunakan 'artisan' dari Laravel. Memang ajaib sih!
php artisan make:model Musik -scr
Dengan sintax diatas, maka laravel akan membuatkan kita Model, Controller & Seeder. Apasih gunanya? Oke lanjut dulu ya untuk ubah alur / route dari aplikasi Laravel kita. Silahkan temen-temen buka file web.php yang ada di folder routes.
<?php
use Illuminate\Support\Facades\Route;
/*
|--------------------------------------------------------------------------
| 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::get('/', function () {
return view('welcome');
});
Route::resource('musik', 'MusikController');
Konfigurasi File Model & File Seeder
Apa sih Model di laravel ??? Gampangnya gini, Model di laravel itu penghubung antar aplikasi & table. Kalo file Seeder file tsb merupakan tempat untuk dummy data. Jadi mempermudah untuk menambah data pada database ketika testing aplikasi.
Buka file model & ikuti seperti di bawah ini
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Musik extends Model
{
protected $table = 'tb_musik';
protected $fillable = [
'judul',
'pencipta',
];
}
Kita hanya perlu menambahkan variable table & value nya adalah nama table yang dibuat. Kenapa harus gini? Karna pada aturan laravel, Laravel membaca sebuah table itu dengan contoh ketika kita membuat table 'musik', laravel ngebacanya 'musiks'. Yap, jadi ambigu, mending kita ubah aja sekalian. Hehehehe
Buka file MusikSeeder.php dan akan kita konfigurasikan data dummy nya
<?php
use App\Musik;
use Illuminate\Database\Seeder;
class MusikSeeder extends Seeder
{
/**
* Run the database seeds.
*
* @return void
*/
public function run()
{
$data = [
[
'judul' => 'laguA',
'pencipta' => 'siA',
],
[
'judul' => 'laguB',
'pencipta' => 'siB',
],
[
'judul' => 'laguC',
'pencipta' => 'siC',
],
];
foreach ($data as $key => $value) {
Musik::create($value);
};
}
}
Sintax diatas adalah full dari file MusikSeeder kita, untuk dummy data, ada di method up dengan memanggil Model, dan attribute 'create'. Untuk data-nya random / terserah temen-temen aja yak:D
Membuat Template Layout
Di Laravel kita bisa membuat 1 file parent yang nantinya akan menjadi template yang isinya adalah konten dinamis.
Pertama kita buat folder 'layouts' di folder resource→views & 1 buah file yang bernama 'app.blade.php'
Isi dari file app.blade.php
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
@yield('c_style')
<title>@yield('title')</title>
</head>
<body>
@yield('content')
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script>
@if(Session::has('error'))
alert("{{ session('error') }}")
@elseif(Session::has('success'))
alert("{{ session('success') }}")
@endif
</script>
@yield('c_js')
</body>
</html>
Ohya, buat juga folder 'data-musik' di folder resource→view yang isinya 'index.blade.php', 'tambah.blade.php' & 'edit.blade.php'. Untuk masing-masing file, dikosongin dulu aja yaa:D
Mengubah Struktur File
<?php
namespace App\Http\Controllers;
use App\Musik;
use Illuminate\Http\Request;
class MusikController extends Controller
{
public function __construct()
{
$this->data = [
'musik' => Musik::all()->sortByDesc('id'),
];
}
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
$data = $this->data;
return view('data-musik.index', compact('data'));
}
/**
* Show the form for creating a new resource.
*
* @return \Illuminate\Http\Response
*/
public function create()
{
return view('data-musik.tambah');
}
/**
* Store a newly created resource in storage.
*
* @param \Illuminate\Http\Request $request
* @return \Illuminate\Http\Response
*/
public function store(Request $request)
{
try {
$rules = [
'judul' => 'required',
'pencipta' => 'required',
];
$messages = [
'*.required' => 'This field is required',
];
$validated = $this->validate($request, $rules, $messages);
Musik::create([
'judul' => $validated['judul'],
'pencipta' => $validated['pencipta'],
]);
return redirect()->route('musik.index')->with('success', 'Berhasil Tambah Data');
} catch (\Throwable $th) {
return redirect()->back()->with('error', 'Gagal Tambah Data');
}
}
/**
* Display the specified resource.
*
* @param \App\Musik $musik
* @return \Illuminate\Http\Response
*/
public function show(Musik $musik)
{
//
}
/**
* Show the form for editing the specified resource.
*
* @param \App\Musik $musik
* @return \Illuminate\Http\Response
*/
public function edit($id)
{
try {
$musikById = Musik::findOrFail($id);
return view('data-musik.edit', compact('musikById'));
} catch (\Throwable $th) {
return redirect()->back()->with('error', $th->getMessage());
}
}
/**
* Update the specified resource in storage.
*
* @param \Illuminate\Http\Request $request
* @param \App\Musik $musik
* @return \Illuminate\Http\Response
*/
public function update(Request $request, $id)
{
try {
$rules = [
'judul' => 'required',
'pencipta' => 'required',
];
$messages = [
'*.required' => 'This field is required',
];
$validated = $this->validate($request, $rules, $messages);
$musikById = Musik::findOrFail($id);
$musikById->update([
'judul' => $validated['judul'],
'pencipta' => $validated['pencipta'],
'updated_at' => date(now())
]);
return redirect()->route('musik.index')->with('success', 'Berhasil ubah data');
} catch (\Throwable $th) {
return redirect()->back()->with('error', 'Gagal ubah data ' . $th->getMessage());
}
}
/**
* Remove the specified resource from storage.
*
* @param \App\Musik $musik
* @return \Illuminate\Http\Response
*/
public function destroy($id)
{
try {
$musikById = Musik::findOrFail($id);
$musikById->delete();
return redirect()->route('musik.index')->with('success', 'Berhasil hapus data');
} catch (\Throwable $th) {
return redirect()->back()->with('error', 'Gagal hapus data ' . $th->getMessage());
}
}
}
File View Data Musik Folder Resource→view→data-musik
Index.blade.php
@extends('layouts.app')
@section('title', 'Data Musik')
@section('content')
<section class="container-fluid mt-3">
<div class="row justify-content-center">
<div class="col-md-12">
<div class="card">
<div class="card-header">
<h3 class="card-title">Data Lagu</h3>
</div>
<div class="card-body">
<a href="{{ route('musik.create') }}" class="btn btn-primary">Tambah Data</a>
<table class="table table-striped">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Judul Lagu</th>
<th scope="col">Pencipta</th>
<th scope="col text-center">Aksi</th>
</tr>
</thead>
<tbody>
@foreach ($data['musik'] as $lagu)
<tr>
<th scope="row">{{ $loop->iteration }}</th>
<td>{{ $lagu->judul }}</td>
<td>{{ $lagu->pencipta }}</td>
<td class="d-flex">
<a href="{{ route('musik.edit', ['musik'=>$lagu->id]) }}" class="btn btn-warning btn-sm">Edit</a>
<form action="{{ route('musik.destroy', ['musik'=>$lagu->id]) }}" method="post"id="form-delete">
@csrf
@method('DELETE')
<button onclick="return confirm('Yakin?');" type="submit" class="btn btn-danger btn-sm">Delete</button>
</form>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
</section>
@endsection
tambah.blade.php
@extends('layouts.app')
@section('title', "Tambah Data")
@section('content')
<section class="container-fluid mt-3">
<div class="row justify-content-center">
<div class="col-md-12">
<div class="card">
<div class="card-header">
<h3 class="card-title">Tambah Data Lagu</h3>
</div>
<div class="card-body">
<form action="{{ route('musik.store') }}" method="post">
@csrf
<div class="form-group">
<label for="judul">Judul Lagu</label>
<input type="text" class="form-control @error('judul')
is-invalid
@enderror" id="judul" name="judul" placeholder="Judul Lagu">
@error('judul')
<div class="invalid-feedback">
{{$message}}
</div>
@enderror
</div>
<div class="form-group">
<label for="pencipta">Pencipta Lagu</label>
<input type="text" class="form-control @error('pencipta')
is-invalid
@enderror" id="pencipta" name="pencipta" placeholder="Pencipta Lagu">
@error('pencipta')
<div class="invalid-feedback">
{{$message}}
</div>
@enderror
</div>
<div class="row">
<div class="col-md-6">
<a href="{{ route('musik.index') }}" class="btn btn-secondary">Kembali</a>
<button type="submit" class="btn btn-primary">Simpan</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
@endsection
edit.blade.php
@extends('layouts.app')
@section('title', "Ubah Data")
@section('content')
<section class="container-fluid mt-3">
<div class="row justify-content-center">
<div class="col-md-12">
<div class="card">
<div class="card-header">
<h3 class="card-title">Ubah Data Lagu</h3>
</div>
<div class="card-body">
<form action="{{ route('musik.update', ['musik'=>$musikById->id]) }}" method="post">
@csrf
@method('PUT')
<div class="form-group">
<label for="judul">Judul Lagu</label>
<input type="text" class="form-control @error('judul')
is-invalid
@enderror" id="judul" name="judul" placeholder="Judul Lagu" value="{{$musikById->judul}}">
@error('judul')
<div class="invalid-feedback">
{{$message}}
</div>
@enderror
</div>
<div class="form-group">
<label for="pencipta">Pencipta Lagu</label>
<input type="text" class="form-control @error('pencipta')
is-invalid
@enderror" id="pencipta" name="pencipta" placeholder="Pencipta Lagu" value="{{$musikById->pencipta}}">
@error('pencipta')
<div class="invalid-feedback">
{{$message}}
</div>
@enderror
</div>
<div class="row">
<div class="col-md-6">
<a href="{{ route('musik.index') }}" class="btn btn-secondary">Kembali</a>
<button type="submit" class="btn btn-primary">Simpan</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
@endsection
Sangat bermanfaat
BalasHapusGood job
BalasHapus