Agen Terpercaya   Advertise
 
 
 
Pasang iklan, hanya lewat Contact Us.
Waspada penipuan iklan. Klik di sini untuk melihat daftar penipu.

SHARE BELAJAR LARAVEL [COMPLETE]

RayMantic

Moderator
Staff member
Moderator
Daftar
4 Oct 1988
Post
×
Like diterima
9.211
Bimabet


Cara menginstall Composer di Windows.
  1. Silahkan sobat download dulu composer disini.
  2. Jalankan composer.exe nya.
  3. Centang saja shell menus untuk memudahkan kita untuk menggunakan composer nanti.
  4. Next saja, sampai nanti disuruh browse PHP sobat, tinggal browse saja dan cari php.exe di C:\xampp\php\php.exe (sesuaikan dengan direktori sobat), next.
  5. Finish, Sebaiknya sobat restart dulu Windows nya.
Lalu kita install Laravel nya via composer (pastikan terkoneksi dengan internet ya sob).
  1. Masuk ke folder htdocs,
  2. Klik kanan, pilih Use Composer Here
  3. Pastekan script berikut ini :
composer create-project --prefer-dist laravel/laravel latihan-laravel


Keterangan :
  • --prefer-dist maksudnya adalah versi laravel yang direferensi kan / stabil.
  • latihan-laravel adalah nama folder yang akan kita buat.
  1. Tunggu saja proses download nya. Kalau sudah selesai.
  2. Langsung saja buka url Laravel nya di localhost (pastikan sudah Start Apache di xampp nya ya :D) :
Cara 1 :
  • masukkan url : ' localhost/latihan-laravel(sesuaikan nama nya)/public ' ,kenapa harus masuk ke folder public dulu? Karena index.php nya ada di dalam folder Public.
Cara 2 :
  • Masuk ke folder htdocs/latihan-laravel. Lalu klik kanan, use composer here, tuliskan ' php artisan serve '.
  • Ketikkan di url : localhost:8000
 


Buka url nya di browser : http://localhost:8000, Kita balik lagi ke folder Laravel nya. Jika sobat menggunakan sublime text, atom, netbeans, dll. Kita open folder nya jangan open file biar hasil nya seperti ini :
routvielar%20(1).PNG


Buka file routes.php nya, ada di App/Http/routes.php. Isi route nya pasti seperti ini :

routvielar%20(2).PNG


Pada route.php, terdapat route dengan fungsi seperti dibawah ini :
Code:
Route::get('/', function () {
    return view('welcome');
});

Script tersebut menjelaskan :
Tanda slash ( / ), artinya kita berada pada halaman utama atau index. Dan yang ada didalam return View memanggil langsung ke blade yang bernama 'welcome' tanpa memproses nya ke Controller terlebih dahulu.

Oke kita praktekkan belajar routing pada Laravel. Silahkan sobat buka routes.php dan tambahkan script berikut ini :
Kita masih menggunakan fungsi dulu ya, nanti baru pake Controller.
Code:
Route::get('/contact', function () {
    return view('contact');
});

Jadi nya seperti ini :
routvielar%20(4).PNG


miss : tidak perlu lagi menuliskan http://localhost:8000/contact.php , tapi langsung saja http://localhost:8000/contact karena itu sudah diurusin sama sistem routing nya si Laravel.
 



bagaimana cara mengoper nilai / variable, belajar mengenai Error pada Laravel, dan juga Artisan.
Ohiya, sebelum nya saya lupa beri tau kalau untuk belajar Laravel ini kita juga perlu dulu belajar mengenai OOP pada PHP. Karena banyak teman saya yang bingung saat mengikuti karena belum belajar OOP, tidak perlu terlalu dalam cukup dasar nya saja sudah bisa kok belajar Laravel ini seperti saya dulu :D
Oke kita jelaskan dulu bagaimana sih Error pada Laravel? Jadi contoh nya misalkan View Contact yang sudah kita buat, sekarang kita Hapus.

Misal :
errvieoper%20(1).jpg

Folder belajar beserta dengan contact.blade.php nya kita hapus. Lalu coba kita panggil Url nya pada browser sobat. Dan hasil nya :
errvieoper%20(1).png


Hanya terdapat tulisan Whoops, looks like something went wrong. Kurang detail kan? Bagaimana jika kita ingin membuat lebih detail Error nya seperti apa?


Kita masuk ke folder config/app.php, lalu ada tulisan 'debug' seperti dibawah ini :
errvieoper%20(2).PNG


Ubah saja FALSE menjadi TRUE, gini :

errvieoper%20(3).PNG


Kita refresh lagi url nya tadi, hasilnya akan seperti ini :

errvieoper%20(4).png


Error nya lebih detail, dan disitu menjelaskan bahwa View contact yang ada di Folder belajar tidak ditemukan. Jelas kan Error nya? Soalnya tadi file contact.blade.php dengan folder nya sudah kita hapus.
Tapi jika Website yang sobat buat ingin di hosting, dan akan diakses oleh user. Sebaiknya debug error nya di FALSE kan saja. Biar error detail nya tidak terlihat oleh user atau lebih disarankan dibuat Page 404 NotFound nya.

Sekarang kita balik ke routes.php, kita ingin membuat route about, jadi script nya seperti ini :
Code:
Route::get('/about', 'AboutController@index');

route contact dan belajarController.php nya dihapus aja ya sob, karena kita bikin controller baru dengan nama AboutController. Kita buat Controllernya menggunakan artisan lagi.

Sebelumnya saya lupa ya menjelaskan artisan itu apa? Sorry ya sob :D saya jelaskan dulu,

Artisan itu adalah command line atau perintah-perintah yang dijalankan via terminal/command prompt yang menyediakan beberapa perintah yang bisa kita gunakan saat develop aplikasi Laravel.

Bisa kita cari tau apa aja sih perintah-perintah pada artisan ini? Dengan cara mengetikkan ' php artisan ' pada CMD nya ya sob dan pastikan membuka cmd ny pada folder laravel sobat. Contoh seperti ini :
errvieoper%20(5).PNG

Disitu banyak banget list yang bisa kita gunakan dengan artisan, silahkan sobat scroll sendiri pada cmd nya dan terdapat make:controller yang sudah kita lakukan di tutorial sebelumnya, ada juga perintah route list jadi kita bisa melihat route apa saja yang ada di routes.php, dengan cara mengetikkan di cmd :
Code:
php artisan route:list

Kita kembali lagi ke tujuan kita yaitu ingin membuat AboutController, ketikkan dibawah ini :
Code:
php artisan make:controller AboutController

Kita coba menampilkan hasil route:list kita tadi jadi hasil nya seperti ini :
errvieoper%20(6).PNG


Hanya ada 2 route list , karena pada routes.php nya juga ada 2 saja.
Kita tadi sudah membuat AboutController, pada metode index kita ingin memanggil view about yang ada di folder views :
Code:
public function index() {
    return view('about');
}

Lalu kita buat dulu about.blade.php nya pada folder resources/views, kasih nama about.blade.php, struktur folder nya gini :
errvieoper%20(7).PNG


isi sembarang dulu isi dalam file about.blade.php, jika sudah coba kita panggil dulu route nya di url untuk memastikan apakah sudah benar atau belum?
errvieoper%20(8).PNG

isikan script ini pada metode index di AboutController :

Code:
public function index() {
    $coba = 'gilacoding';
        return view('about')->with('tampil' , $coba);
}


Keterangan pada With :
  • Parameter 1 nama variable yang akan kita panggil pada view blade nya.
  • Parameter 2 adalah nama variable yang akan kita oper datanya.
Sekarang pada about.blade.php untuk mendapatkan data dari Controller tadi bisa dengan cara seperti ini :
Code:
Website saya : <?= $tampil; ?>

Tapi, karena dengan Laravel sudah ada blade templating untuk menampilkan data menjadi lebih simple cukup dengan seperti ini :
Code:
Website saya : {{ $tampil }}

Sekarang kita coba oper data pake array, udah belajar array kan sob? Jadi langsung saja ikuti script nya pada AboutController seperti ini :

Code:
public function index() {
    $data['judul'] = 'gilacoding';
    $data['tanggal'] = '14-03-2012';

       return view('about')->with('tampil' , $data);
}

Di about.blade.php nya seperti ini :
Code:
<!DOCTYPE html>
<html>
<head>
    <title>Oper data</title>
</head>
<body>
Website saya : {{ $data['judul'] }} <br/>
Tanggal hosting : {{ $data['tanggal'] }}
</body>
</html>

Hasilnya :

errvieoper%20(10).PNG


Selanjutnya dengan metode lain, bagaimana kalo kita mau bikin array di dalam With? Bisa kok, gini nih contoh nya :

Code:
public function index() {
   $judul = 'gilacoding';
   $tanggal = '14-03-2012';

   return view('about')->with('data' , compact('judul', 'tanggal'));
}

Ket : yang ada di dalam compact adalah variable yang akan kita oper data nya.

Pada about.blade.php nya tetep sama seperti sebelum nya :
Code:
<!DOCTYPE html>
<html>
<head>
    <title>Oper data</title>
</head>
<body>
Website saya : {{ $data['judul'] }} <br/>
Tanggal hosting : {{ $data['tanggal'] }}
</body>
</html>

Hasilnya sama, bisa sobat tes langsung.
 


Mengenai Array yang ada di dalam with kemaren, kita mengoper data di compact ke 1 variable dengan nama 'data' , tetapi ternyata kita bisa menggunakan compact tanpa menuliskan with lagi, karena data kita hanya sedikit. Jadi contoh script nya pada AboutController metode index seperti ini :

Code:
public function index() {
    $judul = 'gilacoding';
    $tanggal = '14-03-2012';
    return view('about', compact('judul', 'tanggal'));
}

Lalu di about.blade.php nya kita hilangkan tanda array nya menjadi nama variable nya saja :
Code:
Website saya : {{ $judul }} <br/>
Tanggal hosting : {{ tanggal }}

Kita tampilkan, hasilnya memang sama saja :
bladetemp%20(1).PNG

Selanjutnya saya ingin menjelaskan mengenai Escape, Misalnya kita memasukkan data yang ada tag html atau javascript nya akan otomatis ke render kalau tidak kita escape. Contoh misal pada data di AboutController tadi isi di data judul dan tanggal nya kita beri tag italic dan juga bold :

Code:
public function index() {
    $judul = '<i>gilacoding</i>';
    $tanggal = '<b>14-03-2012</b>';
        return view('about', compact('judul', 'tanggal'));
}

Lalu pada about.blade.php :

Code:
Website saya : {{ $judul }} <br/>
Tanggal hosting : {{ $tanggal }} <br/>
<br/>
======== Tanpa Escape ======== <br/>
<br/>
Website saya : {!! $judul !!} <br/>
Tanggal hosting : {!! $tanggal !!} <br/>

hasilnya :
bladetemp%20(2).PNG



