Home / Article List / Latihan Project Laravel 5.4 CRUD

Programming

Latihan Project Laravel 5.4 CRUD

25 Dec 2018Khaidir Fahram

CRUD

Display Data

Buatlah database dengan nama latihan

$ mysql -uroot -e "create database latihan"

Buatlah project laravel

$ composer create-project --prefer-dist laravel/laravel playlist "5.4.*" 
$ cd playlist 
$ php artisan make:auth

tambahkan library laravelcollective/html

$ composer require laravelcollective/html ^5.4

daftarkan provider pada file config/app.php

'providers' => [
             // ... 
            Collective\Html\HtmlServiceProvider::class, 
            // ... 
],

daftarkan aliases pada file config/app.php

'aliases' => [
        // ... 
        'Form' => Collective\Html\FormFacade::class, 
        'Html' => Collective\Html\HtmlFacade::class, 
        // ... 
],

edit config database pada file .env

DB_DATABASE=latihan 
DB_USERNAME=root 
DB_PASSWORD=

buat model dan contoller Video

$ php artisan make:model -c Video

buatlah migration untuk table videos

$ php artisan make:migration create_table_videos

edit file migraton create_table_videos

use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;

class CreateTableVideos extends Migration
{
    public function up()
    {
        Schema::create('videos', function (Blueprint $table) {
            $table->increments('id');
            $table->string('title');
            $table->string('youtube_id');
            $table->text('description')->nullable();
            $table->integer('user_id')->unsigned();
            $table->foreign('user_id')->references('id')->on('users');
            $table->bigInteger('view')->default(0);
            $table->timestamps();
        });
    }
    public function down()
    {
        Schema::dropIfExists('videos');
    }
}

edit file Model Video

namespace App;

use Illuminate\Database\Eloquent\Model;

class Video extends Model
{
    protected $guarded = [''];
    public static function boot()
    {
        parent::boot();
        static::creating(function ($model) {
            $model->user_id = Auth()->user()->id;
            return true;
        });
    }
    public function user()
    {
        return $this->belongsTo('App\User');
    }
}

edit file Controller

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Video;

class VideoController extends Controller
{
    public function __construct()
    {
        $this->middleware('auth');
    }
    public function index()
    {
        $videos = Video::paginate(10);
        return view('video.index', compact('videos'));
    }
    public function create()
    {
        return view('video.create');
    }
    public function store(Request $request)
    {
        $rules = ['title' => 'required|max:200', 'youtube_id' => 'required',];
        $this->validate($request, $rules);
        $video = Video::create($request->all());
        \Session::flash('flash_message', $video->title . ' Create Success');
        return redirect('video');
    }
    public function show(Video $video)
    {
        return view('video.show', compact('video'));
    }
    public function edit(Video $video)
    {
        return view('video.edit', compact('video'));
    }
    public function update(Request $request, Video $video)
    {;
        $video->update($request->all());
        $video->save();
        \Session::flash('flash_message', $video->title . ' Create Success');
        return redirect('video');
    }
    public function destroy(Video $video)
    {
        $video->delete();
        \Session::flash('flash_message', 'Delete Success');
        return redirect('video');
    }
}

edit file route web

Route::get('/', function () {
    $videos = App\Video::paginate(10);
    return view('welcome', compact('videos'));
});
Auth::routes();
Route::get('/home', 'HomeController@index')->name('home');
Route::resource('video', 'VideoController');
Route::get('/{id}', function ($id) {
    $video = App\Video::where('youtube_id', '=', $id)->first();
    $video->view += 1;
    $video->save();
    return view('video.show', compact('video'));
});

buat folder di resources/view/ dengan nama video
buat 4 file di dalam folder tersebut

create.blade.php

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12">
            <div class="panel panel-default">
                <div class="panel-heading">Tambah Video</div>

                <div class="panel-body">
                    {!! Form::model($video = new \App\Video,['url'=>'/video']) !!}
                        @if ($errors->any())
                                {!! implode('', $errors->all('<div class="alert alert-danger">:message</div>')) !!}
                        @endif
                        <div class="form-group">
                            {!!Form::label('title', 'Judul Video')!!}
                            {!!Form::text('title', null, ['class'=>'form-control','placeholder'=>'Judul Video','required'])!!}
                        </div>
                        <div class="form-group">
                            {!!Form::label('youtube_id', 'Youtube ID')!!}
                            {!!Form::text('youtube_id', null, ['class'=>'form-control','placeholder'=>'Youtube ID','required'])!!}
                        </div>
                        <div class="form-group">
                            {!!Form::label('description', 'Deskripsi')!!}
                            {!!Form::textarea('description', null, ['class'=>'form-control','placeholder'=>'Deskripsi','required'])!!}
                        </div>
                        <button type="submit" class="btn-block btn btn-primary">Save
                        </button>
                    {!! Form::close()!!}
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

