Create Data with Facade DB

Dalam Laravel, proses Create Data dengan Facade DB berarti memanfaatkan fitur bawaan DB untuk memasukkan atau menyimpan data baru (operasi Insert) langsung ke dalam tabel database tanpa harus membuat file Model Eloquent terlebih dahulu. Pengembang biasanya menggunakan metode DB::table('nama_tabel')->insert() di dalam Controller untuk mengeksekusi perintah ini. Metode ini menerima argumen berupa array asosiatif, di mana nama kolom database dijadikan sebagai key dan data baru yang ingin disimpan dijadikan sebagai value-nya.

STUDI KASUS 1 : Buatlah tampilan form untuk menambahkan data kelas dan success/error message feedback-nya untuk tabel t_kelas.

Tugas ini mencakup pembuatan form input untuk menambah data pada tabel t_kelas menggunakan Facade DB di Controller, lengkap dengan success/error message feedback. Selain itu, diterapkan juga konsep clean code dengan menghubungkan tiga route berbeda ke satu gerbang logika yang sama, yaitu method index di dalam SiswaController. 

<<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('t_kelas', function (Blueprint $table) {
$table->id();
$table->string('nama_kelas', 100);
$table->string('jurusan', 50);
$table->string('lokasi_ruangan', 100);
$table->string('nama_wali_kelas', 50);
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('t_kelas');
}
};

Ini adalah codingan dari form t_kelas yang dimana jika ditampilkan akan menjadi seperti ini:

Tampilan Form t_kelas :

Struktur Tabel phpMyAdmin

Ini adalah codingan Message Feedback t_kelas yang akan memberikan output berhasil atau tidak, seperti ini:

Code Message Feedback t_kelas :

<<if ($status) {
return redirect('/siswa')->with('success', 'Data berhasil ditambahkan');
} else {
return redirect('/siswa/create')->with('error', 'Data gagal
ditambahkan');
}
}

Tampilan Message Feedback t_kelas:

Struktur Tabel phpMyAdmin

STUDI KASUS 2 : Implementasikan validasi untuk tabel t_kelas, coba tambahkan beberapa validasi yang berbeda selain yang sudah dijelaskan

Penerapan sistem validasi data input (Form Validation) sebelum data kelas baru disimpan ke dalam tabel t_kelas. Tujuan utamanya adalah memastikan bahwa semua informasi yang dimasukkan oleh pengguna melalui form telah memenuhi kriteria dan aturan tertentu demi menjaga validitas, kerapian, dan keamanan data di dalam database.

Code validasi t_kelas di Controller:

