Toturial CRUD Data User

CRUD (Create, Read, Update,Delete) Data User
1. Open folder project sebelumnya.

2. Silahkan membuat folde baru di app/resouce/views. Buat folder dengan nama
“admin”. Didalam folder admin tambahkan folder baru dengan nama “master”.
Kemudian dalam folder master buatkan folder baru lagi untuk folder “user, barang,
dan jenisbarang”.
3. Selanjutnya buatkan juga folder dengan nama“layout” di app/resouce/views,

kemudian tambahkan file baru didalamnya dengan nama file “layout.blade.php”.
4. Tambahkan User Controller dengan perintah di bawah ini di terminal/cmd. Pastikan

perintahnya benar tanpa typo:
php artisan make:controller UserController
5. Selanjutnya buka file di direktori app/resouce/views /layout/layout.blade.php yang

telah kita buat dan ketikkan kode berikut, pastikan penulisan benar tanpa typo!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<titl><{{$title}} </title>

<link rel="icon" type="image/png" sizes="16x16"
href="/assets/images/favicon.png">

<link
href="/assets/plugins/tables/css/datatable/dataTables.bootstrap4.min.css"
rel="stylesheet">
<link href="/assets/css/style.css" rel="stylesheet">
</head>
<body>

<div id="preloader">
<div class="loader">
<svg class="circular" viewBox="25 25 50 50">
<circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="3"
stroke-miterlimit="10" />
</svg>
</div>
</div>


<div id="main-wrapper">

<div class="nav-header">
<div class="brand-logo">
<a href="index.html">
<b class="logo-abbr"><img src="images/logo.png" alt=""> </b>
<span class="logo-compact"><img src="./images/logo-compact.png" alt=""></span>
<span class="brand-title">
<img src="images/logo-text.png" alt="">
</span>
</a>
</div>
</div>


<div class="header">
<div class="header-content clearfix">
<div class="nav-control">
<div class="hamburger">
<span class="toggle-icon"><i class="icon-menu"></i></span>
</div>
</div>
<div class="header-left"></div>
<div class="header-right">
<ul class="clearfix">
<li class="icons dropdown">
<div class="user-img c-pointer position-relative" data-toggle="dropdown">
<span class="activity active"></span>
<img src="images/user/1.png" height="40" width="40" alt="">
</div>
<div class="drop-down dropdown-profile dropdown-menu">
<div class="dropdown-content-body">
<ul>
<li>
<a href="a"><i class="icon-user"></i> <span>Profile</span></a>
</li>
<hr class="my-2">
<li><a href="page-login.html"><i class="icon-key"></i>
<span>Logout</span></a></li>
</ul>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>


<div class="nk-sidebar">
<div class="nk-nav-scroll">
<ul class="metismenu" id="menu">
<li class="nav-label">Dashboard</li>
<li>
<a href="a" aria-expanded="false">
<i class="icon-speedometer menu-icon"></i><span class="nav-text">Dasboard</span>
</a>
</li>
<li class="nav-label">UI Components</li>

<li>
<a href="a" aria-expanded="false">
<i class="icon-speedometer menu-icon"></i><span class="nav-text">Setting
Diskon</span>
</a>
</li>
<li class="mega-menu mega-menu-sm">

<a class="has-arrow" href="javascript:void()" aria-expanded="false">
<i class="icon-globe-alt menu-icon"></i><span class="nav-text">Data Master</span>
</a>
<ul aria-expanded="false">
<li><a href="/user">Data User</a></li>
<li><a href="/jenisbarang">Data Jenis Barang</a></li>
<li><a href="/barang">Data Barang</a></li>
</ul>
</li>
<li>
<a href="/laporan" aria-expanded="false">
<i class="icon-speedometer menu-icon"></i><span class="nav-text">Data
Transaksi</span>
</a>
</li>
<li>
<a href="/transaksi" aria-expanded="false">
<i class="icon-speedometer menu-icon"></i><span class="nav-text">Data
Laporan</span>
</a>
</li>
</ul>
</div>
</div>

@yield('content')

<div class="footer">
<div class="copyright">
<p>Copyright © Designed & Developed by <a href="a">Quixlab</a> 2018</p>
</div>
</div>