terlihat jelas kan. Yang tanpa escape tag bold dan italic nya ngerender tag html nya, {!! !!} ini saya pake juga kok karena backend nya saya nulis pake tinymce, jadi tag Paragraph, bold, italic, link, dsb. Otomatis ke render saat ditampilkan.

Kita lanjut ke Sistem Templating, misalnya kita punya beberapa halaman yang sama dan bagian header dan footer nya tetep itu-itu aja / ga berubah tapi content nya yang berubah-ubah. Biar ga bingung kita ke contoh nya langsung sob.

Buat blade baru, pada views kita buat juga folder dengan nama Templates, dan buat view nya dengan nama index.blade.php, Jadi struktur nya seperti ini :

bladetemp%20(3).PNG



Kita isi dalam index.blade.php nya gini :

Code:
<!DOCTYPE html>
<html>
<head>
    <title>Latihan Blade Templates</title>
</head>
<body>
@include('templates.header')

    @yield('content')

@include('templates.footer')
</body>
</html>


Karena disitu saya include kan header dan footer nya di file lain juga jadi kita buat lagi file header.blade.php dan footer.blade.php dalam 1 folder templates, isi nya terserah saja.

header.blade.php :
<h1>INI HEADER</h1>
footer.blade.php :
<h1>INI FOOTER</h1>
Sekarang pada about.blade.php nya harus kita extends :

Code:
@extends('templates.index')
@section('content')

Website saya : {!! $judul !!} <br/>
Tanggal hosting : {!! $tanggal !!} <br/>

@stop


Ket :
  • pada extends kita memanggil index.blade.php yang merupakan pondasi halaman html kita yang berada di folder templates/index.blade.php,
  • Lalu nama yang ada di section disesuaikan dengan @yield pada index.blade.php,
  • @stop untuk mengakhiri section.

Kita tambahkan satu contoh lagi, kita buat halaman contact. Buat file contact.blade.php di folder views sejajar dengan about.blade.php, isi nya seperti ini :
Code:
@extends('templates.index')

@section('content')
Kontak saya :
    <ul>
        <li>+6280831233</li>
        <li>+6286552212</li>
        <li>+6282099499</li>
    </ul>
@stop

routes.php kita tambahkan url contact :

Code:
Route::get('/contact', 'AboutController@contact');

Dan pada AboutController tambahkan metode contact :
Code:
public function contact() {
    return view('contact');
}

Hasilnya :

bladetemp%20(4).PNG


Sekarang misal pada contact nomor telpon nya kita jadi kan array di AboutController pada metode contact akan kita oper nomor nya ke contact.blade.php, ikuti script nya begini :

Code:
public function contact() {
    $contacts = ['+6280831233', '+6286552212', '+6282099499'];
       return view('contact')->with('contacts', $contacts);
}

Lalu di contact.blade.php nya seperti ini :

Code:
@section('content')
Kontak saya :

    @if(count($contacts))
    <ul>
        @foreach($contacts as $contact)
            <li>{{ $contact }}</li>
        @endforeach
    </ul>
    @else
            <p>Contact tidak ditemukan</p>
    @endif
@stop


Ket :
  • Jika ingin menggunakan if else pada Laravel cukup dengan @if , @elseif, @else, dan untuk mengakhiri nya @endif,
  • Fungsi dari count didalam if adalah untuk cek data Array nya apakah ada, jika ada maka tampil, jika tidak ada / else maka menampilkan text di dalam @else,
  • @foreach($contacts as @contact) fungsi nya untuk melakukan perulangan, untuk mengakhiri nya menggunakan @endforeach.

Contoh jika Array pada about.blade.php di metode contact nya kita hapus :
public function contact() {
$contacts = [];
return view('contact')->with('contacts', $contacts);
}
Maka saat kita panggil url contact yang akan tampil seperti berikut :

bladetemp%20(5).PNG


Yap, data tidak ditemukan sesuai dengan yang sudah saya jelaskan tadi.
 

Migration adalah sebuah fasilitas dilaravel digunakan untuk mempermudah kita ketika ada perubahan dalam database. Schema Builder digunakan untuk membuat sebuah skema database. Dengan menggunakan migrations dan schema builder kita tidak perlu repot – repot membuka phpmyadmin , ataupun aplikasi Sql lainnya untuk membuat database. Dengan migrations dan schema builder juga akan lebih mudah ketika kita membuat project besar dan dengan developer yang berbeda-beda jadinya si developer ini tidak perlu import/export database tapi langsung saja menggunakan migration.

Sebelum kita praktekan langsung Migration, tentunya kita harus menghubungan Aplikasi Laravel kita dengan Mysql dong? Yap cara konfigurasi database nya mudah kok, silahkan sobat buka dulu config/database.php,

Default database nya MySQL, Jika sobat menggunakan SQLite atau PostgreSQL tinggal ganti pada defaultnya dan juga di file .env, dimana file .env? Ada difolder utama saat kita buka folder Laravel kita, sejajar dengan folder app, bootstrap, config, dkk :
migrtut%20(1).PNG


Lalu untuk ganti default mysqlnya ganti disini :

migrtut%20(2).PNG


Dan juga di .env nya ganti DB_CONNECTION=mysql ke database yang sobat gunakan misal SQLite, tapi saya disini menggunakan MySQL jadi saya biarkan saja.


Dan untuk setting localhost, username, dan password nya juga bisa kok langsung di mysql dalam file database.php seperti ini :

migrtut%20(3).PNG

TAPI, cara ini tidak disarankan ya sob. Kenapa? Karena saat kita develop Aplikasi Laravel dengan beberapa teman project atau teamwork, saat temen kita buka Project kita, bakal ketauan dong username, password kita? JADI, sebaiknya di database.php nya dibiarkan default saja, lalu ganti di .env seperti ini jadinya :
migrtut%20(4).PNG

Karena saat kita upload Project kita di github atau dimana saja, .env akan dibiarkan atau tidak akan terupload, File .gitignore lah yang membuat .env tidak akan terupload, isi script nya seperti ini :
migrtut%20(5).PNG


Jadi di .gitignore itu terdapat di nama folder /vendor, folder /node_modules/ .env, dkk folder itu semua tidak akan terupload, sesuai dengan isi .gitignore nya,

Balik ke .env, saya sudah setting DB_DATABASE=laratest jadi sobat buat dulu database nya di phpmyadmin, silahkan beri nama apa saja dan sesuaikan dengan di .env, masukkan username nya, lalu password sobat, jika tidak memakai password biarkan saja DB_PASSWORD= kosong seperti itu.

Oke kita sudah selesai konfigurasi database nya, sekarang langsung kita praktekkan seperti apa fitur Migration pada Laravel itu, Saat kita install Laravel, terdapat langsung dua migration table, bisa kita lihat pada folder database/migrations/, terdapat migration create_users_table , dan satunya create_password_resets_table tapi kita tidak memakai itu , untuk contoh silahkan kita buka dulu file migration yang create_users_table.php, dan disitu hanya terdapat dua metode yaitu up dan down, fungsi metode up() untuk membuat table / membuat kolom, sedangkan down() untuk menghapus table atau kolom.

Pada metode up, terdapat Schema seperti yang sudah kita jelaskan sebelumnya, selain untuk membuat dan menghapus table dengan schema kita bisa buat spesifikasi kolom table nya misal increment, string, timestamps, dll

Sekarang kita bikin ulang migration baru, dua migration bawaan Laravel kita hapus saja dulu, lalu kita ke command line untuk membuat migration create_blogs_table, tapi pada class nya nanti akan otomatis menjadi CreateBlogsTable, ketikkan pada cmd script dibawah ini :

Code:
php artisan make:migration create_blogs_table --create=blogs

Jika hasilnya seperti ini :
migrtut%20(6).PNG

Ket :
  • create_blogs_table adalah nama migrationnya,
  • --create=blogs adalah nama untuk table nya.
Berarti kita sudah berhasil membuat migrationnya sekarang kita liat migration kita pada database/migration/,

migrtut%20(7).PNG

Kita liat isinya , dan nama class nya seperti kita bilang tadi dia otomatis menjadi CreateBlogsTable. Sekarang pada metode up kita mau isi kolom-kolom apa saja yang ada di table blogs, saya buat isinya gini :

migrtut%20(8).PNG

Lalu kita push/kita jalankan migration untuk membuat table nya pada database kita, untuk menjalankan nya ketikkan lagi pada cmd (pastikan menjalankan cmd nya pada folder Laravel) :
Code:
php artisan migrate

Hasilnya :
migrtut%20(9).PNG

Berarti kita sudah berhasil, lalu bisa sobat cek pada phpmyadmin nya di database laratest (sesuaikan dengan database sobat).
migrtut%20(10).PNG


Terdapat 2 table, table blogs dan migrations. Table migrations itu otomatis buat nyimpen data nya jadi maksudnya table migrations otomatis nyimpen / nyatat class migration apa saja yang sudah kita jalankan, sedang kan table blogs itu adalah hasil yang kita buat tadi.

Kita buka struktur table blogs tadi :
migrtut%20(11).PNG


Kita sudah menjalankan migration metode up, lalu kita ingin tau fungsi metode down? Seperti yang ada di isi down itu Schema::drop berarti akan ngehapus table terakhir yang kita jalankan tadi. Contoh nya sobat bisa menjalankan command line ini pada cmd :
Code:
php artisan migrate:rollback
Hasilnya :
migrtut%20(12).PNG


Coba sobat buka lagi pada database nya, dan table blogs sudah tidak ada. Tapi misalnya ingin mengembalikan lagi? Ya tinggal jalankan php artisan migrate tadi
 

lanjutan dari sebelumnya ya yang membahas mengenai migration dan schema, karena kita sudah membuat migration nya jadi langsung saja kita tinggal membuat model nya dulu, yaitu untuk membuat model blog. Untuk membuat model, ketikkan pada Cmd seperti ini :
Code:
php artisan make:model Blog

Lalu kita lihat pada folder Laravel kita masuk ke folder App :
eloqorm%20(1).PNG

Disitu terdapat model kita Blog dan model bawaan Laravel User, karena model user tidak terpakai mendingan dihapus saja. Lalu kita lihat pada Blog.php, masih kosong seperti ini :
eloqorm%20(2).PNG

Untuk membuat model, silahkan isi sesuai dengan yang ada di table blogs :

Code:
<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Blog extends Model
{
    protected $table = 'blogs';
    protected $fillable = ['judul', 'deskripsi'];
}

Ket :
  • protected $table = 'blogs'; adalah nama table nya.
  • protected $fillable = ['judul', 'deskripsi', 'created_at', 'updated_at']; isi kolom nya, karena ID sudah otomatis jadi tidak perlu dibuat.
  • Lalu created_at dan updated_at nya juga tidak perlu buat karena sudah otomatis juga, tapi jika sobat tidak menggunakan created dan updated_at nya bisa ditambahkan script ini public $timestamps = false; pada Model tadi.
