Skip to main content

[Dokumentasi] Langkah-langkah membuat project Laravel (step by step)

Untuk menggunakan laravel, lebih mudah apabila menggunakan composer. Jika anda belum menginstall composer, silahkan download dari situs resminya : https://getcomposer.com

1. Jika composer sudah terinstall, buka console / terminal / command prompt.
Pilih direktori lokasi project laravel akan disimpan, dengan mengetikkan perintah :
cd namadirektori

Ketik perintah berikut :
composer create-project laravel/laravel --prefer-dist test01



Jika berhasil, maka akan menghasilkan project seperti berikut :



2. Setup database MySQL di dalam file .env.
Buat database di dalam DBMS MySQL dengan nama mydb, lalu buka file .env dan lakukan konfigurasi berikut sesuai dengan konfigurasi database yang anda miliki.
// .env

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=mydb
DB_USERNAME=root
DB_PASSWORD=123456

Sekarang, migrasikan dua tabel yang disediakan oleh Laravel 5.5. Buka kembali console / command prompt / terminal,
Masuk ke direktori project yang telah dibuat tadi, dengan mengetikkan perintah :
cd namadirektoriproject

ketik perintah berikut :
php artisan migrate

Jika terjadi error :
Illuminate\Database\QueryException  : SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key length is 767 bytes (SQL: alter table `users` add unique `users_email_unique`(`email`))

maka, ubah file AppServiceProvider.php di dalam direktori app/Providers dan di dalam method boot, set panjang / length dari default string:

use Illuminate\Support\Facades\Schema;
public function boot()
{
    Schema::defaultStringLength(191);
}
//source : https://laravel-news.com/laravel-5-4-key-too-long-error


drop table user dan migrate, jalankan kembali perintah :
php artisan migrate

Jika berhasil, akan tampil pesan berikut :
C:\Apache24\htdocs\dashboard\test01>php artisan migrate
Migration table created successfully.
Migrating: 2014_10_12_000000_create_users_table
Migrated:  2014_10_12_000000_create_users_table
Migrating: 2014_10_12_100000_create_password_resets_table
Migrated:  2014_10_12_100000_create_password_resets_table

3. Buat model dan juga file migrasi untuk tabel baru, sebagai contoh table Product.

Pada console / command prompt / terminal, ketik perintah berikut :
php artisan make:model Product -m

C:\Apache24\htdocs\dashboard\test01>php artisan make:model Product -m
Model created successfully.
Created Migration: 2018_02_09_014429_create_products_table

Hasil eksekusi perintah tersebut, akan menghasilkan 2 file
    model Product.php.
    file migrasi create_products_table.
  
Kita perlu membuat skema tabel product dengan menambahkan field-field yang akan kita butuhkan. Buka direktor database\migrations\create_products_table.

// create_products_table

public function up()
{
    Schema::create('products', function (Blueprint $table) {
       $table->increments('id');
       $table->string('name');
       $table->integer('price');
       $table->timestamps();
    });
}

Pada console / command prompt / terminal, ketik perintah berikut :
php artisan migrate

C:\Apache24\htdocs\dashboard\test01>php artisan migrate
Migrating: 2018_02_09_014429_create_products_table
Migrated:  2018_02_09_014429_create_products_table

Cek database anda, tabel product berhasil ditambahkan

4. Membuat satu view file untuk menambahkan data form dalam database.
Buat 1 folder dengan nama products di direktori resources/views
Di dalam direktori resources/views/products, buat 1 file php dengan nama create.blade.php, buat script seperti contoh berikut :

<!-- create.blade.php -->

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Laravel 5.6 CRUD Tutorial With Example From Scratch </title>
    <link rel="stylesheet" href="{{asset('css/app.css')}}">
  </head>
  <body>
    <div class="container">
      <h2>Create A Product</h2><br  />
      <form method="post">
        <div class="row">
          <div class="col-md-4"></div>
          <div class="form-group col-md-4">
            <label for="name">Name:</label>
            <input type="text" class="form-control" name="name">
          </div>
        </div>
        <div class="row">
          <div class="col-md-4"></div>
            <div class="form-group col-md-4">
              <label for="price">Price:</label>
              <input type="text" class="form-control" name="price">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-4"></div>
          <div class="form-group col-md-4">
            <button type="submit" class="btn btn-success" style="margin-left:38px">Add Product</button>
          </div>
        </div>
      </form>
    </div>
  </body>
</html>

5. Membuat satu controller dan melakukan route untuk menampilkan form Product
Pada console / command prompt / terminal, ketik perintah berikut :
php artisan make:controller ProductController --resource

C:\Apache24\htdocs\dashboard\test01>php artisan make:controller ProductController --resource
Controller created successfully.

