Laravel - Authentification (register)

Sibuk dengan kegiatan kantor sehari-hari dan project, akhirnya bisa kembali ngeblog, tutorial kali ini codedoct akan membahas tentang cara membuat sistem register untuk melengkapi sistem authentification yang sedang kita kembangkan.

Oke, langsung saja kita mulai tutorialnya,

Pertama, buat dua route baru, yang pertama untuk page register yang kedua untuk controller store usernya, caranya edit file web.php pada path protected/app/routes/ dengan menambahkan code berikut,

.
.
.
//login
Route::get('login', 'Controller\Auth\AuthController@indexLogin');
Route::post('login', 'Controller\Auth\AuthController@login');
Route::get('logout', 'Controller\Auth\AuthController@logout');
Route::get('register', 'Controller\Auth\AuthController@indexRegister');
Route::post('register', 'Controller\Auth\AuthController@register');
.
.
.

Selanjutnya, buat dua function method baru yang pertama untuk menampilkan page register yang kedua untuk store user, dengan cara edit file AuthController.php pada path protected/app/controllers/auth/ dengan menambahkan function method berikut,

.
.
.
public function indexRegister()
 {
  return View::make('auth.register');
 }

 public function register()
 {
  $user = new User;
  $user->name = Input::get('fullname');
  $user->username = Input::get('username');
  $user->email = Input::get('email');
  $user->password = Hash::make(Input::get('password'));

  if(!$user->save()) {
   throw new \ValidationException($user->errors());
  }

  return Redirect::to('login');
 }
.
.
.

Kemudian buat tampilan registernya dengan membuat file baru bernama register.blade.php pada path protected/app/views/auth/ dan isi dengan code berikut,

@extends('layouts/web/master')

<?php $title = "Register" ?>

@section('script')
@stop

@section('content')
<div class="isi">
 <div class="login">
  <h4>Register</h4><br>
  <div class="form-login">
   <form action="" method="POST">
    <div class="form-group">
              <label class="sr-only" for="fullname">Fullname</label>
              <div class="form-group has-feedback">
               <input type="text" class="form-control" placeholder="Masukan Fullname" name="fullname"/>
           </div>
          </div>
          <div class="form-group">
              <label class="sr-only" for="email">Username</label>
              <div class="form-group has-feedback">
               <input type="text" class="form-control" placeholder="Masukan Username" name="username"/>
           </div>
          </div>
    <div class="form-group">
              <label class="sr-only" for="email">Email</label>
              <div class="form-group has-feedback">
               <input type="email" class="form-control" placeholder="Masukan Email" name="email"/>
           </div>
          </div>
          <div class="form-group">
              <label class="sr-only" for="password">Password</label>
              <div class="form-group has-feedback">
               <input type="password" class="form-control" placeholder="Masukan Password" name="password"/>
           </div>
          </div>
          <div class="form-group">
              <button type="submit" class="btn btn-block btn-success">Register</button>
          </div>
   </form>
  </div>
 </div>
</div>
@stop

Terakhir, edit file header.blade.php pada path protected/app/views/layouts/web/ edit bagian ini saja,

.
.
.
  <div class="kanan">
   @if(Auth::user())
    <li onclick="if(confirm('Are you sure to logout?')) location.href='{{ URL::to('logout') }}';">Logout</li>
   @else
    <li onclick="location.href='{{ URL::to('login') }}';">Login</li>
   @endif
   <li onclick="location.href='{{ URL::to('register') }}';">Register</li>
  </div>
.
.
.

Sehingga tampilan registernya akan tampak seperti ini,

===DONE!===

Read More »

Laravel - Authentification (logout)

Pada tutorial sebelumnya kita sudah berhasil membuat sistem login, selanjutnya tutorial kali ini kita akan membuat sistem logout pada laravel.

Algoritamnya mudah saja yaitu dengan menghapus session yang tersimpan pada project kita.

Oke, langsung saja kita mulai praktek tutorialnya.

Pertama, buat terlebih dahulu routenya dengan mengedit file web.php pada path protected/app/routes/ menjadi seperti ini,

.
.
.
//login
Route::get('login', 'Controller\Auth\AuthController@indexLogin');
Route::post('login', 'Controller\Auth\AuthController@login');
Route::get('logout', 'Controller\Auth\AuthController@logout');
.
.
.

Selanjutnya, buat function untuk logout dengan mengedit file AuthController.php
pada path protected/app/controllers/auth/ menjadi seperti ini,

<?php namespace Controller\Auth;

use Model\User;
use \Input;
use \View;
use \Validator;
use \Redirect;
use \Auth;
use \Session;

class AuthController extends \BaseController
{
 public function indexLogin()
 {
  return View::make('auth.login');
 }

 public function login() 
 {
  $user = NULL;
  // Check whether input is an email or username
  $field = Validator::make(
     array('email' => Input::get('username', '')),
     array('email' => 'email'))
     ->passes() ? 'email' : 'username';
  $credentials = array(
   $field   => Input::get('email'), 
   'password'  => Input::get('password', '')
  );

  $remember = Input::get('remember', '1') == '1' ? true : false;

  $status = INVALID_CREDENTIAL;

  if(Auth::attempt($credentials, $remember)) {
   $user = Auth::user();
   $status = OK;
  }

  // For Logging
  Session::put(SESSION_LOG_STATUS, $status);
  Session::put(SESSION_LOG_TYPE, LOGGING_UPDATE);
  Session::put(SESSION_LOG_MODEL, $user);
  // dd($user);
  return Redirect::to('');
 }

 public function logout() 
 {
  $status = INVALID_CREDENTIAL;
  $user = Auth::user();

  if(!$user) {
   return Redirect::to('login');
  } else {
   $status = OK;
   $user = Auth::logout();
  }

  // For Logging
  Session::put(SESSION_LOG_TYPE, LOGGING_UPDATE);
  Session::put(SESSION_LOG_STATUS, $status);
  Session::put(SESSION_LOG_MODEL, $user);

  return Redirect::to('');
 }
}