Tambah Data
Lalu kita ingin menambahkan data dengan Eloquent ke Table Blogs melalui route, script nya gini :
Route::get('/tambah', function()
Code:
{

    $blog = new Blog; 

    $blog->judul = "Judul Pertama";

    $blog->deskripsi = "Deskripsi nya disini, contoh menambah data pada route.";

    $blog->save();   

});

Ket :
  • $blog = new Blog; $blog adalah variable nya, new Blog nama model nya.
  • $blog->judul pastikan kolom yang dituju sesuai/sama dengan yang ada di tabel nya.
  • $blog->save(); proses data nya untuk disimpan.
Jangan lupa menambahkan use App\Blog; pada routes.php , letakkan saja dibawah <?php.

Jalankan url route /tambah nya pada browser. Jika sudah, coba sobat cek pada table blogs di phpmyadmin nya :
eloqorm%20(3).PNG


Hasilnya blank putih saja karena tidak kita masukkan apa-apa tapi data sudah masuk. created_at dan updated_at nya pun sudah terisi otomatis, pada Eloquent kita tidak perlu lagi Insert Into blabla. Cukup mudah kan? :D

Update Data

Sekarang kita lakukan update data yang sudah kita masukkan tadi, jadi kita tambahkan lagi pada route nya seperti ini :
Code:
Route::get('/update', function()
{
    $blog = Blog::find(1); 
    $blog->judul = "Judul Diedit";
    $blog->deskripsi = "Deskripsi juga sudah di Edit";
    $blog->save();
});


Ket :
  • $blog = Blog::find(1); Artinya Menjalankan / Mengubah data blog yang id nya 1.
Panggil url nya, dan cek ke database, data berhasil dirubah :
eloqorm%20(4).PNG

Menampilkan Data

Setelah Coba di simpan dan diedit, sekarang coba kita tampilkan data nya menggunakan Eloquent :
Code:
Route::get('/tampil', function()
{
    $blogs = Blog::all();
    echo "<ul>";
    foreach($blogs as $blog)
    {
       echo "<li>";
       echo "<b>Judul nya</b> : ";
       echo $blog->judul;
       echo " <b>Deskripsi nya</b> : ";
       echo $blog->deskripsi;
       echo "</li>";
    }
    echo "</ul>";
});

Pastekan di routes.php ya,

Hasilnya :
eloqorm%20(5).PNG

Ket :


  • $blogs = Blog::all(); fungsi nya menampilkan semua data di table blogs.

Hapus Data

Contoh terakhir kita menghapus data, pastekan pada routes.php :
Code:
Route::get('/hapus', function()
{
    $blog = Blog::find(1);
    $blog->delete();   
});
Seperti biasa, panggil url nya dan jika sudah lihat ke database apabila data sudah tidak ada berarti udah berhasil kehapus dong :v
 


Controller juga Blade Template nya Laravel dan coba mengulas kembali yang sudah kita pelajari. Yuk ah langsung saja pertama – tama Jalankan dulu command line php artisan serve nya pada CMD, dan perlu diingat membuka CMD nya harus pada Folder Laravel yg sedang sobat jalankan.


Cara 1 :
  • Masuk ke folder Laravel yang sedang sobat kerjakan, klik kanan, pilih Use Composer Here.
Cara 2 :
  • Tahan SHIFT dan klik kanan dimana saja halaman kosong, pilih Open Command Window Here.
Cara 1 dan 2 Sama saja hasilnya, hanya saja cara 1 Jika kita saat install Composer dengan men centang Shell Menus, dan cara 2 bagi yang tidak centang Shell Menus nya.

Buka pada Browser http://localhost:8000/, Lalu kita buat url blog di routes.php :
Code:
Route::get('/blog', 'BlogController@index');
Sudah membuat url nya, kita buat lagi BlogController nya pake artisan ya biar cepet. Ingat command line nya gimana? Lupa? Gini script nya :
php artisan make:controller BlogController --resource

Isi script dibawah ini pada BlogController metode index sesuai yang akan kita panggil pada routes.php tadi :
Code:
public function index()
{
    return view('blog');
}

Kita buat lagi View untuk blog nya tapi kita masih menggunakan template yang sebelumnya jadi kita hanya membuat untuk konten nya saja.

Pada resources/views beri nama blog.blade.php, silahkan isi seperti ini :
Code:
@extends('templates.index')
@section('content')
Ini halaman Blog
@stop

Dan coba kita panggil url blog nya. Hasilnya :




mvclar%20(1).PNG

Oke ternyata udah jalan, karena sebelumnya kita sudah membuat model nya jadi kita praktekkan untuk menampilkan data nya langsung. Kembali ke BlogController metode index, silahkan ikuti script nya :

Code:
public function index()
{
    $blogs = Blog::all();
    return view('blog', compact('blogs'));
}

Jangan lupa lagi menambahkan use App\Blog; diatas class nya contoh nya :

mvclar%20(2).PNG


Balik lagi ke blog.blade.php, kita tampilkan data nya :

Code:
@extends('templates.index')
@section('content')

@if(count($blogs))
    <ul>
        @foreach($blogs as $blog)
            <li>Judul : {{ $blog->judul }}</li>
        @endforeach
    </ul>
    @else
    <p>Post tidak ada.</p>
@endif

@stop
hasilnya :
mvclar%20(3).PNG


Yap, data saya hanya satu. Sekarang coba sobat tambahkan beberapa dulu manual di table Blogs nya.

mvclar%20(4).PNG

Sekarang saya mempunyai 3 data. Kita mau menampilkan data tertentu berdasarkan ID nya saja, caranya coba sobat ke routes.php dulu dan tambahkan :

Lalu ke BlogController, buat metode baru dengan nama sesuai di routes.php yaitu tampilkanID. Isinya seperti ini :

Code:
public function tampilkanID($id)
{
    $tampilkan = Blog::find($id);
    return view('tampilkan', compact('tampilkan'));
}

Ket :
  • Pada metode tampilkanID diberi parameter $id untuk ngedapetin ID nya dari route.
  • Blog::find($id); seperti yang sudah dijelaskan sebelumnya, table blog mencari dan menampilkan sesuai dengan ID yang dicari.

Lalu kita buat lagi view baru, diberi nama tampilkan.blade.php pada folder resources/views. Ikuti script nya seperti dibawah ini :

Code:
@extends('templates.index')
@section('content')

<h4>Lihat Data</h4>
ID nya : {{$tampilkan->id}}, <br/>
Judul nya : {{$tampilkan->judul}}, <br/>
Dibuat : {{$tampilkan->created_at}}, <br/>
Diedit : {{$tampilkan->updated_at}}

@stop
Jadi untuk menampilkan data berdasarkan ID nya kita tinggal tuliskan manual di url nya http://localhost:8000/blog/1 , maka hasilnya :
mvclar%20(5).PNG


Kita coba lagi untuk memanggil dengan nomor ID 3 :

mvclar%20(6).PNG

Yap, yang tampil sesuai dengan ID yang kita panggil. Lalu kita menampilkan data berdasarkan ID tapi tidak menuliskan nya dengan manual di url, kita mau panggil sebagai link? Gampang kok, sekarang sobat buka lagi blog.blade.php, tambahkan link di list li nya :

Code:
@extends('templates.index')
@section('content')

@if(count($blogs))
<h4>List data</h4>
    <ul>
        @foreach($blogs as $blog)
            <li><a href="{{ url('blog',$blog->id) }}">Judul : {{ $blog->judul }}</a></li>
        @endforeach
    </ul>
    @else
    <p>Post tidak ada.</p>
@endif

@stop

Ket :


  • Untuk memanggil Link di Blade kita tinggal menuliskan {{ url('urlyangdiinginkan') }},
  • <a href="{{ url('blog',$blog->id) }}"> </a> maksudnya kita menuju ke url Blog dengan id yang diambil dari list hasil dari perulangan di table blogs.

Hasilnya jika kita panggil url blog, list li nya menjadi link :

mvclar%20(7).PNG


Coba kita klik list data ke dua dengan judul Burung kakak tua, hasilnya :

mvclar%20(8).PNG

Maka data Burung kakak tua yang akan tampil, sesuai dengan link yang kita klik tadi.
 


CRUD Laravel hanya dalam waktu 5 menit ya kurang lebih segitu lah jika koneksi nya cepet :D, lebih tepatnya sih cuman ngasih tau aja bukan tutorial :D

Emang bisa ya? Bisa dong, asal terkoneksi dengan internet ya sob dan harus teliti karena kita mainan copy – paste nih lumayan banyak, yuk kita praktekkan.

Cara pertama silahkan install dulu laravel nya :
Code:
composer create-project --prefer-dist laravel/laravel latihan-crud
Sudah bisa kan install, setting koneksi, routing Laravel? Kalau belum silahkan di ubek – ubek dulu ya sob di tutorial sebelum nya.

Lanjut, silahkan beri nama apa saja, lalu kita masuk ke folder laravel, setting dulu koneksi ke database nya, buat database nama nya 'latihan-crud'


Jika sudah mengatur koneksi ke database nya di .env dan sudah membuat database di phpmyadmin, kembali ke dalam folder Laravel yang sudah sobat buat tadi dan klik kanan di area kosong, use composer here dan jalankan command line :

Code:
composer require appzcoder/crud-generator

Hasilnya :

crd5mnt%20(1).PNG

Buka file app.php di config/app.php Lalu pastekan dibawah ini dibagian providers ya scroll kebawah, jangan sampe salah paste :
Code:
Appzcoder\CrudGenerator\CrudGeneratorServiceProvider::class,

Paste lagi command line dibawah ini dan enter pada cmd nya :
Code:
composer require laravelcollective/html


Hasilnya seperti ini :

crd5mnt%20(3).PNG



Sudah lagi? Ya kita main paste lagi deh di app.php pada providers :
Code:
Collective\Html\HtmlServiceProvider::class,

Dan ini di bagian aliases masih di app.php ya :
Code:
'Form'   => Collective\Html\FormFacade::class,
'HTML'   => Collective\Html\HtmlFacade::class,
Dan ketikkan composer update di cmd. Selesai composer update, kita Publish config file & generator template files nya dengan cara menuliskan script ini di cmd lagi :
Code:
php artisan vendor:publish
crd5mnt%20(4).PNG


Paste lagi command line dibawah ini ke cmd :

Code:
php artisan crud:generate Posts --fields="title#string, body#text"

Lalu kita publish table nya, dengan cara menjalankan lagi command line dibawah ini :

Code:
php artisan migrate

Terakhir jalankan php artisan serve, dan di jalankan url http://localhost:8000/posts .

Hasilnya :

crd5mnt%20(2).PNG


Sekarang kita coba tambah dengan mengklik Add New Post :

crd5mnt%20(5).PNG


Hasil setelah ditambah :

crd5mnt%20(6).PNG


Kita juga bisa untuk lihat lebih detail data nya dengan mengklik link pada title :

crd5mnt%20(7).PNG
 

Pertama tuliskan command line dibawah ini ke cmd, ingat cmd nya harus dibuka di dalam project laravel seperti yang sudah saya jelaskan di tutorial sebelumnya, oke.
php artisan make:auth

Jika sudah, hasil nya akan seperti ini :

loginlaravel5-2%20(1).PNG


bisa cek ke dalam folder resources/views/auth , disitu terdapat halaman register.blade.php , login, folder email dan password. Abaikan saja dulu yg penting udah ada view nya.


Setelah itu, ketikkan command line lagi untuk membuat table users bawaan laravel nya :

php artisan migrate
Kalau sudah berhasil di migrate, Udah deh tinggal ketik lagi command line php artisan serve, dan buka url nya yg ada di cmd ke browser, misal http://localhost:8000/ dan akan muncul langsung halaman seperti ini :
loginlaravel5-2%20(2).PNG


Untuk membuat akun bisa langsung klik register, isi kan form – form nya. Langsung saja klik button register.

loginlaravel5-2%20(3).PNG


Akan otomatis login setelah kita daftar, jika ingin memastikan silahkan logout dulu dan langsung klik menu login disamping register.

loginlaravel5-2%20(4).PNG

sekarang kita berhasil login. Selanjutnya kita ingin mengganti login default dengan email menjadi username? Buka dulu table users di phpmyadmin atau apapun sistem database yg sobat pake, tambahkan kolom username, contoh nya :
loginlaravel5-2%20(5).PNG


Sudah? Tambahkan username ke model nya ada di app/user.php, seperti ini :

loginlaravel5-2%20(6).PNG

Selanjutnya kita tambahkan di AuthController method validator terdapat pada folder App/Http/Controllers/Auth/AuthController.php, tambahkan saja gini :
loginlaravel5-2%20(7).PNG


Dan di method create ada dibawah, scroll saja kebawah sedikit ikuti seperti ini script nya :

PHP:
protected function create(array $data)
    {
        return User::create([
            'name' => $data['name'],
            'username' => $data['username'],
            'email' => $data['email'],
            'password' => bcrypt($data['password']),
        ]);
    }
}

Di form nya registernya ubah juga, silahkan masuk ke resources/views/auth/register.blade.php, tambahkan text field username :

PHP:
<div class="form-group{{ $errors->has('username') ? ' has-error' : '' }}">
   <label class="col-md-4 control-label">Username</label>

    <div class="col-md-6">
       <input type="text" class="form-control" name="username" value="{{ old('username') }}">

       @if ($errors->has('username'))
          <span class="help-block">
             <strong>{{ $errors->first('username') }}</strong>
          </span>
       @endif
    </div>
</div>

Langsung di paste saja dibawah Text field name, contoh hasil :

loginlaravel5-2%20(8).PNG


Setelah di form register, lalu di form login lagi ubah email jadi username seperti ini :

loginlaravel5-2%20(9).PNG


Langsung saja ya di ganti, ingat type nya ganti jadi text jangan email.


Ohya saya lupa nih kelewatan, kembali ke App/Http/Controllers/Auth/AuthController.php, paste kan script dibawah ini :

protected $username = 'username';

Dibagian yang ini yah :

loginlaravel5-2%20(10).PNG


Selesai deh (harusnya sih udah bisa, kalau enggak ada error ya :v), coba kita panggil lagi di browser.


Register dulu dong, kan kita tadi baru bikin kolom nya :

loginlaravel5-2%20(11).PNG


Coba klik button register kalo sudah diisi, berhasil deh register nya. Coba sekarang kita logout dan login menggunakan username yang telah terdaftar tadi :

loginlaravel5-2%20(12).PNG


Kalo saya sih berhasil, tapi jika kalian belum berhasil pastikan username nya sudah masuk ke table users ya di database :

loginlaravel5-2%20(14).PNG

loginlaravel5-2%20(13).PNG


Jika belum masuk berarti, kalian kurang teliti mengenai name=”username” di text field register.blade.php, atau di AuthController nya ada yg kurang / salah, namun jika berhasil masuk ke database tapi enggak bisa login? Kesalahan bisa jadi pada AuthController belum nambahin ini protected $username = 'username'; atau yang lain, Yah intinya yg teliti ya sob.


Sekarang coba kita tampilin data user yang login di bagian body, silahkan masuk ke folder resources/views/home.blade.php , tambahkan script nya gini :
loginlaravel5-2%20(15).PNG


Hasilnya pilih menu navigasi Home ada di panel atas :

loginlaravel5-2%20(16).PNG

Gampang saja kan? Ohiya, kita mau buat Hak Akses yah atau jabatan? Cara nya sama seperti nambahkan username tadi kok, kalian cukup nambahkan kolom di table users , tambahkan kolom jabatan, lalu pada register.blade.php kalian tambahkan juga di model, dll Contoh :
Table users :

loginlaravel5-2%20(17).PNG


Model nya :

loginlaravel5-2%20(18).PNG


AuthController method Validator :

loginlaravel5-2%20(19).PNG


AuthContoller method Create :

loginlaravel5-2%20(20).PNG


Register.blade.php :

loginlaravel5-2%20(21).PNG


Hasilnya :

loginlaravel5-2%20(22).PNG

Yap saya menggunakan select option untuk pilihan jabatan nya. Klik saja deh button register.


Setelah itu, Pastikan dulu di database udah masuk belum kolom jabatan nya? Kalau belum bisa di cek lagi yang teliti ya, kalau belum bisa juga mungkin saya ada yang lupa ngasih tau? Tinggal comment dibawah ya.


Di saya sih udah berhasil masuk nih :

loginlaravel5-2%20(23).PNG


Jadi saya langsung saja ya, kita ke home.blade.php , ikuti seperti ini script nya :

loginlaravel5-2%20(24).PNG


Yang sebelum nya menampilkan data diri dihapus aja biar ga pusing, ganti seperti diatas ya. Fungsinya untuk apa? Yaitu tadi, jika dia login sebagai ADMIN maka yang akan muncul Ini halaman admin! Tapi jika dia bukan admin / else maka yang tampil Halaman Member!


Silahkan pilih menu Home dan Hasilnya :

loginlaravel5-2%20(25).PNG

Gimana nih sob? Udah paham belum? Gampang aja kan? Gampang dong, kalau diulang – ulang terus yang kurang paham nya. Intinya sih teliti ya :D
 


Sebelum saya membahas mengenai Custom Page Error 404 Laravel saya mau ngucapin terimakasih dulu nih buat yang udah jadi visitor setia nya gilacoding dan memberikan respon yang baik di comment website maupun inbox di fb saya :D

Okedeh langsung saja cara nya simple tapi sangat berguna jika aplikasi kita nantinya akan di buka oleh user. Kan ga enak kalau user coba buka halaman yang tidak ditemukan dan hasilnya seperti ini :
lar404%20(1).PNG


Lebih enak kan gini :



Gimana? Yuk, Coba sobat ke app/Exception/Handler.php , dan paste script ini di method render :

Code:
if($e instanceof NotFoundHttpException)
    {
      return response()->view('errors.404', [], 404);
    }

Jangan lupa untuk menambahkan use nya ini di atas ya (biasa banyak yang inbox saya error, karena lupa nambahin use nya :p)

Code:
use Symfony\Component\HttpKernel\Exception\NotFoundHttpException;

Script method render jadi nya gini :

lar404%20(3).PNG


Disitu terdapat return response()->view('errors.404', [], 404); , dia akan menampilkan view di folder errors lalu ke 404.blade.php, karena belum ada view nya silahkan dibuat dulu view nya di resources/views/errors beri nama 404.blade.php,


Isinya terserah, contoh seperti ini :

Code:
<!DOCTYPE html>
<html>
    <head>
        <title>Page Not Found.</title>

        <link href="https://fonts.googleapis.com/css?family=Lato:100" rel="stylesheet" type="text/css">

        <style>
            html, body {
                height: 100%;
            }

            body {
                margin: 0;
                padding: 0;
                width: 100%;
                color: #B0BEC5;
                display: table;
                font-weight: 100;
                font-family: 'Lato';
            }

            .container {
                text-align: center;
                display: table-cell;
                vertical-align: middle;
            }

            .content {
                text-align: center;
                display: inline-block;
            }

            .title {
                font-size: 72px;
                margin-bottom: 40px;
            }
        </style>
    </head>
    <body>
        <div class="container">
            <div class="content">
                <div class="title">Oops.. Halaman tidak ditemukan.</div>
            </div>
        </div>
    </body>
</html>
Jika sudah saya coba memanggil http://localhost:8000/hemo harusnya kan http://localhost:8000/home dan hasilnya :
lar404%20(4).PNG

Berhasil deh! :D Jika ingin lebih menarik sobat bisa buat design nya di photoshop dengan icon – icon apa saja atau dengan menggunakan css saja biar lebih ringan.
 

Karena saya menggunakan css materialize jadi sobat bisa download dulu css nya disini, jika sobat tidak menggunakan materialize bisa saja di skip, dan silahkan menggunakan css yg lainnya. Pertama – tama ini adalah folder dari materialize yang saya download :
laravelcrudpart1%20(1).PNG

Silahkan di copy paste semua folder nya ke dalam Project Laravel di folder Public, ingat ya didalam folder Public nya Laravel, hasil setelah di paste :
laravelcrudpart1%20(2).PNG


Buat Controller nya dengan nama CrudController.php, buat nya bisa manual atau lebih baik menggunakan artisan, belum tau artisan apa? Ayo jangan malas membaca, sudah saya jelaskan kok :v


Pastekan command line ini ke cmd nya :

php artisan make:controller CrudController --resource
Jika sudah, kita buka controller nya di app/Https/Controllers, buka CrudController.php nya, kita ke method index, untuk memanggil view kita :
return view('show');

Lalu buat routes.php nya, hapus route welcome ganti dengan route ini :

Route::get('/', 'CrudController@index');

Setelah itu kita coba buat desain nya dulu / view nya dengan ekstensi blade.php pastinya, silahkan sobat copy paste saja hasil yg sudah saya buat, ohiya naroh view nya di dalam folder resources/views ya, tapi sebelum saya buat, saya akan membagi view nya view utama, view untuk header dan view content blade templating, sudah saya jelaskan juga kok di post sebelumnya :v


Silahkan sobat ke folder resources/views dan buat folder baru dengan nama layouts, dan buat view nama nya index.blade.php, isi nya :

Code:
<!DOCTYPE html>
<html>
<head>
    <title>Gilacoding | CRUD Laravel 5.2 dengan Materializecss</title>
    <link rel="stylesheet" href="{{asset('css/materialize.min.css')}}">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    @section('css')

    @show
</head>
<body>
@section('header')
    @include('layouts.header')
@show

<div class="container">
    @yield('content')
</div>

<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="{{asset('js/materialize.min.js')}}"></script>
<script type="text/javascript">
    (function($){
  $(function(){

    $('.button-collapse').sideNav();

  }); // end of document ready
})(jQuery); // end of jQuery name space
</script>
</body>
</html>

Untuk memanggil file css / js kita menggunakan {{ asset(‘dir/filenya/disini.css’) }} letakkan di dalam href nya.


Lalu header.blade.php buat di folder resources/views/layouts :

Code:
<nav class="pink accent-3" role="navigation">
    <div class="nav-wrapper container"><a id="logo-container" href="#" class="brand-logo">Gilacoding</a>
      <ul class="right hide-on-med-and-down">
        <li><a href="{{ url('/')}}">Home</a></li>
      </ul>

      <ul id="nav-mobile" class="side-nav">
        <li><a href="{{ url('/')}}">Home</a></li>
      </ul>
      <a href="#" data-activates="nav-mobile" class="button-collapse"><i class="material-icons">menu</i></a>
    </div>
  </nav>
Dan buat juga show.blade.php buat nya di folder resources/views aja :

Code:
@extends('layouts.index')
@section('content')

<div class="section">
    <div class="card-panel purple darken-3 white-text">Tutorial CRUD Laravel 5.2 dengan Materializecss</div>
</div>

<div class="section">
    <div class="row">
        <div class="col s12">
            <h5>Judul nya disini</h5>

            <div class="divider"></div>
            <p>Sriracha biodiesel taxidermy organic post-ironic, Intelligentsia salvia mustache 90's code editing brunch. Butcher polaroid VHS art party, hashtag Brooklyn deep v PBR narwhal sustainable mixtape swag wolf squid tote bag. Tote bag cronut semiotics,</p>
                
            <button class="btn btn-flat pink accent-3 waves-effect waves-light white-text">Readmore <i class="material-icons right">send</i></button>
            <button class="btn btn-flat purple darken-4 waves-effect waves-light white-text">Edit <i class="material-icons right">mode_edit</i></button>
            <button class="btn btn-flat red darken-4 waves-effect waves-light white-text">Delete <i class="material-icons right">delete</i></button>
        </div>
    </div>

    <div class="row">
        <div class="col s12">
            <h5>Judul nya disini</h5>

            <div class="divider"></div>
            <p>Sriracha biodiesel taxidermy organic post-ironic, Intelligentsia salvia mustache 90's code editing brunch. Butcher polaroid VHS art party, hashtag Brooklyn deep v PBR narwhal sustainable mixtape swag wolf squid tote bag. Tote bag cronut semiotics,</p>
                
            <button class="btn btn-flat pink accent-3 waves-effect waves-light white-text">Readmore <i class="material-icons right">send</i></button>
            <button class="btn btn-flat purple darken-4 waves-effect waves-light white-text">Edit <i class="material-icons right">mode_edit</i></button>
            <button class="btn btn-flat red darken-4 waves-effect waves-light white-text">Delete <i class="material-icons right">delete</i></button>
        </div>
    </div>
    <div class="row">
        <div class="col s12">
            <h5>Judul nya disini</h5>

            <div class="divider"></div>
            <p>Sriracha biodiesel taxidermy organic post-ironic, Intelligentsia salvia mustache 90's code editing brunch. Butcher polaroid VHS art party, hashtag Brooklyn deep v PBR narwhal sustainable mixtape swag wolf squid tote bag. Tote bag cronut semiotics,</p>
                
            <button class="btn btn-flat pink accent-3 waves-effect waves-light white-text">Readmore <i class="material-icons right">send</i></button>
            <button class="btn btn-flat purple darken-4 waves-effect waves-light white-text">Edit <i class="material-icons right">mode_edit</i></button>
            <button class="btn btn-flat red darken-4 waves-effect waves-light white-text">Delete <i class="material-icons right">delete</i></button>
        </div>
    </div>

</div>


<div class="fixed-action-btn horizontal" style="bottom: 45px; right: 24px;">
    <a class="btn-floating btn-large red">
      <i class="large material-icons">add</i>
    </a>
  </div>


@endsection
Okedeh sekarang coba di jalankan dulu sob

Note : PASTIKAN TERKONEKSI DENGAN INTERNET YAA, karena Jquery dan Icon nya saya import dari luar sob.


Kita baru buat routing, view, dan controller nya sekarang kita lanjut ke database nya, buat dulu database nya dengan nama belajar-crud, dan setting koneksi nya di .env jangan di .env.example ya setting seperti ini :

laravelcrudpart1%20(4).PNG


DB_PASSWORD saya kosongi karena database saya tidak menggunakan password, lanjut deh kita buat table nya dengan migration ya, hmm bisa aja sih langsung bikin di phpmyadmin table nya, jika sobat langsung buat nya di phpmyadmin, bisa di skip saja sob.


Note : Setelah setting .env, php artisan nya harus di restart. (wajibb!)

Kita mau buat table dengan nama crud, paste commandline ke cmd nya ya :

php artisan make:migration create_crud_table --create=crud
Lalu ke database/migrations, terdapat juga migration create_user dan create_password, hapus saja sob sisakan create_crud yang kita buat tadi, buka create_crud nya kita mau buat kolom table nya, dan paste di method up :

Code:
Schema::create('crud', function (Blueprint $table) {
            $table->increments('id');
            $table->string('judul');
            $table->text('isi');
});

Hasil :

laravelcrudpart1%20(5).PNG


Jika sudah dibuat migration nya, kita akan migrate atau push ke database kita table nya tadi dan pastikan sudah dihapus migration lainnya selain create_crud tadi ya, paste di cmd :

Code:
php artisan migrate

Hasil setelah di jalankan perintah cmd nya :

laravelcrudpart1%20(6).PNG


Untuk memastikan table nya sudah masuk atau belum, kita cek dulu, di saya sih udah masuk.

laravelcrudpart1%20(7).PNG

Karena udah masuk kita langsung buat lagi model nya table crud. Caranya?


Paste lagi di command line nya :

Code:
php artisan make:model Crud

Kalo buat model nya berhasil, akan keluar command line Model created successfully.


Selanjutnya buka App/Crud.php, ikuti seperti ini :

laravelcrudpart1%20(8).PNG


Ket :
  • protected $table = 'crud'; adalah nama table nya
  • protected $primaryKey = 'id'; primary key dari table crud
  • protected $fillable = ['judul', 'isi']; isi kolom dari table crud
  • public $timestamps = false; ini di false kan jika sobat tidak menggunakan created_at dan updated_at otomatis.
Kita coba menampilkan data nya dulu dari database, karena kita belum buat add edit delete datanya jadi kita isi manual dulu di database nya ya contoh :
laravelcrudpart1%20(9).PNG


Sekarang kita sudah punya 1 data :

laravelcrudpart1%20(10).PNG

Kita coba tampilkan data kita di show.blade.php, caranya kita ke CrudController dulu sob ke method index, ikuti script nya seperti ini :
laravelcrudpart1%20(11).PNG


Setelah itu jangan lupa panggil model Crud nya dengan Use App\Crud; di paling atas ya dibawah namespace.

Ket :
  • Crud:: adalah Model yg kita buat tadi
  • orderBy('id', 'DESC') untuk mengurutkan tampilan nya berdasarkan id
  • paginate(14); kita akan menampilkan 14 data dan setelah itu akan otomatis membuat PAGING, yap dengan Laravel kita sangat mudah untuk membuat Paging nya sob

Kembali ke show.blade.php, kita mau menampilkan data nya dari database, class row yang kita ulang tadi dihapus saja sisakan 1 jadi nya script keseluruhan show.blade.php seperti ini :
Code:
@extends('layouts.index')
@section('content')

<div class="section">
    <div class="card-panel purple darken-3 white-text">Tutorial CRUD Laravel 5.2 dengan Materializecss</div>
</div>

<div class="section">
    @foreach($datas as $data)

    <div class="row">
        <div class="col s12">
            <h5>{{ $data->judul }}</h5>

            <div class="divider"></div>
            <p>{!!substr($data->isi,0,200)!!}...</p>
                
            <a class="btn btn-flat pink accent-3 waves-effect waves-light white-text">Readmore <i class="material-icons right">send</i></a>
            <a class="btn btn-flat purple darken-4 waves-effect waves-light white-text">Edit <i class="material-icons right">mode_edit</i></a>
            <a class="btn btn-flat red darken-4 waves-effect waves-light white-text">Delete <i class="material-icons right">delete</i></a>
        </div>
    </div>
    @endforeach

</div>


<div class="fixed-action-btn horizontal" style="bottom: 45px; right: 24px;">
    <a class="btn-floating btn-large red">
      <i class="large material-icons">add</i>
    </a>
  </div>


@endsection

Ket :


  • disitu terdapat foreach,fungsi nya buat ngelooping data dari database, ingat tutup @endforeach nya dibawah tutup div class row ya,
  • {!!substr($data->isi,0,200)!!} ini fungsi nya untuk meringkas data nya misalkan melebhi 200 huruf.

Hasilnya :

laravelcrudpart1%20(12).PNG
 


lanjutan sebelumnya, masih membahas mengenai CRUD karena sebelumnya kita baru menampilkan data, sekarang kita selesaikan Update, Delete dan Add data nya,

Langsung saja kita ke CrudController pada metode create, ikuti script nya seperti ini :

Code:
return view('add');

Buat route nya di routes.php :

Code:
Route::get('/add', 'CrudController@create');

Lalu buat view baru sesuai di metode create tadi dengan nama add.blade.php, Simpan view nya di resources/views lalu isi nya gini :

Code:
@extends('layouts.index')
@section('content')

<div class="section">
    <div class="card-panel purple darken-3 white-text">Tutorial CRUD Laravel 5.2 dengan Materializecss</div>
</div>

<div class="section">
  <form action="{{ url('store') }}" method="POST">
  {!! csrf_field() !!}
    <div class="row">
          <div class="input-field col s12">
            <input type="text" class="validate" name="judul">
            <label for="title">Judul</label>
          </div>
    </div>
      <div class="row">
        <div class="input-field col s12">
          <textarea id="textarea1" class="materialize-textarea" name="isi"></textarea>
          <label for="textarea1">Isi</label>
        </div>
      </div>
      <button type="submit" class="btn btn-flat pink accent-3 waves-effect waves-light white-text right">Submit <i class="material-icons right">send</i></button>
  </form>
</div>

@endsection
Ingat ya di tag input nya ditambahkan name=”judul” maupun di tag textarea ditambahkan name=”isi”, kalo ga diisi / salah name nya, data ga akan masuk sob, pada tag form juga pastikan ditambahkan method=”POST”, action nya nanti adalah url tujuan kita untuk memproses tambah data.


Ket :
  • {!! csrf_field() !!} mengamankan form inputan kita, jangan sampe ketinggalan sob

Jika sudah kita ke show.blade.php, paling bawah pada class fixed-action-btn di bagian tag link, tambahkan route add kita tadi jadi nya :

crudsdp2%20(1).PNG

Sekarang kita coba klik ini :
crudsdp2%20(2).PNG


Akan mengarahkan ke view add kita tadi. Hasil view nya seperti ini :

crudsdp2%20(3).PNG

Udah tampil tapi belum bisa masukin data nya ke database, kok bisa? Kan kita belum buat proses sama route store nya :v yaudah kita ke route dulu buat route nya gini :
Code:
Route::post('/store', 'CrudController@store');
Route nya menggunakan post ya bukan get, karena kita mau ngirim data bukan ngedapetin data. Jika sudah, kita ke CrudController.php lagi, pada metode store yang teliti ya harus seperti ini :
Code:
$this->validate($request, [
      'judul' => 'required',
      'isi' => 'required'
]);

     $tambah = new Crud();
     $tambah->judul = $request['judul'];
     $tambah->isi = $request['isi'];
     $tambah->save();

     return redirect()->to('/');
crudsdp2%20(4).PNG


Ket :
  • $tambah = new Crud(); artinya kita mau buat row baru dari model Crud dan variable tambah sebagai parameter nya.
  • $tambah->judul , artinya ' table Crud kolom judul ' ini sesuaikan penulisan dengan yg ada di kolom database kita
  • $request['judul']; kita request dengan name judul sesuai dengan name form di tag input kita tadi
  • $tambah->save(); proses save ke database, jadi kita ga perlu lagi insert into blabla :v
  • return redirect()->to('/); jika sudah menjalankan perintah diatas nya, dia akan redirect ke route index.
Sudah lagi sob? Apa masih ketinggalan? :v kalo udah tinggal kembali ke browser, refresh buka url add, lalu coba isi dan klik submit.
crudsdp2%20(5).PNG

Hasilnya
crudsdp2%20(6).PNG

Yap, Data pastinya berhasil masuk (karena sebelum saya publish, saya coba biar kalo ada error saya benerin dulu :v) , okedeh kita ke show.blade.php lagi, di bagian tag link readmore tambahkan link read gini :
Code:
<a href="{{ url('read', $data->id) }}" class="btn btn-flat pink accent-3 waves-effect waves-light white-text">Readmore <i class="material-icons right">send</i></a>
Ket :
  • {{ url('read', $data->id) }} artinya kita akan ke url read dengan id contoh : http://localhost:8000/read/1 , 1 itu adalah ID nya data itu.
Tambah lagi route nya :
Code:
Route::get('/read/{id}', 'CrudController@show');

Pada CrudController metode show sudah terdapat variable $id, dan di route tadi juga ada {id}, emang kenapa? Ya karena kita mau nampilin data nya berdasarkan id yang kita pilih, lanjut ke metode show ini isi nya ikuti :

Code:
public function show($id)
    {
        $tampilkan = Crud::find($id);
        return view('tampil')->with('tampilkan', $tampilkan);
    }

Ket :
  • Crud::find($id); artinya sama dengan select * from crud where id = $id, tapi dengan laravel lagi – lagi sangat singkat cukup menggunakan Find :v tapi setau saya ini hanya untuk ID kalo mau menampilkan berdasarkan kategori misal nya menggunakan Crud::where('kategori', 'Laravel')->first();
Sekarang buat lagi view nya simpan di resources/views dengan nama tampil.blade.php :
Code:
@extends('layouts.index')
@section('content')

<div class="section">
    <div class="card-panel purple darken-3 white-text">Tutorial CRUD Laravel 5.2 dengan Materializecss</div>
</div>

<div class="section">
    
    <div class="row">
        <div class="col s12">
            <h5>{{ $tampilkan->judul }}</h5>

            <div class="divider"></div>
            <p>{!! $tampilkan->isi !!}</p>
                
        </div>
    </div>

</div>

@endsection

Bisa dilihat pada url, kita nampilin data dengan id 1.


Ohya, kita sekalian aja nampilin dengan paging, caranya? Coba kita kurangi dulu batas paging nya di metode index pada CrudController, jadi 3 aja :

crudsdp2%20(8).PNG

Lalu ke show.blade.php , taroh ini paling bawah sebelum @endsection :
Code:
{{ $datas->render() }}

Note : Variable yang di akan render sebagai paging , variable sebelum di foreach ya $datas bukan $data.


Hasil :

crudsdp2%20(9).PNG


Kalo paging nya belum muncul? Berarti…. Data nya kurang dari 3, karena di controller tadi di set buat paging per 3 data jadi setelah data ke 4 paging nya akan muncul, misal sobat setting paging nya untuk 300 data ya buat aja dulu data nya sampe 301 data baru deh muncul paging nya :v


Sekarang apalagi? Edit data atau delete data dulu? Edit dulu aja deh,

Buat lagi route nya, kita langsung buat 2 route ya, 1 route untuk menampilkan data yg mau di edit ke form, lalu 1 nya untuk proses update nya sama seperti tambah tadi.


Route nya gini :

Code:
Route::get('/edit/{id}', 'CrudController@edit');
Route::post('/update/{id}', 'CrudController@update');

Semua nya menggunakan variable id, kenapa? Ya karena yang mau kita edit kan berdasarkan id, masa iya kita edit data A tapi data B C D ikut berubah.


Selanjutnya ke metode edit dan update, di CrudController, pada metode edit :

Code:
public function edit($id)
    {
        $tampiledit = Crud::where('id', $id)->first();
        return view('edit')->with('tampiledit', $tampiledit);
    }

Dan pada metode update :

Code:
public function update(Request $request, $id)
    {
        $update = Crud::where('id', $id)->first();
        $update->judul = $request['judul'];
        $update->isi = $request['isi'];
        $update->update();

        return redirect()->to('/');
    }
Buat baru edit.blade.php copy saja isi nya dari add.blade.php tapi pada form action nya dirubah pada tag input nya juga ditambahkan value, contoh nya seperti ini :

Code:
@extends('layouts.index')
@section('content')

<div class="section">
    <div class="card-panel purple darken-3 white-text">Tutorial CRUD Laravel 5.2 dengan Materializecss</div>
</div>

<div class="section">
  <form action="{{ url('update', $tampiledit->id) }}" method="POST">
    {!! csrf_field() !!}
    <div class="row">
          <div class="input-field col s12">
            <input type="text" class="validate" name="judul" value="{{ $tampiledit->judul }}">
            <label for="title">Judul</label>
          </div>
    </div>
      <div class="row">
        <div class="input-field col s12">
          <textarea id="textarea1" class="materialize-textarea" name="isi">{{ $tampiledit->isi }}</textarea>
          <label for="textarea1">Isi</label>
        </div>
      </div>
      <button type="submit" class="btn btn-flat pink accent-3 waves-effect waves-light white-text right">Submit <i class="material-icons right">send</i></button>
  </form>
</div>

@endsection

Simpan di tempat biasa.

Ket :
  • {{ url('update', $tampiledit->id) }} artinya kita mau update data dengan id yang ditampilkan disitu, dapet id nya dari mana? Ya dari kita klik button edit tadi, kan semua data tadi memiliki id
  • Lalu variable $tampiledit bisa nampilin data dari mana? Dari controller edit, kan sudah kita deklarasikan disitu, $tampiledit = crud::where blabla, artinya dia menampilkan data dari data yang sudah kita pilih.
  • value="{{ $tampiledit->judul }}" agar text field kita saat terbuka langsung terisi data dari database. Kalau textarea kita cukup meletakkan di tengah-tengah antara tag buka dan tag tutup textarea seperti di script saya itu.

Kembali ke show.blade.php, pada link edit, tambahkan link edit seperti ini :

Code:
<a href="{{ url('edit', $data->id) }}" class="btn btn-flat purple darken-4 waves-effect waves-light white-text">Edit <i class="material-icons right">mode_edit</i></a>

Ket :
  • Kayaknya tidak ada yang perlu dijelaskan disini :v
Yap, langsung terisi sesuai dengan yang saya jelaskan tadi, setelah itu isi deh mau diganti apa aja :

crudsdp2%20(11).PNG


Hasilnyaa…..

crudsdp2%20(12).PNG


Okay, berhasil deh kita Create, Update, Read, Paging, Nyingkat data, tinggal Delete deh :v


Pada routes.php tambahin lagi route delete nya gini :

Code:
Route::get('/delete/{id}', 'CrudController@destroy');

Proses delete nya pada metode destroy :

Code:
public function destroy($id)
    {
        $hapus = Crud::find($id);
        $hapus->delete();

        return redirect()->to('/');
    }

Lalu di show.blade.php link delete nya :

Code:
<a href="{{ url('delete', $data->id) }}" onclick="return confirm('Yakin mau hapus data ini sob?')" class="btn btn-flat red darken-4 waves-effect waves-light white-text">Delete <i class="material-icons right">delete</i></a>

Ket :
  • Return confirm pada link delete fungsinya untuk memberikan alert kalo kita yakin / tidak mau delete data nya. Kan gawat kalo kita engga pake alert tiba – tiba ga sengaja ke klik link delete nya :v

Hasilnya setelah saya delete tersisa 1 data :

crudsdp2%20(13).PNG


Artinya kita berhasil sudah CRUD + Materializecss + Paging + Nyingkat data + dll, salah kata, coding, maupun lainnya , saya minta maaf ya sob. Semoga tutorial saya bermanfaat, khusus nya buat yang baru belajar.
 

saya bahas mengenai Pencarian pada Laravel untuk Instalasi, CRUD, dsb..
Code:
Route::get('query', 'CariController@search');

Lalu kita buat Controller baru dengan nama CariController, silahkan buat menggunakan artisan atau manual.

Isi dari CariController :
Code:
<?php

namespace App\Http\Controllers;


use Illuminate\Http\Request;

use App\Http\Requests;
use App\Crud;

class CariController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function search(Request $request)
    {
        $query = $request->get('q');
        $hasil = Crud::where('judul', 'LIKE', '%' . $query . '%')->paginate(10);

        return view('result', compact('hasil', 'query'));
    }
}

Ket :
  • $query = Request::get('q'); kita mau ngedapetin data dari request text field yang name nya ' q '
  • Pada variable $hasil blabla , disini proses sql pencarian di table Crud berdasarkan judul yang hasil nya mirip dengan $query kita inputkan tadi, kalo mau ditambahin pencarian nya berdasarkan isi nya juga bisa tinggal ditambahin ->orWhere(‘isi’, 'LIKE', '%' . $query . '%')
  • return view('result', compact('hasil', 'query')); hampir sama dengan kita biasa ->with('hasil', $hasil)

Selanjutnya kita buat view baru dengan nama result.blade.php, simpan di resources/views, dan isi nya :
Code:
@extends('layouts.index')
@section('content')

<div class="section">
    <div class="card-panel purple darken-3 white-text">Tutorial Pencarian Laravel 5.2 dengan Materializecss</div>
</div>