Hasil eksekusi perintah tersebut akan menghasilkan 1 file controller dengan nama ProductController.php yang memiliki semua fungsi CRUD.

Sekarang kita akan melakukan konfigurasi routing pada file web.php di dalam direktori routes. Tambahkan code berikut :
// web.php

Route::resource('products','ProductController');


Pada console / command prompt / terminal, ketik perintah berikut :
php artisan route:list

C:\Apache24\htdocs\dashboard\test01>php artisan route:list
+--------+-----------+-------------------------+------------------+------------------------------------------------+--------------+
| Domain | Method    | URI                     | Name             | Action                                         | Middleware   |
+--------+-----------+-------------------------+------------------+------------------------------------------------+--------------+
|        | GET|HEAD  | /                       |                  | Closure                                        | web          |
|        | GET|HEAD  | api/user                |                  | Closure                                        | api,auth:api |
|        | GET|HEAD  | products                | products.index   | App\Http\Controllers\ProductController@index   | web          |
|        | POST      | products                | products.store   | App\Http\Controllers\ProductController@store   | web          |
|        | GET|HEAD  | products/create         | products.create  | App\Http\Controllers\ProductController@create  | web          |
|        | GET|HEAD  | products/{product}      | products.show    | App\Http\Controllers\ProductController@show    | web          |
|        | PUT|PATCH | products/{product}      | products.update  | App\Http\Controllers\ProductController@update  | web          |
|        | DELETE    | products/{product}      | products.destroy | App\Http\Controllers\ProductController@destroy | web          |
|        | GET|HEAD  | products/{product}/edit | products.edit    | App\Http\Controllers\ProductController@edit    | web          |
+--------+-----------+-------------------------+------------------+------------------------------------------------+--------------+

Langkah selanjutnya, buka file ProductController.php, dan tambahkan kode berikut pada method create()
// ProductController.php

  /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        return view('products.create');
    }

Pada console / command prompt / terminal, ketik perintah berikut :
php artisan serve

Buka browser dan ketik URL: http://localhost:8000/products/create


  
6. Menambahkan validasi Laravel 5.6 di dalam Form Product.
Pertama, kita harus menentukan action dari form yang kita buat. Buka form create.blade.php pada direktori products. tambahkan action pada tag form, dan token CSRF_FIELD di bawah tag form
<!-- create.blade.php -->
<form method="post" action="{{url('products')}}">
{{csrf_field()}}

Apa Fungsi Dari CSRF_FIELD() Token Pada Insert Form ?
Sebenarnya Cross Site Request Forgery (CSRF) adalah adalah sebuah seraangan terhadap web aplication yang memanfaatkan bug atau vulnerability pada Web Application yang bekerja dengan cara mengeksploitasi suatu task dari sebuah Web dengan memanfaatkan Autentikasi yang dimiliki oleh korban.
Hal ini biasanya di karenakan kode yang sangat buruk sewaktu developmentya sehingga menghasilkan  bug tersebut yang dapat di salah gunakan oleh orang lain dengan maksud negatif.
Nah untuk menghindari hal ini terjadi Laravel mengimplementasikan CSRF pada form untuk mengamankan website kita.

Kemudian, buka file Product.php pada direktori app, kita akan menentukan field-field dari tabel product yang bisa dimodifikasi, tambahkan code protected $fillable di dalam class Product
// Product.php
protected $fillable = ['name','price'];

Jika kita melihat pada routing resource maka terdapat post request memiliki routing ‘/products‘ dan fungsi store di dalam file ProductController.php. Jadi kita perlu menambahkan code pada fungsi store untuk menyimpan data ke dalam database.

Satu hal yang perlu diingat, kita perlu meng-include namespace model Product.php ke dalam file ProductController.php. Untuk itu, tambahkan code berikut pada baris awal di dalam file ProductController.php.

use App\Product;

Kita juga perlu menambahkan validasi di dalam method store.

// ProductController.php