</div>


<script src="/assets/plugins/common/common.min.js"></script>
<script src="/assets/js/custom.min.js"></script>
<script src="/assets/js/settings.js"></script>
<script src="/assets/js/gleek.js"></script>
<script src="/assets/js/styleSwitcher.js"></script>
<script src="/assets/plugins/tables/js/jquery.dataTables.min.js"></script>
<script
src="/assets/plugins/tables/js/datatable/dataTables.bootstrap4.min.js"></script>
<script src="/assets/plugins/tables/js/datatable-init/datatable-
basic.min.js"></script>
</body>
</html>
6. Selanjutnya dalam folder user (app/resouce/views/admin/master/user) tambahkan

file baru dengan nama “list.blade.php” kemudian tuliskan kode berikut. Pastikan
penulisan benar tanpa typo!
@extends('layout.layout')
@section('content')
<div class="content-body">
<div class="row page-titles mx-0">
<div class="col p-md-0">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a
href="javascript:void(0)">Dashboard</a></li>
<li class="breadcrumb-item active"><a
href="javascript:void(0)">{{ $title}}</a></li>
</ol>
</div>
</div>
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<div class="d-flex align-items-center">
<h4 class="card-title">{{ $title}}</h4>
<button type ="button" class="btn btn-primary
btn-round ml-auto" data-toggle="modal" data-target="#modalCreate">
<i class="fa fa-plus"></i>
Tambah Data
</button>
</div>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-striped table-
bordered zero-configuration">
<thead>
<tr>
<th>No</th>
<th>Nama</th>
<th>Email</th>
<th>Role</th>
<th>Action</th>
</tr>
</thead>
<tbody>
@php
$no = 1;
@endphp
@foreach ($data_user as $row)
<tr>
<td>{{ $no++}}</td>
<td>{{$row-> name }}</td>
<td>{{ $row->email}}</td>
<td>{{ $row->role}}</td>
<td>
<a href="#" class="btn btn-xs btn-
primary" data-toggle="modal" data-target="#modalEdit{{$row->id}}"><i class="fa
fa-edit"></i> Edit</a>
<a href="#" class="btn btn-xs btn-
danger" data-toggle="modal" data-target="#modalHapus{{$row->id}}"><i class="fa
fa-trash"></i> Hapus</a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="modalCreate" tabindex="-1" role="dialog" aria-

hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Create Data User</h5>
<button type="button" class="close" data-dismiss="modal">
<span>×</span>
</button>
</div>
<form method="POST" action="/user/store">
@csrf
<div class="modal-body">
<div class="form-group">
<label> Nama Lengkap</label>
<input type="text" class="form-control" name="name" placeholder="
Nama Lengkap..." required>
</div>
<label> Email</label>
<input type="email" class="form-control" name="email"
placeholder=" Email..." required>
</div>
<label>Password</label>
<input type="password" class="form-control" name="password"
placeholder=" Password..." required>
</div>
<label> Role</label>
<select class="form-control" name="role" required>
<option value="" hidden>..pilih role.. </option>
<option value="admin">Admin </option>
<option value="kasir">kasir</option>
</select>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal"><i
class="fa fa-undo"></i> Close</button>
<button type="submit" class="btn btn-primary"><i class="fa fa-
save"></i>Save Changes</button>
</div>
</form>
</div>
</div>
</div>
@foreach ($data_user as $d)

<div class="modal fade" id="modalEdit{{$d->id}}" tabindex="-1" role="dialog"
aria-hidden="true">
<h5 class="modal-title">Edit Data</h5>
<span>×</span>
</button>
</div>
<form method="POST" action="/user/update/{{$d->id}}">
@csrf
<label> Nama Lengkap</label>
<input type="text" value="{{$d->name}}" class="form-control"
name="name" placeholder=" Nama Lengkap..." required>
</div>
<label> Email</label>
<input type="email" value="{{$d->email}}" class="form-control"
name="email" placeholder=" Email..." required>
</div>
<label>Password</label>
<input type="password" class="form-control" name="password"
placeholder=" Password..." required>
</div>
<label> Role</label>
<select class="form-control" name="role" required>
<option value="" hidden>..pilih role.. </option>
<option value="admin">Admin </option>
<option value="kasir">kasir</option>
</select>
</div>
</div>
<button type="button" class="btn btn-secondary" data-dismiss="modal"><i
class="fa fa-undo"></i> Close</button>
<button type="submit" class="btn btn-primary"><i class="fa fa-
save"></i>Save Changes</button>
</div>
</form>
</div>
</div>
</div>
@endforeach
@foreach ($data_user as $c)

