Laravel 5.7 Tutorial : Simple CRUD Operation with Pagination from Scratch

Laravel 5.7 Tutorial : How to create todo App with Laravel and MySQL Database? This lesson will show you how to create CRUD operation with example in laravel 5.7

Laravel 5.7 Tutorial - How to create simple CRUD (create, read, update, delete) application with pagination in laravel 5.7? This CRUD APP has completed already and you can follow the video tutorial for step by step and The source code will available in the next paragrafh.

Video Tutorial CRUD Application with Laravel 5.7


Full Source Code CRUD APP

First step, we will create a fresh laravel installation using this command.

Installation

composer create-project --prefer-dist laravel/laravel youtube

Database Configuration

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=yt_tutorial
DB_USERNAME=root
DB_PASSWORD=password

Create Migration

php artisan make:migration create_biodatas_table

and we will create table and fields into migration file.

    public function up(){
        Schema::create('biodatas', function (Blueprint $table) {
            $table->increments('id');
            $table->string('namaSiswa');
            $table->text('alamatSiswa');
            $table->timestamps();
        });
    }

Run Migrate

php artisan migrate

Authentication

In this project we will create authentication but will not use. we just need blade template default from laravel.

php artisan make:auth

Create Model

php artisan model Biodata

we will declare fillable in this model

<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Biodata extends Model{
    protected $fillable = ['namaSiswa','alamatSiswa'];
}

Create Controller

php artisan make:controller BiodataController --resource

All CRUD function will stored into This controller,