Kemudian, edit file header.blade.php pada path protected/app/views/layouts/web/ menjadi seperti ini,

<div class="header">
 <div class="banner">
  <div class="welcome">Welcome</div>
  {{-- code dibawah ini menggunakan constant variabel --}}
  <div class="gambar"><a href="#"><img src="{{ IMAGE_HEADER }}" style="width:"100px" height="129px";"></a></div>
 </div>
 <hr>
 <div class="menu">
  <div class="kiri">
   <li>
    <div class="dropdown">
      <button class="btn btn-default">Menu(css)</button>
      <div class="dropdown-content">
        <a href="{{ URL::to('crud/users')}}">User</a>
        <a href="{{ URL::to('book')}}">Index Book</a>
        <a href="{{ URL::to('javaScript/js1')}}">Belajar Script</a>
        <a href="{{ URL::to('javaScript/js2')}}">Belajar Script2</a>
        <a href="{{ URL::to('javaScript/js3')}}">Belajar Script3</a>
        <a href="{{ URL::to('javaScript/js4')}}">Belajar Script4</a>
        <a href="{{ URL::to('javaScript/js5')}}">Belajar Script5</a>
        <a href="{{ URL::to('javaScript/js6')}}">Belajar Script6</a>
        <a href="{{ URL::to('javaScript/js7')}}">Belajar Script7</a>
      </div>
    </div>
   </li>
   <li>
     <div class="dropdown-script">
      <button onclick="myFunction()" class="dropbtn btn btn-default">Translate</button>
      <div id="myDropdown" class="dropdown-content-script">
        <a href="{{ URL::to('lang/en') }}">English</a>
        <a href="{{ URL::to('lang/ina') }}">Indonesia</a>
      </div>
     </div>
   </li>
  </div>
  <div class="kanan">
   @if(Auth::user())
    <li onclick="if(confirm('Are you sure to logout?')) location.href='{{ URL::to('logout') }}';">Logout</li>
   @else
    <li onclick="location.href='{{ URL::to('login') }}';">Login</li>
   @endif
   <li onclick="location.href='{{ URL::to('/') }}';">Cari</li>
  </div>
 </div>
</div>

Terakhir, edit file hello.blade.php pada path protected/app/views/web/ menjadi seperti ini,

@extends('layouts/web/master')

<?php $title = "Welcome" ?>

@section('script')
@stop

@section('content')
<div class="isi">
 <h4>{{ trans('translate.welcome_to_codedoct'); }} @if(Auth::user()){{Auth::user()->name}}@else Guest @endif</h4>
 <br>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt facilis, dolore similique maiores? Doloribus, asperiores. Iusto debitis tempora velit repellat sed autem, quaerat commodi, necessitatibus soluta quos libero voluptatibus eum.</p>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt facilis, dolore similique maiores? Doloribus, asperiores. Iusto debitis tempora velit repellat sed autem, quaerat commodi, necessitatibus soluta quos libero voluptatibus eum.</p>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt facilis, dolore similique maiores? Doloribus, asperiores. Iusto debitis tempora velit repellat sed autem, quaerat commodi, necessitatibus soluta quos libero voluptatibus eum.</p>
</div>
@stop

Sehingga tampilannya saat akan logout akan tampak seperti ini,

Dan saat sudah logout akan tampak seperti ini,

===DONE!===

Read More »

Laravel - Authentification (login)

Pada tutorial sebelumnya kita sudah menyiapkan landing page dan migration file untuk sistem login, pada tutorial kali ini kita akan  membuat sistem loginnya.

Oke, langsung saja kita mulai prakteknya,

Pertama, buat route baru untuk sistem login ini dengan mengedit file web.php pada path protected/app/routes/ menjadi seperti ini,

.
.
.
//login
Route::get('login', 'Controller\Auth\AuthController@indexLogin');
Route::post('login', 'Controller\Auth\AuthController@login');
.
.
.

Selanjutnya, buat function controller baru dengan mengedit file AuthController.php pada path protected/app/controllers/auth/ menjadi seperti ini,

<?php namespace Controller\Auth;

use Model\User;
use \Input;
use \View;
use \Validator;
use \Hash;
use \Redirect;
use \Auth;
use \Session;

class AuthController extends \BaseController
{
 public function indexLogin()
 {
  return View::make('auth.login');
 }

 public function login() 
 {
  $user = NULL;
  // Check whether input is an email or username
  $field = Validator::make(
     array('email' => Input::get('username', '')),
     array('email' => 'email'))
     ->passes() ? 'email' : 'username';
  $credentials = array(
   $field   => Input::get('email'), 
   'password'  => Input::get('password', '')
  );

  $remember = Input::get('remember', '1') == '1' ? true : false;

  $status = INVALID_CREDENTIAL;

  if(Auth::attempt($credentials, $remember)) {
   $user = Auth::user();
   $status = OK;
  }

  // For Logging
  Session::put(SESSION_LOG_STATUS, $status);
  Session::put(SESSION_LOG_TYPE, LOGGING_UPDATE);
  Session::put(SESSION_LOG_MODEL, $user);
  // dd($user);
  return Redirect::to('');
 }
}

Kemudian, tambahkan field remember token pada database dengan mengedit file {tanggal}_create_users_table.php pada path protected/app/database/migration/ menjadi seperti ini,

<?php
//ini database laravel
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;

class CreateUsersTable extends Migration {

 /**
  * Run the migrations.
  *
  * @return void
  */
 public function up()
 {
  Schema::create('users', function($table){
   $table->increments('id');
   $table->string('name');
   $table->string('username')->unique('username');
   $table->string('email')->unique('email');
   $table->string('password');
   $table->string('remember_token', 100)->nullable();
   $table->timestamps();
  });
 }

 /**
  * Reverse the migrations.
  *
  * @return void
  */
 public function down()
 {
  Schema::drop('users');
 }

}

Setelah itu, tambahkan beberapa constant baru untuk keperluan sistem login ini dengan mengedit file constants.php pada path protected/app/ menjadi seperti ini,

.
.
.
// Localization
 define('trans', 'Lang::get');

 // Session Logging
 define('SESSION_LOG'  , 'logging');
 define('SESSION_LOG_TYPE' , 'logging.type');
 define('SESSION_LOG_MODEL' , 'logging.model');
 define('SESSION_LOG_STATUS' , 'logging.status');

 // Logging type
 define('LOGGING_CREATE'  , 'create');
 define('LOGGING_UPDATE'  , 'update');
 define('LOGGING_DELETE'  , 'delete');
 define('LOGGING_RESTORE' , 'restore');

 //Auth
 define('OK', 'OK');
 define('INVALID_CREDENTIAL', 'INVALID_CREDENTIAL');

Terakhir edit file blade header.blade.php pada path protected/app/views/layouts/web/ menjadi seperti ini,

<div class="header">
 <div class="banner">
  <div class="welcome">Welcome</div>
  {{-- code dibawah ini menggunakan constant variabel --}}
  <div class="gambar"><a href="#"><img src="{{ IMAGE_HEADER }}" style="width:"100px" height="129px";"></a></div>
 </div>
 <hr>
 <div class="menu">
  <div class="kiri">
   <li>
    <div class="dropdown">
      <button class="btn btn-default">Menu(css)</button>
      <div class="dropdown-content">
        <a href="{{ URL::to('crud/users')}}">User</a>
        <a href="{{ URL::to('book')}}">Index Book</a>
        <a href="{{ URL::to('javaScript/js1')}}">Belajar Script</a>
        <a href="{{ URL::to('javaScript/js2')}}">Belajar Script2</a>
        <a href="{{ URL::to('javaScript/js3')}}">Belajar Script3</a>
        <a href="{{ URL::to('javaScript/js4')}}">Belajar Script4</a>
        <a href="{{ URL::to('javaScript/js5')}}">Belajar Script5</a>
        <a href="{{ URL::to('javaScript/js6')}}">Belajar Script6</a>
        <a href="{{ URL::to('javaScript/js7')}}">Belajar Script7</a>
      </div>
    </div>
   </li>
   <li>
     <div class="dropdown-script">
      <button onclick="myFunction()" class="dropbtn btn btn-default">Translate</button>
      <div id="myDropdown" class="dropdown-content-script">
        <a href="{{ URL::to('lang/en') }}">English</a>
        <a href="{{ URL::to('lang/ina') }}">Indonesia</a>
      </div>
     </div>
   </li>
  </div>
  <div class="kanan">
   @if(Auth::user())
    <li onclick="location.href='{{ URL::to('') }}';">Logout</li>
   @else
    <li onclick="location.href='{{ URL::to('login') }}';">Login</li>
   @endif
   <li onclick="location.href='{{ URL::to('/') }}';">Cari</li>
  </div>
 </div>
</div>

Dan edit juga file blade hello.blade.php untuk melihat flecnya, file ini terletak pada path protected/app/views/web/ edit menjadi seperti ini,

@extends('layouts/web/master')

<?php $title = "Welcome" ?>

@section('script')
@stop

@section('content')
<div class="isi">
 <h4>{{ trans('translate.welcome_to_codedoct'); }} @if(Auth::user()){{Auth::user()->name}}@else Guest @endif</h4>
 <br>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt facilis, dolore similique maiores? Doloribus, asperiores. Iusto debitis tempora velit repellat sed autem, quaerat commodi, necessitatibus soluta quos libero voluptatibus eum.</p>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt facilis, dolore similique maiores? Doloribus, asperiores. Iusto debitis tempora velit repellat sed autem, quaerat commodi, necessitatibus soluta quos libero voluptatibus eum.</p>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt facilis, dolore similique maiores? Doloribus, asperiores. Iusto debitis tempora velit repellat sed autem, quaerat commodi, necessitatibus soluta quos libero voluptatibus eum.</p>
</div>
@stop

Sehingga tampilan saat tidak sedang login akan tampak seperti ini,

Sedangkan tampilan saat sedang login akan tampak seperti ini,

===DONE!===

WHY?
1. Error undefined method User::newQuery() ?

ini disebabkan karena ada nama class yang sama sehingga membuat class tersebut tidak sinkron dengan parameter yang digunakan. Dalam hal ini nama class yang sama adalah class model dengan class migration, cara memperbaikinya yaitu dengan mengganti nama file class migrationnya.

Ikuti saja langkah tutorial sebelumnya dengan baik dan benar, maka error ini tidak akan terjadi.

2. Error Class '\User' not found

ini disebabkan karena, nama model pada auth salah, cara memperbaikinya buka file auth.php pada path protected/app/config/ cari 'model' => 'bla..bla..bla', isi bla..bla..bla dengan nama model yang akan digunakan sebagai auth, dalam hal ini kita akan menggunakan model User maka edit menjadi seperti ini 'model' => 'Model\User',.

Read More »

Laravel - Authentification (preparing)

Hello, kembali lagi kita ke tutorial Laravel 4.2.

Pada tutorial sebelumnya, kita sudah sampai pada localization pada Laravel 4.2 , tutorial kali ini merupakan lanjutan dari tutorial sebelumnya sehingga sangat dianjurkan bagi anda untuk mengikuti tutorial pada website ini secara struktural atau berurutan dimulai dari tutorial yang pertama yaitu instalasi Laravel 4.2 pada windows.

Jika anda sudah mengikuti atau minimal memahami tutorial sebelum-sebelumnya maka silahkan mulai memahami dan mempraktekkan tutorial ini.

Tutorial kali ini kita akan menyiapkan beberapa persiapan yang dibutuhkan untuk membuat sistem login atau authentification pada Laravel 4.2.

Oke langsung saja kita mulai tutorialnya.

Pertama buat route baru yang akan menuju pada halaman login dengan mengedit file route web.php pada path protected/app/routes/ menjadi seperti ini,

.
.
.
//login
Route::get('login', 'Controller\Auth\AuthController@indexLogin');
.
.
.

Selanjutnya kita buat link pada header untuk menuju pada route login dan menampilkan landing page login dengan mengedit file header.blade.php pada path protected/app/views/layouts/web/ menjadi seperti ini,

<div class="header">
 <div class="banner">
  <div class="welcome">Welcome</div>
  {{-- code dibawah ini menggunakan constant variabel --}}
  <div class="gambar"><a href="#"><img src="{{ IMAGE_HEADER }}" style="width:"100px" height="129px";"></a></div>
 </div>
 <hr>
 <div class="menu">
  <div class="kiri">
   <li>
    <div class="dropdown">
      <button class="btn btn-default">Menu(css)</button>
      <div class="dropdown-content">
        <a href="{{ URL::to('crud/users')}}">User</a>
        <a href="{{ URL::to('book')}}">Index Book</a>
        <a href="{{ URL::to('javaScript/js1')}}">Belajar Script</a>
        <a href="{{ URL::to('javaScript/js2')}}">Belajar Script2</a>
        <a href="{{ URL::to('javaScript/js3')}}">Belajar Script3</a>
        <a href="{{ URL::to('javaScript/js4')}}">Belajar Script4</a>
        <a href="{{ URL::to('javaScript/js5')}}">Belajar Script5</a>
        <a href="{{ URL::to('javaScript/js6')}}">Belajar Script6</a>
        <a href="{{ URL::to('javaScript/js7')}}">Belajar Script7</a>
      </div>
    </div>
   </li>
   <li>
     <div class="dropdown-script">
      <button onclick="myFunction()" class="dropbtn btn btn-default">Translate</button>
      <div id="myDropdown" class="dropdown-content-script">
        <a href="{{ URL::to('lang/en') }}">English</a>
        <a href="{{ URL::to('lang/ina') }}">Indonesia</a>
      </div>
     </div>
   </li>
  </div>
  <div class="kanan">
   <li onclick="location.href='{{ URL::to('login') }}';">Login</li>
   <li onclick="location.href='{{ URL::to('/') }}';">Cari</li>
  </div>
 </div>
</div>

Kemudian, rename file migration {tanggal}_User.php pada path protected/app/database/migration/ menjadi {tanggal}_create_users_table.php dan edit nama class-nya menjadi seperti ini,

<?php
//ini database laravel
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;

class CreateUsersTable extends Migration {
.
.
.

Jangan lupa untuk mengcompile composernya lihat disini.

Setelah itu, buat controller baru pada folder baru dengan nama AuthController.php pada path protected/app/controllers/auth/ isi dengan code berikut,

<?php namespace Controller\Auth;

use Model\User;
use \Input;
use \View;
use \Validator;
use \Hash;
use \Redirect;
use \Auth;

class AuthController extends \BaseController
{
 public function indexLogin()
 {
  return View::make('auth.login');
 }
}

Terakhir kita buat landing page untuk login, dengan mambuat file blade baru pada folder baru dengan nama file login.blade.php pada path protected/app/views/auth/ isi dengan code berikut,

@extends('layouts/web/master')

<?php $title = "Login" ?>

@section('script')
@stop

@section('content')
<div class="isi">
 <div class="login">
  <h4>Login</h4><br>
  <div class="form-login">
   <form action="" method="POST">
    <div class="form-group">
              <label class="sr-only" for="username">Username</label>
              <div class="form-group has-feedback">
               <input type="email" class="form-control" placeholder="Masukan Email" name="email"/>
               <span class="glyphicon glyphicon-user form-control-feedback"></span>
           </div>
          </div>
          <div class="form-group">
              <label class="sr-only" for="password">Password</label>
              <div class="form-group has-feedback">
               <input type="password" class="form-control" placeholder="Masukan Password" name="password"/>
               <span class="glyphicon glyphicon-lock form-control-feedback"></span>
           </div>
          </div>
          <div class="form-group">
              <button type="submit" class="btn btn-block btn-success">Login</button>
          </div>
   </form>
  </div>
 </div>
</div>
@stop

Dan beri sedikit sentuhan css dengan mengedit file main.scss pada path public/css/master/ menjadi seperti ini,

body {
 margin: 0 0 0 0;
 width: 100%;
 background-color: #e9eaee !important;
 text-align: center;
}
.hidden{
 display: none;
}
.isi{
 /* sesuaikan untuk bootstrap */
 margin: 2%;
 /*---------------------------*/
 padding: 20px 2%;
 text-align: left;
 width: 96%;
 border-radius: 5px;
 background-color: white;
 border: 1px solid #e1e8ed;
 overflow: auto;
}

//tambah code buat login
.login{ 
 text-align: center;
 .form-login{
  width: 25%;
  display: inline-block;
 }
}
@import 'header';
@import 'footer';

Jangan lupa untuk mengcompile file scss menjadi css lihat disini.

Sehingga tampilan loginnya akan tampak seperti ini,

===DONE!===

Read More »

Laravel - Localization (Multilanguage Laravel)

Pada tutorial laravel sebelumnya kita sudah membahas tentang membuat sebuah pagination pada Laravel, Tutorial kali ini kita akan membuat translate pada website atau Localization.

Website multilanguage ini sangat berguna bagi website yang memiliki pengunjung website sampai keluar negeri, itulah sebabnya kita membutuhkan sebuah feature untuk mentranslate website kita.

Oke, langsung saja kita mulai tutorialnya..

Pertama, edit dulu halaman home yang akan menjadi contoh view translatenya, dalam hal ini codedoct menggunakan file dengan nama hello.blade yang terletak pada path protected/app/views/web/ isi dengan code berikut,

@extends('layouts/web/master')

<?php $title = "Welcome" ?>

@section('script')
@stop

@section('content')
<div class="isi">
 <h4>{{ trans('translate.welcome_to_codedoct'); }}</h4>
 <br>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt facilis, dolore similique maiores? Doloribus, asperiores. Iusto debitis tempora velit repellat sed autem, quaerat commodi, necessitatibus soluta quos libero voluptatibus eum.</p>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt facilis, dolore similique maiores? Doloribus, asperiores. Iusto debitis tempora velit repellat sed autem, quaerat commodi, necessitatibus soluta quos libero voluptatibus eum.</p>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt facilis, dolore similique maiores? Doloribus, asperiores. Iusto debitis tempora velit repellat sed autem, quaerat commodi, necessitatibus soluta quos libero voluptatibus eum.</p>
</div>
@stop

Selanjutnya, pastikan file view tersebut memiliki controller jika belum silahkan buat file controller baru dengan nama HomeController.php pada path protected/app/controllers/ isikan code berikut,

<?php

class HomeController extends BaseController {

 /*
 |--------------------------------------------------------------------------
 | Default Home Controller
 |--------------------------------------------------------------------------
 |
 | You may wish to use controllers instead of, or in addition to, Closure
 | based routes. That's great! Here is an example controller method to
 | get you started. To route to this controller, just add the route:
 |
 | Route::get('/', 'HomeController@showWelcome');
 |
 */

 public function showWelcome()
 {
  return View::make('web.hello');
 }

}

Kemudian edit file route yang bernama web.php pada path protected/app/routes/ edit dengan menambahkan code berikut,

.
.
.
//Localization
Route::get('lang/{lang}', function($lang)
{
    Session::put('lang', $lang);
    return Redirect::back();
});
.
.
.

Setelah itu, edit file global.php pada path protected/app/start/ dengan menambahkan code berikut,

.
.
.
//language
App::setLocale(Session::get('lang', 'en'));

Edit pula file Header.blade.php pada path protected/app/views/layouts/web/ menjadi seperti ini,

.
.
.
     <div class="dropdown-script">
      <button onclick="myFunction()" class="dropbtn btn btn-default">Translate</button>
      <div id="myDropdown" class="dropdown-content-script">
        <a href="{{ URL::to('lang/en') }}">English</a>
        <a href="{{ URL::to('lang/ina') }}">Indonesia</a>
      </div>
     </div>
.
.
.

Dan edit file constants.php pada path protected/app/ tambahkan code berikut,

.
.
.
// Localization
define('trans', 'Lang::get');

Terakhir, buat folder baru dengan nama ina pada path protected/app/lang/ dan buat file baru dengan nama translate.php pada folder ina dan folder en sehingga akan tampak seperti ini,

Isikan code berikut pada masing-masing file translate.php
translate.php (ina)

<?php

return array(
    'welcome_to_codedoct' => 'Selamat datang di Codedoct.com'
);

translate.php (en)

<?php

return array(
    'welcome_to_codedoct' => 'Welcome to Codedoct.com'
);

Dan hasil akhirnya akan tampak seperti ini.

===DONE!===

Read More »

Laravel - Pagination

Kembali lagi ke Tutorial Laravel, pada tutorial sebelumnya kita sudah sedikit belajar tentang bootstrap, kali ini kita akan belajar membuat sebuah pagination atau halaman pada tampilan atau UI website kita agar terlihat lebih rapi dan tidak memberatkan server karena terlalu banyak load database server.

Pagination pada Laravel sendiri sudah ada librarynya jadi kita hanya perlu memanggilnya saja pada controller kemudian menampilkan UI nya pada blade.

Oke langsung saja kita praktekkan cara membuat pagination pada Laravel,

Pertama, edit file controller Js2Controller.php pada path protected/app/controllers/belajar_js/ menjadi seperti ini,

<?php namespace Controller\belajar_js;

use \View;
use Model\User;

Class Js2Controller Extends \BaseController
{
 public function Index()
 {
  $users = User::paginate(2);

  $content['users'] = $users;

  return View::make('web/java-script2')
     ->with('content', $content);
 }
}

Terlihat pada controller codedoct menggunakan paginate(2) yang berarti data users yang ditampilkan hanya 2 perhalaman.

Selanjutnya edit file blade java-script2.blade.php pada path protected/app/views/web/ menjadi seperti ini,

@extends('layouts/web/master')

<?php $title = 'Java Script 2' ?>

@section('style')
 {{ HTML::style('public/css/content/belajar_js/js2.css') }}
@stop

@section('script')
 {{ HTML::script('public/js/js2.js') }}
@stop

@section('content')
<div class="isi">
 <h4>Belajar java script 2</h4>
 <br>
 <label>Hide and Show Class</label>
 <br><br>
 <div class="user-list">
  @if($content['users'])
   @foreach($content['users'] as $user)
    {{ Form::open(array('url' => 'crud/update/'.$user['id'])) }}
    <div class="box-user">
     <table>
      <tbody class="showing">
       <tr>
        <td>Name</td><td>:</td><td>{{ $user['name'] }}</td>
       </tr>
       <tr>
        <td>Username</td><td>:</td><td>{{ $user['username'] }}</td>
       </tr>
       <tr>
        <td>Email</td><td>:</td><td>{{ $user['email'] }}</td>
       </tr>
      </tbody>
      <tbody class="editing hidden">
       <tr>
        <td>Name</td><td>:</td><td><input type="text" name="name" value="{{ $user['name'] }}"></td>
       </tr>
       <tr>
        <td>Username</td><td>:</td><td><input type="text" name="username" value="{{ $user['username'] }}"></td>
       </tr>
       <tr>
        <td>Email</td><td>:</td><td><input type="text" name="email" value="{{ $user['email'] }}"></td>
       </tr>
      </tbody>
     </table>
     <div class="tombol">
      <div class="edit">
       <button type="button" class="btn btn-default" onclick="edit(this, event)">Edit</button>
      </div>
      <div class="save hidden">
       <button type="button" class="btn btn-default" onclick="back(this, event)">Return</button>
       <input type="submit" class="btn btn-success" value="Save">
      </div>
     </div>
    </div>
    {{ Form::close() }}
   @endforeach
  @else
   <label>Data user empty ...</label>
  @endif
 </div>
//disini pagination nya
 <div class="text-center"> 
  {{ $content['users']->appends(Input::except(array('page')))->links() }}
 </div>
</div>
@stop

Pastikan data users anda lebih dari 2 karena nilai pagination yang ditetapkan adalah 2, jika belum silahkan tambah user lagi dengan klik submenu user pada menu menu(css) seperti ini,

dan kemudian klik create,

Jika sudah selesai selanjutnya buka submenu Belajar script2  pada menu menu(css).

sehingga tampilan paginationnya akan tampak seperti ini

===DONE!===

Read More »

Laravel - Belajar bootstrap

Pada tutorial sebelumya, kita sudah menambahan css framework bootstrap pada website. Sehingga ada beberapa tampilan website akan rusak, seperti bagian header ini.

Sekarang saatnya untuk memperbaiki design yang rusak tersebut sekaligus belajar bootstrap, hehe..

Oke langsung saja kita praktekkan,

Silahkan bandingkan code-code dibawah ini dengan dengan  file pada path aslinya, silahkan ganti code yang berubah dengan code-code dibawah ini, dan jangan lupa pelajari code-code yang telah diubah untuk menyesuaikan design css framework bootstrap.

Edit file main.scss pada path public/css/master menjadi seperti ini,

body {
 margin: 0 0 0 0;
 width: 100%;
 background-color: #e9eaee !important;
 text-align: center;
}
.hidden{
 display: none;
}
.isi{
 /* sesuaikan untuk bootstrap */
 margin: 2%;
 /*---------------------------*/
 padding: 20px 2%;
 text-align: left;
 width: 96%;
 border-radius: 5px;
 background-color: white;
 border: 1px solid #e1e8ed;
 overflow: auto;
}
@import 'header';
@import 'footer';

Edit file _header.scss pada path public/css/master menjadi seperti ini.

.header{
 text-align: left;
 margin-top: 10px;
 width: 100%;
 /* sesuaikan untuk bootstrap */
 height: 230px;
 /*---------------------------*/
 background-color: white;
 box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
 .banner{
  text-align: center;
  width: 100%;
  height: 129px;
  .welcome{
   padding-top: 60px;
   float: left;
   width: 40%;
   text-align: right;
  }
  .gambar{
   float: left;
   width: 20%;
  }
 }
}
.menu{
 margin-top: 0;
 width: 90%;
 margin-right: 5%;
 margin-left: 5%;
 .kiri{
  float: left;
  width: 50%;
  text-align: left;
  li{
   list-style: none;
   display: inline;
   margin-right: 5px;
   /*css for dropdown script*/
   .dropdown-script{
    position: relative;
    display: inline-block;
    a{
     &:hover{
      background-color: #ededed;
      color: black;
      cursor: pointer;
     }
    }
   }
   .dropdown-content-script{
    display: none;
    position: absolute;
    background-color: #e5e5e5;
    min-width: 150px;
    overflow: auto;
    border-radius: 5px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    a{
     color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }
   }
   .show{
    display: block;
   }
   /*end*/
  }
  .dropdown {
      position: relative;
      display: inline-block;
      &:hover .dropdown-content{
       display: block;
      }
      &:hover .button{
       color: lighten(black, 10%);
    text-decoration: none;
    background-color: #ededed;
      }
  }
  .dropdown-content {
   border-radius: 3px;
      display: none;
      position: absolute;
      background-color: #f9f9f9;
      min-width: 160px;
      box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
      a{
       color: black;
       padding: 10px 20px;
       text-decoration: none;
       display: block;
       &:hover{
        background-color: #e5e5e5;
       }
      }
  }
 }
 .kanan{
  float: right;
  width: 50%;
  text-align: right;
  li{
   display: inline-block;
   background-color: #e5e5e5;
   margin-right: 5px;
   display: inline-block;
   cursor: pointer;
   padding: 10px 20px;
   border-radius: 3px;
   box-shadow: 0 1px 1px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
   &:hover {
    color: lighten(black, 10%);
    text-decoration: none;
    background-color: #ededed;
   }
  }
 }
}

jangan lupa untuk mengcompile file sass dengan mengetikkan code seperti ini pada terminal atau powershell.

sass --watch main.scss:main.css

Edit file book.blade.php pada path protected/app/views/ menjadi seperti ini.

@extends('layouts/web/master')

<?php $title = "Book" ?>

@section('style')
 {{ HTML::style('public/css/book.css') }}
@stop

@section('script')
 <script>
 //offset anchor tags with fixed header and smooth scroll
 $(function() {
   $('a[href*=#]:not([href=#])').click(function() {
     if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') 
 && location.hostname == this.hostname) {

       var target = $(this.hash);
       target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
       if (target.length) {
         $('html,body').animate({
           scrollTop: target.offset().top - 60 //offset height
         }, 500);
         return false;
       }
     }
   });
   //Executed on page load with URL containing an anchor tag.
   if($(location.href.split("#")[1])) {
       var target = $('#'+location.href.split("#")[1]);
       if (target.length) {
         $('html,body').animate({
           scrollTop: target.offset().top - 60 //offset height
         }, 500);
         return false;
       }
     }
 });

 </script>
@stop

@section('content')
<div class="isi">
 <div class="daftar-isi">
  <h2>My Book</h2>
  <ul>
   <li><a href="#test1">Test 1</a></li>
   <li><a href="#test2">Test 2</a></li>
   <li><a href="#test3">Test 3</a></li>
   <li><a href="#test4">Test 4</a></li>
  </ul>
 </div>

 <!-- Begin book -->
 <div class="book">
  <div id="test1">
   <h4>Test 1</h4>
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
  </div>

  <div id="test2">
   <h4>Test 2</h4>
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
  </div>

  <div id="test3">
   <h4>Test 3</h4>
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
  </div>
  
  <div id="test4">
   <h4>Test 4</h4>
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.

   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam saepe voluptatem veritatis expedita nihil dolores, distinctio aperiam. Necessitatibus vitae molestias natus fugiat rerum sequi enim nam, nesciunt, et quam asperiores.
  </div>
 </div>
</div>
@stop

Edit file java-script7.blade.php pada path protected/app/views/web/ menjadi seperti ini.

@extends('layouts/web/master')

<?php $title = 'Java Script 7' ?>

@section('style')
@stop

@section('script')
 {{ HTML::script('public/js/js7.js') }}
@stop

@section('content')
<div class="isi">
 <h4>Belajar java script 7 sebelum proses ajax</h4>
 <br>
 <label>Expert programmer Java Script!!!</label>
 <br><br>
 <div class="clearfix">
  <div class="form-group">
   <label>Choose what do you want to edit</label>
   <select class="form-control" name="test_ajax" onchange="lemparKeDataTestAjax(this)">
    <option value=""></option>
    @foreach($content['test_ajaxs'] as $test_ajax)
     <option type="button" value="{{ $test_ajax['id'] }}">{{ $test_ajax['test_ajax'] }}</option>
    @endforeach
   </select>
  </div>
  <button class="btn btn-primary" onclick="editContent(this)" data-id-testajax="" data-content-testajax="" type="button">Edit</button>
 </div>
</div>
@stop

@section('modal')
 <div class="modal fade" id="test-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-md">
   <div class="modal-content">
    <div class="modal-header">
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
     <h4 class="align-center">Header Modal</h4>
    </div>
    <div class="modal-body">
     <label>Edit content test ajax</label>
     <input type="hidden" name="id_testajax" value="">
     <div class="form-group">
      <input type="text" name="content_testajax" class="form-control">
     </div>
    </div>
    <div class="modal-footer">
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
     <button onclick="updateContentTestAjax(this)" type="button" class="btn btn-success">Save</button>
    </div>
   </div>
  </div>
 </div>
@stop

Edit file template javascript7.blade.php pada path protected/app/views/web/templates/ menjadi seperti ini.

<h4>Belajar java script 7 setelah proses ajax</h4>
<br>
<label>Expert programmer Java Script!!!</label>
<br><br>
<div class="clearfix">
 <div class="form-group">
  <label>Choose what do you want to edit</label>
  <select class="form-control" name="test_ajax" onchange="lemparKeDataTestAjax(this)">
   <option value=""></option>
   @foreach($content['test_ajaxs'] as $test_ajax)
    <option type="button" value="{{ $test_ajax['id'] }}">{{ $test_ajax['test_ajax'] }}</option>
   @endforeach
  </select>
 </div>
 <button class="btn btn-primary" onclick="editContent(this)" data-id-testajax="" data-content-testajax="" type="button">Edit</button>
</div>

Edit file hello.blade.php pada path protected/app/views/web/ menjadi seperti ini.

@extends('layouts/web/master')
@section('script')
@stop
@section('content')
 <?php $title = "Welcome" ?>
@stop

Edit file master.blade.php pada path protected/app/views/layouts/web/ menjadi seperti ini.

<!doctype html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 
 <title>
  @if($title)
   {{ $title }}
  @else
   Codedoct.com
  @endif
 </title>

 <!-- Custom Style -->
 @section('style')
 @show
 {{ HTML::style('public/css/master/main.css') }}
 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

 <!-- Custom Scripts -->
 @section('script')
 @show
 {{ HTML::script('public/js/dropdown-menu.js') }}
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

</head>
<body>
 @include('layouts.web.header')
 @yield('content')

 <!-- modal -->
 @section('modal')
 @show

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

Edit file readUser.blade.php pada path protected/app/views/web/ menjadi seperti ini.

@extends('layouts/web/master')
@section('content')
 <?php $title = "User" ?>
 <div class="isi">
  <div class="row">
   <table class="table table-bordered table-hover">
      <thead>
       <tr>
           <th>ID</th>
           <th>NAME</th>
           <th>USERNAME</th>
           <th>EMAIL</th>
           <th>PASSWORD</th>
           <th>CREATED AT</th>
           <th>UPDATED AT</th>
           <th>ACTION</th>
        </tr>
      </thead>
      <tbody>
        @foreach($data_user as $users)
          <tr>
             <td>{{ $users->id }}</td>
             <td>{{ $users->name }}</td>
             <td>{{ $users->username }}</td>
             <td>{{ $users->email }}</td>
             <td>{{ $users->password }}</td>
             <td>{{ $users->created_at }}</td>
             <td>{{ $users->updated_at }}</td>
             <td>
              <a href="{{ URL::to('crud/update/'.$users->id) }}">Edit<br>
              <a href="{{ URL::to('crud/delete/'.$users->id) }}">Delete
             </td>
          </tr>
        @endforeach
       </tbody>
   </table>
  </div>
   <br>
   <button class="btn btn-default" onclick="location.href='{{ URL::to('crud/create') }}';">Create</button>
 </div>
@stop

Edit file java-script2.blade.php pada path protected/app/views/web/ menjadi seperti ini.

@extends('layouts/web/master')

<?php $title = 'Java Script 2' ?>

@section('style')
 {{ HTML::style('public/css/content/belajar_js/js2.css') }}
@stop

@section('script')
 {{ HTML::script('public/js/js2.js') }}
@stop

@section('content')
<div class="isi">
 <h4>Belajar java script 2</h4>
 <br>
 <label>Hide and Show Class</label>
 <br><br>
 <div class="user-list">
  @if($content['users'])
   @foreach($content['users'] as $user)
    {{ Form::open(array('url' => 'crud/update/'.$user['id'])) }}
    <div class="box-user">
     <table>
      <tbody class="showing">
       <tr>
        <td>Name</td><td>:</td><td>{{ $user['name'] }}</td>
       </tr>
       <tr>
        <td>Username</td><td>:</td><td>{{ $user['username'] }}</td>
       </tr>
       <tr>
        <td>Email</td><td>:</td><td>{{ $user['email'] }}</td>
       </tr>
      </tbody>
      <tbody class="editing hidden">
       <tr>
        <td>Name</td><td>:</td><td><input type="text" name="name" value="{{ $user['name'] }}"></td>
       </tr>
       <tr>
        <td>Username</td><td>:</td><td><input type="text" name="username" value="{{ $user['username'] }}"></td>
       </tr>
       <tr>
        <td>Email</td><td>:</td><td><input type="text" name="email" value="{{ $user['email'] }}"></td>
       </tr>
      </tbody>
     </table>
     <div class="tombol">
      <div class="edit">
       <button type="button" class="btn btn-default" onclick="edit(this, event)">Edit</button>
      </div>
      <div class="save hidden">
       <button type="button" class="btn btn-default" onclick="back(this, event)">Return</button>
       <input type="submit" class="btn btn-success" value="Save">
      </div>
     </div>
    </div>
    {{ Form::close() }}
   @endforeach
  @else
   <label>Data user empty ...</label>
  @endif
 </div>
</div>
@stop

Edit file updateUser.blade.php pada path protected/app/views/web/ menjadi seperti ini.

@extends('layouts/web/master')
@section('content')
 <?php $title = "Update User" ?>
 <div class="isi">
  <form method="post" action="">
  <table>
   <tr>
    <td>Name</td>
    <td nowrap>:</td>
    <td><input type="text" name="name" value="{{ $data_user['name'] }}"><span style="color:red"><?php echo $errors->first('name') ?></td>
   </tr>
   <tr>
    <td>Username</td>
    <td nowrap>:</td>
    <td><input type="text" name="username" value="{{ $data_user['username'] }}"><span style="color:red"><?php echo $errors->first('username') ?></td>
   </tr>
   <tr>
    <td>Email</td>
    <td nowrap>:</td>
    <td><input type="text" name="email" value="{{ $data_user['email'] }}"><span style="color:red"><?php echo $errors->first('email') ?></span></td>
   </tr>
   <tr>
    <td colspan="3">
     <br>
     <input type="submit" class="btn btn-default" value="Save">
    </td>
   </tr>
  </table>
  </form>
 </div>
@stop

Edit file createUser.blade.php pada path protected/app/views/web/ menjadi seperti ini.

@extends('layouts/web/master')
@section('content')
 <?php $title = "Create User" ?>
 <div class="isi">
  <form method="post" action="">
  <table>
   <tr>
    <td>Name <span class="error"><?php echo $errors->first('name') ?></span></td>
    <td nowrap>:</td>
    <td><input type="text" name="name"></td>
   </tr>
   <tr>
    <td>Username <span class="error"><?php echo $errors->first('username') ?></span></td>
    <td nowrap>:</td>
    <td><input type="text" name="username"></td>
   </tr>
   <tr>
    <td>Email <span class="error"><?php echo $errors->first('email') ?></span></td>
    <td nowrap>:</td>
    <td><input type="text" name="email"></td>
   </tr>
   <tr>
    <td>Password <span class="error"><?php echo $errors->first('password') ?></span></td>
    <td nowrap>:</td>
    <td><input type="password" name="password"></td>
   </tr>
   <tr>
    <td colspan="3">
     <br>
     <input type="submit" class="btn btn-default" value="Create">
    </td>
   </tr>
  </table>
  </form>
 </div>
@stop

Terakhir edit header.blade.php pada path protected/app/views/layouts/web/ menjadi seperti ini.

<div class="header">
 <div class="banner">
  <div class="welcome">Welcome</div>
  {{-- code dibawah ini menggunakan constant variabel --}}
  <div class="gambar"><a href="#"><img src="{{ IMAGE_HEADER }}" style="width:"100px" height="129px";"></a></div>
 </div>
 <hr>
 <div class="menu">
  <div class="kiri">
   <li>
    <div class="dropdown">
      <button class="btn btn-default">Menu(css)</button>
      <div class="dropdown-content">
        <a href="{{ URL::to('crud/users')}}">User</a>
        <a href="{{ URL::to('book')}}">Index Book</a>
        <a href="{{ URL::to('javaScript/js1')}}">Belajar Script</a>
        <a href="{{ URL::to('javaScript/js2')}}">Belajar Script2</a>
        <a href="{{ URL::to('javaScript/js3')}}">Belajar Script3</a>
        <a href="{{ URL::to('javaScript/js4')}}">Belajar Script4</a>
        <a href="{{ URL::to('javaScript/js5')}}">Belajar Script5</a>
        <a href="{{ URL::to('javaScript/js6')}}">Belajar Script6</a>
        <a href="{{ URL::to('javaScript/js7')}}">Belajar Script7</a>
      </div>
    </div>
   </li>
   <li>
     <div class="dropdown-script">
      <button onclick="myFunction()" class="dropbtn btn btn-default">Menu(css)</button>
      <div id="myDropdown" class="dropdown-content-script">
        <a href="{{ URL::to('crud/users')}}">User</a>
        <a href="#">Link 2</a>
        <a href="#">Link 3</a>
      </div>
     </div>
   </li>
  </div>
  <div class="kanan">
   <li onclick="location.href='{{ URL::to('/') }}';">Login</li>
   <li onclick="location.href='{{ URL::to('/') }}';">Cari</li>
  </div>
 </div>
</div>

Banyak sekali yang kita rombak dan lihat salah satu hasilnya,

===DONE!!!===

Read More »