<<<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB;
class KelasController extends Controller
{
function index1() {
$siswa = DB::table('t_kelas')->get();
return view('kelas', compact('siswa'));
}
function create1() {
return view('kelas.form');
}
function store1(Request $request)
{
$request->validate([
'nama_kelas' => 'required|string|max:50',
'jurusan' => 'required|string|in:RPL,DKV,AKL,OTKP',
'lokasi_ruangan' => 'required|string|min:3|max:20',
'nama_wali_kelas' => 'required|string|regex:/^[A-Za-z\s]+$/',
'jumlah_siswa' => 'required|integer|min:10|max:50',
'email_wali' => 'nullable|email',
'no_telp' => 'nullable|regex:/^08[0-9]{9,11}$/',
]);
$input = $request->all();
unset($input['_token']);
$status = DB::table('t_kelas')->insert($input);
if ($status) {
return redirect('/siswa')->with('success', 'Data berhasil
ditambahkan');
} else {
return redirect('/siswa/create')->with('error', 'Data gagal
ditambahkan');
}

}

Code validasi t_kelas di Views:

<<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form Kelas</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #4A90E2;
margin: 0;
padding: 0;
}
.container {
background-color: white;
max-width: 400px;
margin: 50px auto;
padding: 25px;
border-radius: 10px;
box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}
h2 {
text-align: center;
color: #4A90E2;
margin-bottom: 20px;
}
label {
display: block;
font-weight: bold;
margin-top: 10px;
}
input[type="text"], select {
width: 100%;
padding: 8px;
margin-top: 5px;
border: 1px solid #ccc;
border-radius: 5px;
}
button {
background-color: #4A90E2;

color: white;
border: none;
padding: 10px;
width: 100%;
border-radius: 5px;
margin-top: 15px;
cursor: pointer;
}
button:hover {
background-color: #357ABD;
}
</style>
</head>
<body>
<div class="container">
@session('error')
<div class="alert alert-error">
{{ session('error') }}
</div>
@endsession
@if ($errors->any())
<div class="alert alert-danger">
<strong>Perhatian!</strong>
<br>
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<h2>Form Kelas</h2>
<form action="{{ route('kelas.store') }}" method="POST">
@csrf
<label>Nama Kelas</label>
<input type="text" name="nama_kelas" placeholder="Contoh: XI RPL
1" required>
<label>Jurusan</label>
<input type="text" name="jurusan" placeholder="Contoh: Rekayasa
Perangkat Lunak" required>

<label>Lokasi Ruangan</label>
<input type="text" name="lokasi_ruangan" placeholder="Contoh:
Ruang 201" required>
<label>Nama Wali Kelas</label>
<input type="text" name="nama_wali_kelas" placeholder="Contoh: Ibu
Rani" required>
<button type="submit">Simpan</button>
</form>
</div>
</body>
</html>

Tampilan Validasi t_kelas :

Struktur Tabel phpMyAdmin

STUDI KASUS 3 : Implementasikan User's Old Value untuk input field jk dan golongan_darah

Tujuan utama dari studi kasus ini adalah meningkatkan pengalaman pengguna (User Experience) saat terjadi kesalahan pengisian data. Bayangkan jika kamu sedang mengisi form yang berisi Nama Kelas, Jurusan, Lokasi Ruangan, dan data lainnya, lalu ketika menekan tombol simpan, sistem menolak karena ada data yang tidak valid (misalnya format pengisian salah). Tanpa fitur Old Value, seluruh form akan otomatis ter-reset menjadi kosong, sehingga kamu terpaksa harus mengetik ulang semua data dari awal yang tentunya sangat menjengkelkan.

Code pada views siswa/form:

<<<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form Kelas</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #4A90E2;
margin: 0;
padding: 0;
}
.container {
background-color: white;
max-width: 400px;
margin: 50px auto;
padding: 25px;
border-radius: 10px;
box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}
h2 {
text-align: center;
color: #4A90E2;
margin-bottom: 20px;
}
label {
display: block;
font-weight: bold;
margin-top: 10px;
}
input[type="text"], select {
width: 100%;
padding: 8px;
margin-top: 5px;
border: 1px solid #ccc;
border-radius: 5px;
}
button {
background-color: #4A90E2;

color: white;
border: none;
padding: 10px;
width: 100%;
border-radius: 5px;
margin-top: 15px;
cursor: pointer;
}
button:hover {
background-color: #357ABD;
}
</style>
</head>
<body>
<div class="container">
@session('error')
<div class="alert alert-error">
{{ session('error') }}
</div>
@endsession
@if ($errors->any())
<div class="alert alert-danger">
<strong>Perhatian!</strong>
<br>
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<h2>Form Kelas</h2>
<form action="{{ route('kelas.store') }}" method="POST">
@csrf
<label>Nama Kelas</label>
<input type="text" name="nama_kelas" placeholder="Contoh: XI RPL
1" required value="{{ old('nama_kelas')}}">
<label>Jurusan</label>
<input type="text" name="jurusan" placeholder="Contoh: Rekayasa
Perangkat Lunak" required value="{{ old('jurusan') }}">
<label>Lokasi Ruangan</label>

<input type="text" name="lokasi_ruangan" placeholder="Contoh:
Ruang 201" required value="{{ old('lokasi_ruangan') }}">
<label>Nama Wali Kelas</label>
<input type="text" name="nama_wali_kelas" placeholder="Contoh: Ibu
Rani" required value="{{ old('nama_wali_kelas') }}">
<button type="submit">Simpan</button>
</form>
</div>
</body>
</html>

Tampilan percobaan Old Value jk dan golongan_darah di Web Browser:

Struktur Tabel phpMyAdmin
Kembali ke daftar tugas