edit.blade.php

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12">
            <div class="panel panel-default">
                <div class="panel-heading">Edit Video</div>

                <div class="panel-body">
                    {!! Form::model($video ,['method' => 'PATCH','action'=> ['VideoController@update', $video->id], 'files' => true]) !!}
                        @if ($errors->any())
                                {!! implode('', $errors->all('<div class="alert alert-danger">:message</div>')) !!}
                        @endif
                        <div class="form-group">
                            {!!Form::label('title', 'Judul Video')!!}
                            {!!Form::text('title', null, ['class'=>'form-control','placeholder'=>'Judul Video','required'])!!}
                        </div>
                        <div class="form-group">
                            {!!Form::label('youtube_id', 'Youtube ID')!!}
                            {!!Form::text('youtube_id', null, ['class'=>'form-control','placeholder'=>'Youtube ID','required'])!!}
                        </div>
                        <div class="form-group">
                            {!!Form::label('description', 'Deskripsi')!!}
                            {!!Form::textarea('description', null, ['class'=>'form-control','placeholder'=>'Deskripsi','required'])!!}
                        </div>
                        <button type="submit" class="btn-block btn btn-primary">Save
                        </button>
                    {!! Form::close()!!}
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

index.blade.php

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12">
            <div class="panel panel-default">

            <div class="panel-heading">Video 
            <a class="btn btn-sm btn-primary pull-right" href="{{route('video.create')}}">Tambah Video</a>
            </div>
                <div class="panel-body">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>id</th>
                                <th>Title</th>
                                <th>youtube_id</th>
                                <th>View</th>
                                <th width="180">Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse ($videos as $video)
                            <tr>
                                <td>{{$video->id}}</td>
                                <td>{{$video->title}}</td>
                                <td>{{$video->youtube_id}}</td>
                                <td>{{$video->view}}</td>
                                <td>
                                    <a class="btn btn-sm btn-success" href="{{route('video.show',$video->id)}}">Show</a>
                                    <a class="btn btn-sm btn-warning" href="{{route('video.edit',$video->id)}}">Edit</a>
                                {{ Form::open(array('url' => 'video/' . $video->id, 'class' => 'pull-right')) }}
                                {{ Form::hidden('_method', 'DELETE') }}
                                {{ Form::submit('Delete', array('class' => 'btn btn-sm btn-danger btn-submit')) }}
                                {{ Form::close() }}
                                </td>
                            </tr>
                            @empty
                                <tr><td colspan="3"> Data masih kosong</td></tr>
                            @endforelse
                        </tbody>
                    </table>
                            {{$videos->links()}}
                </div>

            </div>
        </div>
    </div>
</div>
@endsection

show.blade.php

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12">
            <div class="panel">
                <div class="panel-heading">Detail Video</div>

                <div class="panel-body">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="videowrapper">
                                
                            <iframe width="100%"  src="https://www.youtube.com/embed/{{$video->youtube_id}}" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                            </div>
                        </div>
                        <div class="col-md-12">
                            <ul class="list-group">
                                <li class="list-group-item">
                                    Judul : {{$video->title}}
                                </li>
                                <li class="list-group-item">
                                    Deskripsi : {{$video->descripsion}}
                                </li>
                                <li class="list-group-item">
                                    Dilihat Sebanyak : {{$video->view}} Kali
                                </li>
                                <li class="list-group-item">
                                    DiInput Oleh : {{$video->user->name}} 
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

edit file welcome.blade.php pada folder resources/view/ untuk menampilkan data yang sudah diinput

@extends('layouts.app')

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

    
            <div class="content">
                <div class="row">
                    @forelse ($videos as $video)
                        
                    <div class="col-md-4">
                        <a href="/{{$video->youtube_id}}">
                        <div class="panel panel-default">
                            <img width="100%" src="https://img.youtube.com/vi/{{$video->youtube_id}}/0.jpg" class="media-object" >
                            <div class="panel-heading">
                                {{$video->title}}
                            </div>
                        </div>
                        </a>
                    </div>
                    @empty
                        
                    @endforelse
                </div>
                    {{$videos->links()}}
            </div>
</div>
@endsection

tambahkan css di dalam tag pada file resources/view/layouts/app.blade.php

<style>
.videowrapper {
    float: none;
    clear: both;
    width: 100%;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0;
}
.videowrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
</style>

Lakukan migrate

$ php artisan migrate

terakhir test dengan menjalankan php server

$ php artisan serve

lakukan register untuk menginput data