/**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    {
        $product = $this->validate(request(), [
          'name' => 'required',
          'price' => 'required|numeric'
        ]);
      
        Product::create($product);

        return back()->with('success', 'Product has been added');;
    }

Jika validasi mengembalikan hasil fail / gagal maka kita perlu menampilkan pesan error. Jadi, pada file create.blade.php perlu ditambahkan beberapa baris code setelah tag h2.

<!-- create.blade.php -->

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Laravel 5.6 CRUD Tutorial With Example From Scratch </title>
    <link rel="stylesheet" href="{{asset('css/app.css')}}">
  </head>
  <body>
    <div class="container">
      <h2>Create A Product</h2><br  />
      @if ($errors->any())
      <div class="alert alert-danger">
          <ul>
              @foreach ($errors->all() as $error)
                  <li>{{ $error }}</li>
              @endforeach
          </ul>
      </div><br />
      @endif
      @if (\Session::has('success'))
      <div class="alert alert-success">
          <p>{{ \Session::get('success') }}</p>
      </div><br />
      @endif
      <form method="post" action="{{url('products')}}">
        {{csrf_field()}}
        <div class="row">
          <div class="col-md-4"></div>
          <div class="form-group col-md-4">
            <label for="name">Name:</label>
            <input type="text" class="form-control" name="name">
          </div>
        </div>
        <div class="row">
          <div class="col-md-4"></div>
            <div class="form-group col-md-4">
              <label for="price">Price:</label>
              <input type="text" class="form-control" name="price">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-4"></div>
          <div class="form-group col-md-4">
            <button type="submit" class="btn btn-success" style="margin-left:38px">Add Product</button>
          </div>
        </div>
      </form>
    </div>
  </body>
</html>

Coba buka di browser dan buka URL: http://localhost:8000/products/create

Jika kita klik submit tanpa memasukkan nilai apapun pada form, maka kita akan melihat pesan error.



If you fill all the values then, you will redirect to this page with the success message. So, here One thing must be noticed.

// ProductController.php

  public function store(Request $request)
  {
        $product = $this->validate(request(), [
          'name' => 'required',
          'price' => 'required|numeric'
        ]);
        Product::create($product);
        return back()->with('success', 'Product has been added');
  }

Pada Laravel 5.5 ke atas kita akan langsung mendapatkan hasil kembalian berupa nilai array dari funsi validasi dan menggunakannya untuk melakukan proses insert ke dalam database. Ini merupakan fitur baru pada Laravel

7. Membuat halaman index untuk menampilkan list products.

Pertama, kita akan mengirim data ke index.blade.php. Jadi, di dalam file ProductController.php, kita akan menulis kode untuk melakukan fetch data dan mengembalikan hasilnya ke view index.

// ProductController.php

  /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        $products = Product::all()->toArray();
        return view('products.index', compact('products'));
    }

Di dalam direktori resources/views/products, buat 1 file blade dengan nama index.blade.php dan tambahkan kode berikut.

<!-- index.blade.php -->

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Index Page</title>
    <link rel="stylesheet" href="{{asset('css/app.css')}}">
  </head>
  <body>
    <div class="container">
    <br />
    @if (\Session::has('success'))
      <div class="alert alert-success">
        <p>{{ \Session::get('success') }}</p>
      </div><br />
     @endif
    <table class="table table-striped">
    <thead>
      <tr>
        <th>ID</th>
        <th>Name</th>
        <th>Price</th>
        <th colspan="2">Action</th>
      </tr>
    </thead>
    <tbody>
      @foreach($products as $product)
      <tr>
        <td>{{$product['id']}}</td>
        <td>{{$product['name']}}</td>
        <td>{{$product['price']}}</td>
        <td><a href="{{action('ProductController@edit', $product['id'])}}" class="btn btn-warning">Edit</a></td>
        <td>
          <form action="{{action('ProductController@destroy', $product['id'])}}" method="post">
            {{csrf_field()}}
            <input name="_method" type="hidden" value="DELETE">
            <button class="btn btn-danger" type="submit">Delete</button>
          </form>
        </td>
      </tr>
      @endforeach
    </tbody>
  </table>
  </div>
  </body>
</html>

Coba buka browser dan ketik URL: http://localhost:8000/products



8. Membuat view edit untuk merubah product.

Langkah selanjutnya menambahkan fungsi edit di dalam file ProductController.php dengan menambahkan code berikut.

// ProductController.php

  /**
     * Show the form for editing the specified resource.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function edit($id)
    {
        $product = Product::find($id);
        return view('products.edit',compact('product','id'));
    }

Buat 1 file dengan nama edit.blade.php di dalam direktori resources/views/products, dengan script berikut

<!-- edit.blade.php -->

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Laravel 5.5 CRUD Tutorial With Example From Scratch </title>
    <link rel="stylesheet" href="{{asset('css/app.css')}}">
  </head>
  <body>
    <div class="container">
      <h2>Edit A Product</h2><br  />
      @if ($errors->any())
      <div class="alert alert-danger">
          <ul>
              @foreach ($errors->all() as $error)
                  <li>{{ $error }}</li>
              @endforeach
          </ul>
      </div><br />
      @endif
      <form method="post" action="{{action('ProductController@update', $id)}}">
        {{csrf_field()}}
        <input name="_method" type="hidden" value="PATCH">
        <div class="row">
          <div class="col-md-4"></div>
          <div class="form-group col-md-4">
            <label for="name">Name:</label>
            <input type="text" class="form-control" name="name" value="{{$product->name}}">
          </div>
        </div>
        <div class="row">
          <div class="col-md-4"></div>
            <div class="form-group col-md-4">
              <label for="price">Price:</label>
              <input type="text" class="form-control" name="price" value="{{$product->price}}">
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-md-4"></div>
          <div class="form-group col-md-4">
            <button type="submit" class="btn btn-success" style="margin-left:38px">Update Product</button>
          </div>
        </div>
      </form>
    </div>
  </body>
</html>

Berikutnya menambahkan kode untuk fungsi update.

// ProductController.php

  /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function update(Request $request, $id)
    {
        $product = Product::find($id);
        $this->validate(request(), [
          'name' => 'required',
          'price' => 'required|numeric'
        ]);
        $product->name = $request->get('name');
        $product->price = $request->get('price');
        $product->save();
        return redirect('products')->with('success','Product has been updated');
    }

9. Membuat fungsi Delete product.

// ProductController.php

  /**
     * Remove the specified resource from storage.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function destroy($id)
    {
        $product = Product::find($id);
        $product->delete();
        return redirect('products')->with('success','Product has been  deleted');
    }

Selesai.
Labels:

Comments

Post a Comment

Popular posts from this blog

[Dokumentasi] Reporting Program VB6 dengan Crystal Report 8.5 menggunakan TTX File (II)

Dalam tulisan kali ini, kita akan menampilkan data dari program aplikasi yang kita buat dengan VB6 ke laporan Crystal Report (TTX File). Di bagian sebelumnya, sudah disampaikan langkah-langkah pembuatan laporan Crystal Report dengan TTX File. Untuk menghubungkan laporan tersebut dari program aplikasi yang kita buat, dapat mengikuti langkah-langkah berikut : 1. Buka IDE Ms. VB 6, pilih New - Standard Exe, kemudian klik tombol Open 2. Pilih menu Project - Component (Ctrl+T), tab Controls akan menampilkan daftar komponen teregister yang dapat kita gunakan untuk program aplikasi kita, ceklis komponen Crystal Report Viewer Control, kemudian klik tombol OK 3. Pilih menu Project - References, ceklis Crystal Reports 8.5 ActiveX Designer Run Time Library dan Microsoft ActiveX Data Objects 2.x Library, kemudian klik tombol OK 4. Pada Toolbox akan menambah 1 komponen dengan nama CRViewer, drag komponen tersebut dan drop di form yang kita gunakan. 5. Atur tata letak komponen tersebut pada for...
Post a Comment
Read more

[Dokumentasi] Contoh sederhana export excel dari Visual Basic 6.0

Dalam pemrograman basisdata, sebagai programmer, kita dituntut untuk dapat menghasilkan output berupa laporan. Cara menghasilkan laporan tersebut tentunya berbeda-beda. Salah satu cara menghasilkan output laporan adalah menampilkan laporan tersebut ke excel. Berikut ini diuraikan langkah-langkah pembuatan output excel sederhana dengan menggunakan Visual Basic 6.0 : Buat satu project baru pada visual basic 6.0 Tambahkan 1 CommandButton pada form dan beri nama Command1 Buka code viewer pada form yang telah disediakan CommandButton tadi Deklarasikan object untuk menghasilkan file excel Dim oExcel As Object Dim oBook As Object Dim oSheet As Object Double Click pada CommandButton tadi untuk menambahkan code pada event click'- Set object yang telah dideklarasikan sebelumnya untuk membuat objek Excel Set oExcel = CreateObject("Excel.Application") Set oBook = oExcel.Workbooks.Add Set oSheet = oBook.Worksheets(1) '- Lakukan pengaturan untuk masing-masing kolom o...
Post a Comment
Read more

Twitter memposting keuntungan pertama meski ada masalah bot

Jaringan sosial lambat berkembang karena berkaitan dengan kekhawatiran akan jutaan akun palsu yang melakukan tweet dan retweet di seluruh platform.   Ada jutaan akun palsu yang melakukan tweet , retweet dan like ke sebagian besar akun terkenal di Twitter. Jadi apa yang akan dilakukan perusahaan tentang hal itu?   Masalahnya telah menggelegak di bawah permukaan di Twitter selama bertahun-tahun. Tapi itu dibawa ke permukaan oleh The New York Times, yang menemukan perusahaan yang menghasilkan uang dengan menggunakan bots - program komputer otomatis yang terkadang berperan sebagai orang sungguhan - untuk memperbanyak pengikut selebriti, eksekutif bisnis, dan bahkan anggota dewan Twitter sendiri sebenarnya punya. Twitter mulai membersihkan jutaan akun palsu untuk menanggapi hal ini. Sulit untuk mengatakan berapa banyak akun palsu di luar sana. Sebuah studi yang dirilis tahun lalu menemukan bahwa sebanyak 15 persen akun Twitter aktif dikendalikan oleh bot. Twitter menga...
Post a Comment
Read more