<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Biodata;
class BiodataController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        $biodatas = Biodata::latest()->paginate(5);
        return view('biodata.index', compact('biodatas'))
                  ->with('i', (request()->input('page',1) -1)*5);
    }

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

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    {
        $request->validate([
          'namaSiswa' => 'required',
          'alamatSiswa' => 'required'
        ]);

        Biodata::create($request->all());
        return redirect()->route('biodata.index')
                        ->with('success', 'new biodata created successfully');
    }

    /**
     * Display the specified resource.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function show($id)
    {
        $biodata = Biodata::find($id);
        return view('biodata.detail', compact('biodata'));
    }

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

    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function update(Request $request, $id)
    {
      $request->validate([
        'namaSiswa' => 'required',
        'alamatSiswa' => 'required'
      ]);
      $biodata = Biodata::find($id);
      $biodata->namaSiswa = $request->get('namaSiswa');
      $biodata->alamatSiswa = $request->get('alamatSiswa');
      $biodata->save();
      return redirect()->route('biodata.index')
                      ->with('success', 'Biodata siswa updated successfully');
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function destroy($id)
    {
        $biodata = Biodata::find($id);
        $biodata->delete();
        return redirect()->route('biodata.index')
                        ->with('success', 'Biodata siswa deleted successfully');
    }
}

Routes

Add new route in your Routes file

route::resource('biodata','BiodataController');

Views

In the views folder, we need to create new directory called "biodata", in the biodata directory we will add this blade file :
  1. index.blade.php
  2. detail.blade.php
  3. edit.blade.php
  4. create.blade.php

Just follow and copy all source code below

Index.blade.php

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

  <div class="container">
    <div class="row">
      <div class="col-md-10">
        <h3>List Biodata Siswa</h3>
      </div>
      <div class="col-sm-2">
        <a class="btn btn-sm btn-success" href="{{ route('biodata.create') }}">Create New Biodata</a>
      </div>
    </div>

    @if ($message = Session::get('success'))
      <div class="alert alert-success">
        <p>{{$message}}</p>
      </div>
    @endif

    <table class="table table-hover table-sm">
      <tr>
        <th width = "50px"><b>No.</b></th>
        <th width = "300px">Nama Siswa</th>
        <th>Alamat Siswa</th>
        <th width = "180px">Action</th>
      </tr>

      @foreach ($biodatas as $biodata)
        <tr>
          <td><b>{{++$i}}.</b></td>
          <td>{{$biodata->namaSiswa}}</td>
          <td>{{$biodata->alamatSiswa}}</td>
          <td>
            <form action="{{ route('biodata.destroy', $biodata->id) }}" method="post">
              <a class="btn btn-sm btn-success" href="{{route('biodata.show',$biodata->id)}}">Show</a>
              <a class="btn btn-sm btn-warning" href="{{route('biodata.edit',$biodata->id)}}">Edit</a>
              @csrf
              @method('DELETE')
              <button type="submit" class="btn btn-sm btn-danger">Delete</button>
            </form>
          </td>
        </tr>
      @endforeach
    </table>

{!! $biodatas->links() !!}
  </div>
@endsection

Create.blade.php

@extends('layouts.app')
@section('content')
  <div class="container">
    <div class="row">
      <div class="col-lg-12">
        <h3>New Biodata Siswa</h3>
      </div>
    </div>

    @if ($errors->any())
      <div class="alert alert-danger">
        <strong>Whoops! </strong> there where some problems with your input.<br>
        <ul>
          @foreach ($errors as $error)
            <li>{{$error}}</li>
          @endforeach
        </ul>
      </div>
    @endif

    <form action="{{route('biodata.store')}}" method="post">
      @csrf
      <div class="row">
        <div class="col-md-12">
          <strong>Nama Siswa :</strong>
          <input type="text" name="namaSiswa" class="form-control" placeholder="Nama Siswa">
        </div>
        <div class="col-md-12">
          <strong>Alamat Siswa :</strong>
          <textarea class="form-control" placeholder="Alamat Siswa" name="alamatSiswa" rows="8" cols="80"></textarea>
        </div>

        <div class="col-md-12">
          <a href="{{route('biodata.index')}}" class="btn btn-sm btn-success">Back</a>
          <button type="submit" class="btn btn-sm btn-primary">Submit</button>
        </div>
      </div>
    </form>

  </div>
@endsection

Detail.blade.php

@extends('layouts.app')
@section('content')
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <h3>Detail Siswa</h3>
        <hr>
      </div>
    </div>
    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
          <strong>Nama Siswa : </strong> {{$biodata->namaSiswa}}
        </div>
      </div>
      <div class="col-md-12">
        <div class="form-group">
          <strong>Alamat Siswa : </strong> {{$biodata->alamatSiswa}}
        </div>
      </div>
      <div class="col-md-12">
        <a href="{{route('biodata.index')}}" class="btn btn-sm btn-success">Back</a>
      </div>
    </div>
  </div>
@endsection

Edit.blade.php

@extends('layouts.app')
@section('content')
  <div class="container">
    <div class="row">
      <div class="col-lg-12">
        <h3>Edit Biodata Siswa</h3>
      </div>
    </div>

    @if ($errors->any())
      <div class="alert alert-danger">
        <strong>Whoops! </strong> there where some problems with your input.<br>
        <ul>
          @foreach ($errors as $error)
            <li>{{$error}}</li>
          @endforeach
        </ul>
      </div>
    @endif

    <form action="{{route('biodata.update',$biodata->id)}}" method="post">
      @csrf
      @method('PUT')
      <div class="row">
        <div class="col-md-12">
          <strong>Nama Siswa :</strong>
          <input type="text" name="namaSiswa" class="form-control" value="{{$biodata->namaSiswa}}">
        </div>
        <div class="col-md-12">
          <strong>Alamat Siswa :</strong>
          <textarea class="form-control" name="alamatSiswa" rows="8" cols="80">{{$biodata->alamatSiswa}}</textarea>
        </div>

        <div class="col-md-12">
          <a href="{{route('biodata.index')}}" class="btn btn-sm btn-success">Back</a>
          <button type="submit" class="btn btn-sm btn-primary">Submit</button>
        </div>
      </div>
    </form>
  </div>
@endsection

Just leave your comment if still confused, and don't forget to like and subscribe our channel and see you next lessons ..

COMMENTS

Next Recomended


Feel free to code it up and send us a pull request.

Hi everyone, let's me know how much this lesson can help your work. Please Subscribe and Follow Our Social Media 'kodeajaib[dot]com' to get Latest tutorials and will be send to your email everyday for free!, Just hit a comment if you have confused. Nice to meet you and Happy coding :) all ^^



Follow by E-Mail


Name

ADO.NET,3,Ajax,6,Android,9,AngularJS,4,ASP.NET,4,Blogger Tutorials,7,Bootstrap,7,C++,1,Codeigniter,2,Cplusplus,6,Crystal Report,6,CSharp,25,Ebook Java,2,FlyExam,1,FSharp,3,Game Development,2,Java,35,JDBC,2,Laravel,84,Lumen,2,MariaDB,2,Ms Access,3,MySQL,31,ODBC,6,OleDB,1,PHP,14,PHP Framework,5,PHP MYSQLI,9,PHP OOP,5,Python,8,Python 3,4,SQL Server,4,SQLite,4,Uncategorized,5,Vb 6,2,Vb.Net,89,Video,48,Vue Js,4,WPF,2,Yii,3,
ltr
item
KODE AJAIB: Laravel 5.7 Tutorial : Simple CRUD Operation with Pagination from Scratch
Laravel 5.7 Tutorial : Simple CRUD Operation with Pagination from Scratch
Laravel 5.7 Tutorial : How to create todo App with Laravel and MySQL Database? This lesson will show you how to create CRUD operation with example in laravel 5.7
https://i.ytimg.com/vi/odjd0dvtn8Y/hqdefault.jpg
https://i.ytimg.com/vi/odjd0dvtn8Y/default.jpg
KODE AJAIB
https://www.kodeajaib.com/2018/10/laravel-57-crud-operation-with-example.html
https://www.kodeajaib.com/
https://www.kodeajaib.com/
https://www.kodeajaib.com/2018/10/laravel-57-crud-operation-with-example.html
true
3214704946184383982
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy