Widget (Navbar, Sidebar) untuk Konten Dinamis pada Laravel 5

Dari beberapa pertanyaan tentang bagaimana cara membuat menu (nav bar, side bar, widget, footer) yang diambil dari database secara dinamis tanpa harus loading ulang pada saat penulusuran halaman lain pada sebuah website sehingga web tidak terlalu berat saat loading conten utama. Kali ini akan dibahas tentang membuat widget dinamis dengan Laravel 5.2.* yang masih sederhana agar mudah difahami.

Perhatikan skema berikut :

untuk membuat konten dinamis ada banyak trik yang dapat dilakukan, tetapi metode yang dikembangkan oleh Laravel cukup mudah dan simpel untuk diterapkan pada sebuah website bagi webmaster pemula mungkin dapat menggunakan tips ini, yaitu menggunakan View Composer

Berikut adalah langkah-langkah membuatnya:

Pastikan susunan folder laravel sudah difahami
Sudah memahami penggunaan database MySql pada Laravel 5
Tambahkan 2 buah folder di dalam folder \resources\views yaitu folder layouts dan folder includes

Buatlah file master.balde.php di dalam folder \resources\views\layouts dengan sintak seperti berikut :

{{-- resources/views/layouts/master.blade.php --}}
<!DOCTYPE html>
<html lang="id">
    <head>
        <link rel="stylesheet" href="{{ URL::asset('bootstrap/css/bootstrap.min.css') }}">  
    </head>
    <body class="hold-transition skin-yellow layout-top-nav">
        
  <header class="main-header">
  <nav class="navbar navbar-default ">
   <div class="container-fluid">
    <div class="navbar-header">
     
     <a href="http://arsipti.com" class="logo">
       
       <span class="logo-mini">A<b>TI</b></span>
      
       <span class="logo-lg">Arsip<b>TI</b>.com</span>
     </a>
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-1">
      Menu<i class="fa fa-fw fa-bars"></i>
     </button>     
    </div>
    
   </div>
        </nav>
        </header>
  <div class="container">
   @if (Session::has('message'))
    <div class="flash alert-info">
     <p class="panel-body">
      {{ Session::get('message') }}
     </p>
    </div>
   @endif
   @if ($errors->any())
    <div class='flash alert-danger'>
     <ul class="panel-body">
      @foreach ( $errors->all() as $error )
       <li>{{ $error }}</li>
      @endforeach
     </ul>
    </div>
   @endif
   <div class="row">
                @yield('content')
    @include ('includes.widget')        
            </div>
   
   <div class="row">
    <footer class="main-footer">     
     <strong>Copyright © 2016 <a href="http://arsipti.com"><span class="logo-lg">Arsip<b>TI</b>.com</span></a>.</strong> All rights reserved. 

    </footer>   
   </div>
        </div>
      
 {{-- di bawah ini script javascript jika diperlukan --}}          
    </body>
</html>

Buatlah file widget.balde.php di dalam folder \resources\views\includes dengan sintak seperti berikut :

<div class="col-md-4">
        
  <div class="box box-warning">
   <div class="box-header with-border">
                <h3 class="box-title">Kategori</h3>
                
            </div>
   <div class="box-body">
             @foreach ($kategori as $kat)
     <p><a href="{{ url('/kategori/'.$kat->id) }}">{{ $kat->kategori }}</a></p>
    @endforeach    
            </div>
        </div>
</div>

Buka file AppServiceProvider.php dari \app\Providers dan sesuaikan sintaknya seperti contoh di bawah atau jika sudah dipahami silahkan bereksperimen sendiri

<?php

namespace App\Providers;
//masukan tabel
use App\TabelKategori;
//akhir tamabahan
use Illuminate\Support\ServiceProvider;


class AppServiceProvider extends ServiceProvider
{
    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        //membuat dinamik widget agar tidak load berulang2
  view()->composer('includes.widget', function($view)
  {
   //$view->with('links', ['hello','world!']); 
   $kategori = TabelKategori::orderBy('kategori','asc')->get();
   
   $view->with('kategori',$kategori);
   
  });
    }

    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }
}

penjelasan 'includes.widget' adalah file yang akan dituju untuk disisipkan data dari tabel kategori

Langkah terakhir adalah melakukan uji coba sehingga akan tampak seperti gambar 2

Demikian tutorial singkat tentang bagaimana membuat widget dinamis dengan Laravel 5.2.* , yang dapat ditampilkan disetiap halaman pada pada sebuah website, sehingga proses loading setiap halaman web menjadi lebih cepat.

Daftar Bacaan:

https://laravel.com/docs/5.2/views#view-composers