<div class="section">
@if (count($hasil))
<div class="card-panel green white-text">Hasil pencarian : <b>{{$query}}</b></div>
    @foreach($hasil as $data)
    <div class="row">
        <div class="col s12">
            <h5>{{ $data->judul }}</h5>

            <div class="divider"></div>
            <p>{!!substr($data->isi,0,200)!!}...</p>
                
            <a href="{{ url('read', $data->id) }}" class="btn btn-flat pink accent-3 waves-effect waves-light white-text">Readmore <i class="material-icons right">send</i></a>
            <a href="{{ url('edit', $data->id) }}" class="btn btn-flat purple darken-4 waves-effect waves-light white-text">Edit <i class="material-icons right">mode_edit</i></a>
            <a href="{{ url('delete', $data->id) }}" onclick="return confirm('Yakin mau hapus data ini sob?')" class="btn btn-flat red darken-4 waves-effect waves-light white-text">Delete <i class="material-icons right">delete</i></a>
        </div>
    </div>
    @endforeach

</div>

{{ $hasil->render() }}
    
@else
   <div class="card-panel red darken-3 white-text">Oops.. Data <b>{{$query}}</b> Tidak Ditemukan</div>
@endif
    



@endsection

Ket :
  • @if (count($hasil)) disini singkatnya jika data nya ditemukan maka akan muncul perintah dibawah nya menghasilkan data pencarian, @else ya berarti sebaliknya
  • {{ $hasil->render() }} ya kita mau misalkan kita melakukan pencarian dan hasil nya banyak, kita bikin paging deh

Jika sudah membuat route, CariController, result.blade.php, selanjutnya ya kita buat dulu dong form pencarian nya di show.blade.php :v
Isi dari show.blade.php kita tambahkan form pencarian seperti ini :

Code:
@extends('layouts.index')
@section('content')

<div class="section">
    <div class="card-panel purple darken-3 white-text">Tutorial Pencarian Laravel 5.2 dengan Materializecss</div>
</div>

<div class="section">
<form action="{{ url('query') }}" method="GET">
    <div class="row">
          <div class="input-field col s12">
            <input type="text" class="validate" name="q">
            <label for="title">Cari</label>
          </div>
           <button type="submit" class="btn btn-flat pink accent-3 waves-effect waves-light white-text right">Cari <i class="material-icons right">search</i></button>
    </div>
 </form>
    @foreach($datas as $data)

    <div class="row">
        <div class="col s12">
            <h5>{{ $data->judul }}</h5>

            <div class="divider"></div>
            <p>{!!substr($data->isi,0,200)!!}...</p>
                
            <a href="{{ url('read', $data->id) }}" class="btn btn-flat pink accent-3 waves-effect waves-light white-text">Readmore <i class="material-icons right">send</i></a>
            <a href="{{ url('edit', $data->id) }}" class="btn btn-flat purple darken-4 waves-effect waves-light white-text">Edit <i class="material-icons right">mode_edit</i></a>
            <a href="{{ url('delete', $data->id) }}" onclick="return confirm('Yakin mau hapus data ini sob?')" class="btn btn-flat red darken-4 waves-effect waves-light white-text">Delete <i class="material-icons right">delete</i></a>
        </div>
    </div>
    @endforeach

</div>

{{ $datas->render() }}

<div class="fixed-action-btn horizontal" style="bottom: 45px; right: 24px;">
    <a href="{{ url('add') }}" class="btn-floating btn-large red">
      <i class="large material-icons">add</i>
    </a>
 </div>


@endsection
Hasil show.blade.php :
pencalara%20(1).PNG


Kan kita punya 2 data, kita coba cari data dengan judul Lorem :

pencalara%20(2).PNG

Hasil pencarian Lorem :

pencalara%20(3).PNG


Yap, dia hanya menampilkan judul yang mirip dengan query kita inputkan tadi yaitu :

pencalara%20(4).PNG


Sekarang kita coba tulis pencarian sembarang yang data nya tidak ada pada database kita :

pencalara%20(5).PNG


Hasil :

pencalara%20(6).PNG


Kalau bermanfaat silahkan share ya sob. Terimakasih
 

tambahin form inputan file nya jadi gini keseluruhan nya :

Code:
@section('js')
<script type="text/javascript">

      function readURL(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function (e) {
                $('#showgambar').attr('src', e.target.result);
            }

            reader.readAsDataURL(input.files[0]);
        }
    }

    $("#inputgambar").change(function () {
        readURL(this);
    });

</script>

@stop

@extends('layouts.index')
@section('content')

<div class="section">
    <div class="card-panel purple darken-3 white-text">Tutorial CRUD Laravel 5.2 dengan Materializecss</div>
</div>

<div class="section">
  <form action="{{ url('store') }}" method="POST" enctype="multipart/form-data">
    {!! csrf_field() !!}
    <div class="row">
          <div class="input-field col s12">
            <input type="text" class="validate" name="judul">
            <label for="title">Judul</label>
          </div>
    </div>
    
      <div class="row">
        <div class="input-field col s12">
          <textarea id="textarea1" class="materialize-textarea" name="isi"></textarea>
          <label for="textarea1">Isi</label>
        </div>
      </div>
      <div class="row">
        <div class="col s6">
            <img src="http://placehold.it/100x100" id="showgambar" style="max-width:200px;max-height:200px;float:left;" />
        </div>
    </div>
    <div class="row">
        <div class="input-field col s6">
          <input type="file" id="inputgambar" name="gambar" class="validate"/ >
        </div>
      </div>
      <button type="submit" class="btn btn-flat pink accent-3 waves-effect waves-light white-text right">Submit <i class="material-icons right">send</i></button>
  </form>
</div>

@endsection

Ket :
  • @section('js') dan diakhiri dengan @stop, fungsi nya kita menyisipkan code javascript dan diletakkan pada base/tempat yang sudah kita siapkan untuk @section('js') ini, untuk menampilkan nya kita memerlukan script seperti ini di index.blade.php :
upldgmbarlar%20(1).PNG


Bisa aja sih kita langsung taroh javascript kita di index.blade.php tapi tentu nya itu kurang bagus dong, kan code js kita tadi cuman diperlukan saat input form nya aja kan :D


Contoh nih saya coba CTRL + U di browser saat saya buka url yang menampilkan add.blade.php :

upldgmbarlar%20(2).PNG


Tampil kan si code js kita tadi? Tapi coba kita lagi kembali ke halaman utama yang ini :

upldgmbarlar%20(3).PNG


Lalu saya coba CTRL + U disini, dan hasilnya :

upldgmbarlar%20(4).PNG


Yap, code Js kita tadi enggak tampil. Udah paham kan jadi nya penggunaan Section Js tadi? :D
  • Lalu pada <form> kita wajib menyisipkan code enctype="multipart/form-data" untuk upload file / gambar fungsi nya agar file yang kita upload itu dikenali, ini wajib ya jangan sampe lupa
  • Ohya, untuk code yang ada di dalam section js itu fungsi nya untuk preview gambar kita saat kita sudah browse di input type file tadi
  • <img src="http://placehold.it/100x100" id="showgambar" style="max-width:200px;max-height:200px;float:left;" /> disini nanti preview gambar nya, harus sama ya ID nya dengan yang ada di Js tadi yaitu showgambar
  • <input type="file" id="inputgambar" name="gambar" class="validate"/ > kalo ini ya buat browse gambar nya, pastikan name nya sesuai ya jangan lupa juga ID nya
Hasil nya dari add.blade.php setelah saya browse gambar :

upldgmbarlar%20(5).PNG


Setelah itu ya pastikan sobat sudah buat kolom baru/ sudah menyiapkan kolom gambar pada database di table nya

upldgmbarlar%20(6).PNG


Setelah itu kita ke proses nya, CrudController.php isi method store nya seperti ini :

Code:
 public function store(Request $request)
    {

        $tambah = new Crud();
        $tambah->judul = $request['judul'];
        $tambah->isi = $request['isi'];

        // Disini proses mendapatkan judul dan memindahkan letak gambar ke folder image
        $file       = $request->file('gambar');
        $fileName   = $file->getClientOriginalName();
        $request->file('gambar')->move("image/", $fileName);

        $tambah->gambar = $fileName;
        $tambah->save();

        return redirect()->to('/');
    }

Ket :
  • $file = $request->file('gambar'); disini variable buat ngedapetin gambar
  • $fileName = $file->getClientOriginalName(); ngedapetin nama asli gambarnya
  • $request->file('gambar')->move("image/", $fileName); memindahkan gambar ke folder yang sudah kita siapkan di dalam folder public / image
upldgmbarlar%20(7).PNG


Ntar kalo udah kita proses submit, foto nya pindah masuk ke folder image

upldgmbarlar%20(8).PNG


  • $tambah->gambar = $fileName; dapetin nama gambar nya buat kita kirim ke database

Setelah itu coba disubmit deh, cek ke database dan ke folder image nya udah masuk belum?

upldgmbarlar%20(9).PNG


Lalu saya coba tampilkan gambar nya di halaman depan, di show.blade.php pada foreach / perulangan nya saya tambahin tag img :

Code:
@extends('layouts.index')
@section('content')

<div class="section">
    <div class="card-panel purple darken-3 white-text">Tutorial Pencarian Laravel 5.2 dengan Materializecss</div>
</div>

<div class="section">
<form action="{{ url('query') }}" method="GET">
    <div class="row">
          <div class="input-field col s12">
            <input type="text" class="validate" name="q">
            <label for="title">Cari</label>
          </div>
           <button type="submit" class="btn btn-flat pink accent-3 waves-effect waves-light white-text right">Cari <i class="material-icons right">search</i></button>
    </div>
 </form>
    @foreach($datas as $data)

    <div class="row">
        <div class="col s12">
   <h5>{{ $data->judul }}</h5>

            <div class="divider"></div>
             <img src="{{ asset('image/'.$data->gambar)  }}" style="max-height:200px;max-width:200px;margin-top:10px;">
  
            <p>{!!substr($data->isi,0,200)!!}...</p>
                
            <a href="{{ url('read', $data->id) }}" class="btn btn-flat pink accent-3 waves-effect waves-light white-text">Readmore <i class="material-icons right">send</i></a>
            <a href="{{ url('edit', $data->id) }}" class="btn btn-flat purple darken-4 waves-effect waves-light white-text">Edit <i class="material-icons right">mode_edit</i></a>
            <a href="{{ url('delete', $data->id) }}" onclick="return confirm('Yakin mau hapus data ini sob?')" class="btn btn-flat red darken-4 waves-effect waves-light white-text">Delete <i class="material-icons right">delete</i></a>
        </div>
    </div>
    @endforeach

</div>

{{ $datas->render() }}

<div class="fixed-action-btn horizontal" style="bottom: 45px; right: 24px;">
    <a href="{{ url('add') }}" class="btn-floating btn-large red">
      <i class="large material-icons">add</i>
    </a>
 </div>


@endsection

Hasil :
upldgmbarlar%20(10).PNG

Yap, gambar nya udah tampil. Setelah tambah kita coba lagi untuk edit, ke form edit nya dulu edit.blade.php

Code:
@section('js')
<script type="text/javascript">

      function readURL(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function (e) {
                $('#showgambar').attr('src', e.target.result);
            }

            reader.readAsDataURL(input.files[0]);
        }
    }

    $("#inputgambar").change(function () {
        readURL(this);
    });

