{"id":984,"date":"2022-02-01T17:08:57","date_gmt":"2022-02-01T10:08:57","guid":{"rendered":"https:\/\/duniacoding.info\/?p=984"},"modified":"2022-04-02T12:44:57","modified_gmt":"2022-04-02T05:44:57","slug":"belajar-laravel-crud-pada-laravel-1","status":"publish","type":"post","link":"https:\/\/duniacoding.id\/blog\/belajar-laravel-crud-pada-laravel-1\/","title":{"rendered":"Belajar Laravel 8 #8 : CRUD pada Laravel Part 1"},"content":{"rendered":"\n
\"Belajar<\/figure>\n\n\n\n

Setelah kemarin kita mempelajari tentang Database<\/em>, Faker <\/em>dan Seeder. <\/em>Kali ini kita akan membahas CRUD pada Laravel. Teman-teman pasti sudah Familiar dengan sistem CRUD (Create, Read, Update, Delete), CRUD ini merupakan salah satu bagian penting dalam pengembangan Aplikasi, entah itu di Website ataupun di platform lainnya.<\/p>\n\n\n\n

Nah di Artikel ini kita akan membahas CRUD pada Laravel. Laravel memiliki beberapa hal yang akan memudahkan kita dalam membuat sistem CRUD, yaitu namanya resource<\/em>.<\/p>\n\n\n\n

Penjelasan CRUD pada Laravel<\/h2>\n\n\n\n

Seperti yang aku jelaskan diatas, CRUD pada Laravel ini dimudahkan dengan yang namanya resource<\/em>. Fitur ini akan memudahkan kita dalam membuat Controller <\/em>yang nantinya kita gunakan untuk Fitur CRUD ini. Disini kita akan Praktekkan untuk CRUD Siswa dari awal instalasi sampai selesai.<\/p>\n\n\n\n

Proses Pembuatan Metode CRUD<\/h2>\n\n\n\n

Pada Artikel Part 1 ini, kita akan melakukan setting untuk Metode CRUD <\/code><\/em>ini, sampai nanti kita bisa menggunakan satu Fitur terlebih dahulu yaitu Read<\/code><\/em>. Kita akan mulai dari instalasi Laravel sampai Projek Read<\/code><\/em>.<\/p>\n\n\n\n

Install Projek Laravel<\/h3>\n\n\n\n

Proses instalasi ini bisa kalian lihat di artikel Belajar Laravel #2 : Cara Instalasi Laravel<\/a>, atau bisa kalian lihat seperti dibawah ini. Pertama, buka terminal lalu jalankan syntax dibawah ini<\/p>\n\n\n

\ncomposer create-project laravel\/laravel crud-system\n<\/pre><\/div>\n\n\n
Nah kita namai Projek kita dengan nama crud-system<\/code><\/em> untuk menyesuaikan dengan Hal yang ingin kita kejar yaitu Metode CRUD. Apabila sudah selesai, tinggal jalankan Projek Laravel<\/code> kita beserta Web Server sederhana seperti xampp<\/code><\/em><\/p>\n\n\n\n
Mengatur Database<\/h3>\n\n\n\n
Setelah selesai instalasi dan menjalankan Laravel, yang harus kita lakukan berikutnya adalah mengatur Database <\/em><\/code>yang akan kita gunakan untuk Metode CRUD<\/code> kita. Kalau teman-teman ingin membaca lebih detail tentang Database ini bisa kalian lihat di Artikel Belajar Laravel 8 #6 : Database Migrations<\/a>. <\/p>\n\n\n\n
Nah, kalau di artikel ini kita akan membuat Database <\/code>untuk Data Karyawan saja. Jadi nanti Metode CRUD <\/code>kita akan kita terapkan di Pendataan Karyawan. Pertama, buat Database <\/code>di phpmyadmin <\/code>terlebih dahulu. Silahkan beri nama data_karyawan<\/em><\/code><\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Setelah berhasil membuat Database data_karyawan. <\/em>Sekarang kita ganti settingan di .env<\/code> kita.<\/p>\n\n\n
\nDB_CONNECTION=mysql\nDB_HOST=127.0.0.1\nDB_PORT=3306\nDB_DATABASE=data_karyawan\nDB_USERNAME=root\nDB_PASSWORD=\n<\/pre><\/div>\n\n\n
Pastikan DB_DATABASE<\/code> yang kita tulis sesuai dengan nama Database yang kita buat sebelumnya. Setelah selesai mengatur .env<\/code>, sekarang saatnya kita membuat tabel yang akan kita gunakan untuk CRUD nanti. Dalam membuat tabel ini kita akan menggunakan metode Migrations<\/code><\/em>, selain itu kita juga akan langsung membuat Model <\/em><\/code>beserta Controller <\/code><\/em>nya. <\/p>\n\n\n\n
Sekarang, pastikan kalian sudah install Ekstensi Laravel Artisan<\/code> di Visual Studio Code<\/code>.<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Setelah itu, kita bisa membuat Model<\/code>, Controller<\/code>, dan Migrations<\/code> untuk Tabel Karyawan kita secara langsung. Caranya klik Ctrl + Shift + P<\/code>. Lalu pilih >Make Model<\/code>, Setelah itu buat Nama Model Employee<\/code>, setelah itu akan ada pilihan untuk membuat Migrations, Resource, dan Factory<\/code>? Kita pilih Yes<\/code> saja. Setelah itu kita sudah memiliki Factory, Migrations, Model, dan Controller yang kita butuhkan. Mari kita setting satu-persatu<\/p>\n\n\n\n
Setting Migrations<\/h3>\n\n\n\n
Di Migrations ini kita akan membuat Tabel di Database kita, disini kita akan menentukan beberapa kolom yang akan kita pakai. Silahkan buat yang sederhana saja, sementara cukup nama<\/code>, email<\/code>, dan nomor hp<\/code> saja.<\/p>\n\n\n
\n       Schema::create('employees', function (Blueprint $table) {\n            $table->id();\n            $table->string('name');\n            $table->string('email')->unique();\n            $table->string('phone_number');\n            $table->timestamps();\n        });\n<\/pre><\/div>\n\n\n
Setelah selesai silahkan jalankan php artisan migrate<\/code> di terminal kalian untuk mengecek hasil dari Database kita<\/p>\n\n\n\n
Setting Model<\/h3>\n\n\n\n
Di Model<\/code> Employee.php<\/code> ini kita akan memberikan syntax agar Tabel kita nanti bisa di isi data secara Massive menggunakan protected $guarded<\/code>.<\/p>\n\n\n
\nclass Employee extends Model\n{\n    use HasFactory;\n\n    protected $guarded = ["id"];\n}\n<\/pre><\/div>\n\n\n
Setting Route<\/h3>\n\n\n\n
Nah, di Route <\/code>atau di file web.php<\/code> ini kita akan mengganti syntax untuk Route::get('\/')<\/code>. Kita akan mengganti Route::get<\/code> ini dengan Route::resource<\/code>, jadi nanti kita tidak harus membuat Route lain lagi.<\/p>\n\n\n
\nRoute::resource('\/', EmployeeController::class);\n<\/pre><\/div>\n\n\n
Cukup Hapus Route::get<\/code> di web.php<\/code>, lalu gantikan dengan Syntax diatas.<\/p>\n\n\n\n
Setting Controller<\/h3>\n\n\n\n
Nah, Controller ini adalah sebuah file yang berfungsi untuk menyambungkan Database <\/em>dan tampilan kita. Kalau teman-teman buka, pasti sekarang Controller sudah berisi beberapa fungsi seperti index(), create(), store(), dll<\/code>. Nah Fungsi ini lah yang akan kita gunakan untuk membuat Fungsi CRUD pada Laravel. Mulai dari fungsi pertama yaitu index()<\/code>.<\/p>\n\n\n\n
Fungsi index()<\/code> ini berguna untuk menampilkan Tampilan pertama dari Website kita. Jadi kita akan menampilkan Data yang ada pada Tabel Karyawan. Tulis Seperti ini di dalam Fungsi index()<\/code>.<\/p>\n\n\n
\nreturn view('index', [\n            'employees' => Employee::all()\n        ]);\n<\/pre><\/div>\n\n\n
Nah, diatas ada syntax return view<\/code>, nanti syntax ini akan menampilkan tampilan dari Folder view <\/code>dengan nama index<\/code>. Lalu setelah itu ada 'employees' => Employee::all()<\/code> ini digunakan untuk mengambil semua data yang ada di tabel Employee<\/code><\/em>.<\/p>\n\n\n\n
Sebenarnya masih banyak fungsi yang bisa digunakan selain fungsi all(). kalian bisa lihat detailsnya di Database: Query Builder<\/a>.<\/p>\n\n\n\n
Buat Tampilan<\/h3>\n\n\n\n
Nah, setelah selesai setting Model, Controller dan Route. Sekarang kita akan setting View, Setting view ini merupakan salah satu bagian penting dalam Sistem CRUD pada Laravel karena View ini akan digunakan oleh User untuk memproses Crud pada Laravel nantinya.<\/p>\n\n\n\n
Caranya sederhana, cukup buat File baru di dalam Folder view, lalu kita masukkan tabel. Nah disini kita aku akan menggunakan bootstrap. Sebagai catetan kita harus membuat nama tampilan ini sesuai dengan settingan di Controller <\/em>kita. Jadi kita buat dengan nama index.blade.php<\/code><\/p>\n\n\n\n
File index.blade.php<\/code><\/p>\n\n\n
\n<!doctype html>\n<html lang="en">\n\n<head>\n    <!-- Required meta tags -->\n    <meta charset="utf-8">\n    <meta name="viewport" content="width=device-width, initial-scale=1">\n\n    <!-- Bootstrap CSS -->\n    <link href="https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.1.3\/dist\/css\/bootstrap.min.css" rel="stylesheet"\n        integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">\n\n    <title>CRUD Karyawan<\/title>\n<\/head>\n\n<body>\n    <div class="container mt-5">\n        <h1 class="display-4">Data Karyawan<\/h1>\n        <table class="table">\n            <thead>\n                <tr>\n                    <th scope="col">#<\/th>\n                    <th scope="col">Nama<\/th>\n                    <th scope="col">Email<\/th>\n                    <th scope="col">Phone Number<\/th>\n                <\/tr>\n            <\/thead>\n            <tbody>\n                @foreach ($employees as $item)\n                    <tr>\n                        <th scope="row">{{ $loop->index + 1 }}<\/th>\n                        <td>{{ $item->name }}<\/td>\n                        <td>{{ $item->email }}<\/td>\n                        <td>{{ $item->phone_number }}<\/td>\n                    <\/tr>\n                @endforeach\n            <\/tbody>\n        <\/table>\n    <\/div>\n\n    <script src="https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.1.3\/dist\/js\/bootstrap.bundle.min.js"\n        integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous">\n    <\/script>\n<\/body>\n\n<\/html>\n\n<\/pre><\/div>\n\n\n
Nah, kalau dilihat di syntax diatas kita menggunakan Looping foreach<\/code>, nah looping ini digunakan untuk menampilkan semua Data Karyawan yang di Looping satu-persatu. Didalam Looping itu kita juga menggunakan ($employees as $item)<\/code>, nah $employees<\/code> ini menyesuaikan dengan yang ada di Controller kita tadi.<\/p>\n\n\n\n
Selain itu didalam kolom tabel nya kita menuliskan {{ $item->name }}<\/code> dan seterusnya. Nah ini menyesuaikan nama kolom kita di Database<\/p>\n\n\n\n
Input Data Manual<\/h3>\n\n\n\n
Langkah terakhir agar kita bisa melihat settingan kita. Kita bisa input manual Data kita lewat phpmyadmin<\/code>. Nanti ada yang kita inputkan akan terlihat saat kita menjalankan Laravel. Kurang lebih hasilnya seperti ini<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Kesimpulan<\/h2>\n\n\n\n
Nah disini kita sudah membuat Fitur CRUD pada Laravel walaupun baru selesai Part 1 saja sampai Read. Pada Part 2 kita akan membahas lanjutan Fitur CRUD pada Laravel ini dengan Fitur lain yaitu Create, Update, dan Delete. <\/p>\n\n\n\n
Sampai disini saja teman-teman Part 1 dari Artikel CRUD pada Laravel ini, Stay Tune ya untuk Part 2<\/p>\n","protected":false},"excerpt":{"rendered":"
Setelah kemarin kita mempelajari tentang Database, Faker dan Seeder. Kali ini kita akan membahas CRUD pada Laravel. Teman-teman pasti sudah Familiar dengan sistem CRUD (Create, Read, Update, Delete), CRUD ini merupakan...<\/p>\n","protected":false},"author":2,"featured_media":762,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8],"tags":[126,93,49],"class_list":["post-984","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorial","tag-crud","tag-laravel","tag-tutorial"],"_links":{"self":[{"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/posts\/984","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/comments?post=984"}],"version-history":[{"count":7,"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/posts\/984\/revisions"}],"predecessor-version":[{"id":1219,"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/posts\/984\/revisions\/1219"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/media\/762"}],"wp:attachment":[{"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/media?parent=984"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/categories?post=984"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/duniacoding.id\/blog\/wp-json\/wp\/v2\/tags?post=984"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}