<div class="modal fade" id="modalHapus{{$c->id}}" tabindex="-1" role="dialog"
aria-hidden="true">
<h5 class="modal-title">Edit Data</h5>
<span>×</span>
</button>
</div>
<form method="get" action="/user/destroy/{{$d->id}}">
<h5>Apakah Anda Ingin Menghapus Data Ini ?</h5>
</div>
</div>
<button type="button" class="btn btn-secondary" data-
dismiss="modal"><i class="fa fa-undo"></i> Close</button>
<button type="submit" class="btn btn-danger"><i class="fa fa-
trash"></i> Hapus</button>
</div>
</form>
</div>
</div>
</div>
@endforeach
@endsection
7. Selanjutnya kita akan membuat routenya pada web.php sebagai berikut
8. Pada bagian UserContrroller kita Use dulu untuk modelnya dengan Use
App/Models/user;
selanjutnya tuliskan kode sebagi berikut
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\User;
use Illuminate\Support\Facades\Hash;
class UserController extends Controller

{
public function home()
{
$data = array(
'title' => 'Data User',
'data_user' => User::all(),
);
return view('admin.master.user.list', $data);
}
public function store(Request $request)

{
User::create([
'name' => $request->name,
'email' => $request->email,
'password'=> Hash::make($request->password),
'role' => $request->role,
]);
return redirect('/user')->with('success','Data berhasil disimpan');
}
public function update(Request $request, $id)

{
User::where('id', $id)
->update([
'name' => $request->name,
'email' => $request->email,
'password'=> Hash::make($request->password),
'role' => $request->role,
]);
return redirect('/user')->with('success','Data berhasil diubah');
}
public function destroy($id)

{
User::where('id', $id)->delete();
return redirect('/user')->with('success', 'Data berhasil dihapus');
}
}
9. Jika semua langkah sudah dikerjakan, silakan uji coba running project kalian dengan
mengetik di terminal/cmd php artisan serve
Cobalah untuk melakukan aksi Tambah data, edit dan hapus!
TUGAS
Buatkan CRUD untuk data Jenis Barang
 Buat contoller JenisBarangController (php artisan make: controller
JenisBarangController)
 Buat model JenisBarang (php artisan make:model JenisBarang)
 Dalam direktori app/resouce/views /admin/master/ jenis barang buat file baru
list.blade.php
REFERENSI:
https://www.youtube.com/watch?v=dorBomRR0Sg&list=PLRx0OlyTshRaeJxdgrbHDxQOe8z_Sixh
d
https://www.youtube.com/watch?v=D5pDFsk-408&list=PLHDxqnzxw7P_Q8qy5bXn5-
Mv3VyALew3X

Toturial CRUD Data User

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Toturial CRUD Data User

Diunggah oleh

Hak Cipta:

Format Tersedia

CRUD (Create, Read, Update,Delete) Data User

1. Open folder project sebelumnya.

3. Selanjutnya buatkan juga folder dengan nama“layout” di app/resouce/views,

4. Tambahkan User Controller dengan perintah di bawah ini di terminal/cmd. Pastikan

5. Selanjutnya buka file di direktori app/resouce/views /layout/layout.blade.php yang

<li class="nav-label">UI Components</li>

<li class="mega-menu mega-menu-sm">

6. Selanjutnya dalam folder user (app/resouce/views/admin/master/user) tambahkan

<div class="modal fade" id="modalCreate" tabindex="-1" role="dialog" aria-

@foreach ($data_user as $d)

@foreach ($data_user as $c)

7. Selanjutnya kita akan membuat routenya pada web.php sebagai berikut

class UserController extends Controller

public function store(Request $request)

public function update(Request $request, $id)

public function destroy($id)

Anda mungkin juga menyukai