</script>

@stop

@extends('layouts.index')
@section('content')

<div class="section">
    <div class="card-panel purple darken-3 white-text">Tutorial CRUD Laravel 5.2 dengan Materializecss</div>
</div>

<div class="section">
  <form action="{{ url('update', $tampiledit->id) }}" method="POST" enctype="multipart/form-data">
    {!! csrf_field() !!}
    <div class="row">
          <div class="input-field col s12">
            <input type="text" class="validate" name="judul" value="{{ $tampiledit->judul }}">
            <label for="title">Judul</label>
          </div>
    </div>
      <div class="row">
        <div class="input-field col s12">
          <textarea id="textarea1" class="materialize-textarea" name="isi">{{ $tampiledit->isi }}</textarea>
          <label for="textarea1">Isi</label>
        </div>
      </div>
      <div class="row">
        <div class="col s6">
            <img src="{{ asset('image/'.$tampiledit->gambar) }}" id="showgambar" style="max-width:200px;max-height:200px;float:left;" />
        </div>
    </div>
    <div class="row">
        <div class="input-field col s6">
          <input type="file" id="inputgambar" name="gambar" class="validate"/ >
        </div>
      </div>
      <button type="submit" class="btn btn-flat pink accent-3 waves-effect waves-light white-text right">Submit <i class="material-icons right">send</i></button>
  </form>
</div>

@endsection

Proses edit nya lagi di CrudController method update :

Code:
 public function update(Request $request, $id)
    {
        $update = Crud::where('id', $id)->first();
        $update->judul = $request['judul'];
        $update->isi = $request['isi'];

        if($request->file('gambar') == "")
        {
            $update->gambar = $update->gambar;
        }
        else
        {
            $file       = $request->file('gambar');
            $fileName   = $file->getClientOriginalName();
            $request->file('gambar')->move("image/", $fileName);
            $update->gambar = $fileName;
        }
        
        $update->update();
        return redirect()->to('/');
    }

Ket :


  • if($request->file('gambar') == '') { } else { } artinya jika request gambar kita tadi kosong atau kita tidak browse gambar nya maka dia akan menjalankan perintah didalam if yaitu $update->gambar = $update->gambar; gambar nya masih sama seperti sebelumnya

Jika kita ubah gambar berarti dia menjalankan perintah else yaitu dapetin nama gambar, dan mindahin gambar


Hasil nya :

upldgmbarlar%20(11).PNG



NB : jangan lupa ini enctype="multipart/form-data" di <form> ya


Selesai tutorial upload gambar / foto kita kali ini ya sob, jika terdapat kesalahan kata / coding, mohon di koreksi saya dengan cara berkomentar dibawah ini.
 

sebelum saya jelaskan slug itu tadi saya mau cerita sedikit nih beberapa waktu yang lalu website gilacoding ini sempat ada yang nyoba mau nge deface / attack loh, untung nya kayaknya dia ga berhasil bobol, tapi jika ada yang berhasil bobol ntar kasih tau saya yah bug / celah nya ada dimana :D dan perlu diketahui website ini dibangun Menggunakan Laravel 5.1 bukan menggunakan wordpress, dkk tapi saya tetep perlu waspada nih karena udah ada yang nyoba attack web ini hihihi :D

Okay segitu aja cerita nya :v ntar web ini malah jadi blog curhat bukan blog tutorial lagi deh.


Okedeh langsung saja, Fungsi dari slug selain untuk memanggil data kita dengan judul, biasa nya bisa juga untuk membuat url kita SEO Friendly , jadi contoh nya kita mengetikkan text input judul nya misal “ cara membuat soto banjar ” ketika kita save maka si slug tadi akan merubah nya menjadi “ cara-membuat-soto-banjar “ yap, dia merubah spasi menjadi “ - “ kita tidak perlu lagi memanggil artikel kita menggunakan ID cukup dengan SLUG kita tadi saja, contoh nyata nya seperti web gilacoding ini


Judul nya :

sluglaravel%20(1).PNG


Lalu kita coba praktekkan dengan melakukan pencarian di google :



“ SEO adalah singkatan dari Seach Engine Optimization. Artinya adalah suatu kegiatan yang dilakukan untuk meng-OPTIMALKAN website Anda dimata search engine tadi. Suatu website yang optimal di search engine akan menang dan berada di posisi atas hasil pencarian di search engine seperti Google tadi. “


Cara menggunakan nya, silahkan buat dulu / tambahkan kolom untuk slug pada database sobat

sluglaravel%20(5).PNG


Pada model nya seperti biasa tambahkan juga kolom slug, jika sudah kita ke Controller untuk proses crud nya :


Tambah use Illuminate\Support\Str; di bagian atas crudcontroller nya, lalu pada method store nya seperti ini :

Code:
   public function store(Request $request)
    {

        $tambah = new Crud();
        $tambah->judul = $request->get('judul');
        //Judul kita jadikan slug
        $tambah->slug_judul = Str::slug($request->get('judul'));
        $tambah->isi = $request->get('isi');
        // Disini proses mendapatkan judul dan memindahkan letak gambar ke folder image
        $file       = $request->file('gambar');
        $fileName   = $file->getClientOriginalName();
        $request->file('gambar')->move("image/", $fileName);

        $tambah->gambar = $fileName;
        $tambah->save();

        return redirect()->to('/');
    }
Kita tidak perlu lagi menambahkan di bagian form blade nya, ckup mengambil request judul saja untuk dijadikan slug, setelah itu coba kita tambahkan :
sluglaravel%20(6).PNG


Hasil nya :

sluglaravel%20(7).PNG


Sekarang kita coba panggil artikel nya menggunakan slug bukan menggunakan ID lagi, kita ke routes.php


Untuk memanggil nya contoh seperti ini :

Code:
Route::get('/read/{slug}', 'CrudController@show');

Lagi ke CrudController method show :

Code:
  public function show($slug)
    {
        $tampilkan = Crud::where('slug_judul', $slug)->first();
        return view('tampil')->with('tampilkan', $tampilkan);
    }
Dan terakhir kita pada blade yang ini, silahkan sobat sesuaikan bladenya masing-masing. Readmore URL nya kita ubah dari ID artikel nya menjadi Slug :
Code:
<a href="{{ url('read', $data->slug_judul) }}" class="btn btn-flat pink accent-3 waves-effect waves-light white-text">Readmore <i class="material-icons right">send</i></a>

Hasilnya setelah kita klik slug :

sluglaravel%20(9).PNG

Bisa kita lihat pada url nya sudah menggunakan slug dan bisa menampilkan data yang kita klik tadi tanpa menggunakan ID nya lagi :D
 


Apaitu UUID? Bisa sobat baca lengkap nya di Wikipedia, secara singkat nya yang saya tau sih UUID ini Universally Unique Identifier, yap dari kepanjangan nya saja kita sudah mengetahui kalau uuid ini akan membuat/generate ID / string yang unik setiap kita generate uuid baru. Hmmm lebih kurang nya ya seperti itu sob :D

Sebaiknya langsung kita praktekkan yah biar pada nangkep maksud nya dari UUID ini

Ohya saya menggunakan package dari webpatser disini link nya ya, jika suatu saat tutor disini ga work sobat bisa kunjungi ke webpatser nya di github.
Pertama – tama silahkan buka command line di folder laravel nya dan jalankan :
Code:
composer require "webpatser/laravel-uuid:2.*"

Hasil :

uuidlara%20(1).PNG


Berarti kita udah berhasil install UUID nya, sekarang ke config/app.php pada bagian aliases tambahkan :

Code:
'Uuid' => Webpatser\Uuid\Uuid::class,

Lalu jangan lupa kita kembali dulu ke database, ubah Struktur ID kita (disini nama id saya id_crud) yang menggunakan INT dan AUTOINCREMENT menjadi VARCHAR ya intinya sih disesuaikan sendiri ya sob

uuidlara%20(2).PNG


Jika sudah, kita ke crudcontroller pada method store, kita mau id_crud kita tadi menggunakan UUID jadi cara nya gini :

Code:
public function store(Request $request)
    {
        $tambah = new Crud();

        // Disini proses generate uuid
        $tambah->id_crud = Uuid::generate(4);


        //yang ini abaikan saja
        $tambah->judul = $request->get('judul');       
        $tambah->slug_judul = Str::slug($request->get('judul'));
        $tambah->isi = $request->get('isi');
        $file       = $request->file('gambar');
        $fileName   = $file->getClientOriginalName();
        $request->file('gambar')->move("image/", $fileName);
        $tambah->gambar = $fileName;

        $tambah->save();
        return redirect()->to('/');
    }

Etsss, jangan lupa menambahkan use Uuid; diatas ya, Yasudah sekarang coba kita tambah baru lagi artikel nya, jika data sudah masuk silahkan cek ke database nya apakah id nya sudah Teracak?


Whoops, hasilnya :

uuidlara%20(4).PNG


Keren kan, id kita menjadi benar – benar unik dan susah untuk di tebak :v


Untuk proses update nya jika UUID nya tidak ingin berubah lagi cukup sepert ini :

Code:
public function update(Request $request, $id)
    {
        $update = Crud::where('id', $id)->first();

        //uuid pake yang sebelumnya
        $update->id_crud = $update->id_crud;


        //abaikan ini
        $update->judul = $request->get('judul');
        $update->slug_judul = Str::slug($request->get('judul'));
        $update->isi = $request['isi'];

        if($request->file('gambar') == "")
        {
            $update->gambar = $update->gambar;
        }
        else
        {
            $file       = $request->file('gambar');
            $fileName   = $file->getClientOriginalName();
            $request->file('gambar')->move("image/", $fileName);
            $update->gambar = $fileName;
        }
        
        $update->update();
        return redirect()->to('/');
    }

Tapi jika ingin berubah, ya generate lagi seperti di atas tadi ya sob pada method store


Sekarang cara untuk memanggil route dengan uuid tadi gimana? Cara nya sama saja sih seperti biasa jadi pada view nya contoh seperti ini :

Code:
 <a href="{{ url('read', $data->id_crud) }}" class="btn btn-flat pink accent-3 waves-effect waves-light white-text">Readmore <i class="material-icons right">send</i></a>

Pada controller method show :

Code:
public function show($id)
    {
        $tampilkan = Crud::where('id_crud', $id)->first();
        return view('tampil')->with('tampilkan', $tampilkan);
    }

Sama aja kan seperti biasa juga? Hasil nya :

uuidlara%20(3).PNG
 
COMPLETE
:D

SELAMAT BELAJAR GAN
 
Ada loker gan buat junior php laravel? Kebetulan ada pengalaman pake laravel basic crud mvc
 
Bimabet
Ada loker gan buat junior php laravel? Kebetulan ada pengalaman pake laravel basic crud mvc
 
Jav Toys
Gaple Online Indonesia
Pasang iklan hanya lewat CONTACT US
Back
Top
We are now part of LS Media Ltd