Laravel 5.5 Tutorial – AppDividend https://appdividend.com Latest Code Tutorials Sat, 19 Jan 2019 21:32:43 +0000 en-US hourly 1 https://wordpress.org/?v=5.0.3 https://appdividend.com/wp-content/uploads/2017/08/cropped-ApDivi-32x32.png Laravel 5.5 Tutorial – AppDividend https://appdividend.com 32 32 How To Integrate Admin Template In Laravel 5.5 https://appdividend.com/2017/11/28/integrate-admin-template-laravel-5-5/ https://appdividend.com/2017/11/28/integrate-admin-template-laravel-5-5/#comments Tue, 28 Nov 2017 21:05:04 +0000 http://localhost/appdividend/?p=1426 Integrate Admin Template in Laravel 5.5

How to integrate admin template in Laravel 5.5 is today’s leading topic. If you are building a web application, then admin panel is the most used web part. So in today’s tutorial, I will show you how to integrate any admin panel easily with the Laravel. We will do it from scratch. We will use AdminLTE. […]

The post How To Integrate Admin Template In Laravel 5.5 appeared first on AppDividend.

]]>
Integrate Admin Template in Laravel 5.5

How to integrate admin template in Laravel 5.5 is today’s leading topic. If you are building a web application, then admin panel is the most used web part. So in today’s tutorial, I will show you how to integrate any admin panel easily with the Laravel. We will do it from scratch. We will use AdminLTE.

Integrate admin template in Laravel 5.5

First, we will download the admin panel template in the plain HTML, and then we will download the Laravel 5.5.

Step 1: Install the Laravel 5.5

Type the following command.

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

After installation, edit the .env file and setup the database. Now, define the route for the admin template.

Route::view('admin', 'home');

Now, we need to create one master template file, which is inherited by all of its child pages.

In the resources  >>  views folder, make one file called master.blade.php.

Step 2: Make a layout file called master.blade.php

In this file, we will include all the css and js files, which will be needed in all the pages.

Now, make one folder inside views directory, called partials. In that folder, we will put our header and sidebar files. Our master.blade.php file looks like this.

<!-- master.blade.php -->

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>@yield('title')</title>
    <link rel="stylesheet" href="{{asset('css/app.css')}}" />
    <link rel="stylesheet" href="{{asset('css/AdminLTE.min.css')}}" />
    <link rel="stylesheet" href="{{asset('css/skins/_all-skins.min.css')}}" />
    <link rel="stylesheet" href="{{asset('font-awesome/css/font-awesome.min.css')}}" />
    @yield('stylesheets')
</head>
<body class="hold-transition skin-blue sidebar-mini">
    <div class="wrapper">
        @include('partials.header')
        @include('partials.sidebar')
        @yield('content')
    </div>
    <script src="{{ asset('js/jquery/dist/jquery.min.js') }}"></script>
    <script src="{{ asset('js/bootstrap/dist/js/bootstrap.min.js') }}"></script>
    <script src="{{ asset('js/adminlte.min.js') }}"></script>
    @yield('scripts')
</body>
</html>

This file includes required CSS and JS that will run the theme smoothly throughout the project.

Our header.js file looks like this.

<!-- header.blade.php -->

<header class="main-header">
    <a href="" class="logo">
        <span class="logo-mini"><b>A</b>LT</span>
        <span class="logo-lg"><b>Admin</b>LTE</span>
    </a>
    <nav class="navbar navbar-static-top">
        <a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
            <span class="sr-only">Toggle navigation</span>
        </a>
        <div class="navbar-custom-menu">
            <ul class="nav navbar-nav">
                <li class="dropdown user user-menu">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                        <img src="{{asset('img/user2-160x160.jpg')}}" class="user-image" alt="User Image" />
                        <span class="hidden-xs">AppDividend</span>
                    </a>
                    <ul class="dropdown-menu">
                    <!-- User image -->
                        <li class="user-header">
                            <img src="{{asset('img/user2-160x160.jpg')}}" class="img-circle" alt="User Image" />
                            <p>
                                AppDividend
                            </p>
                        </li>
                        <li class="user-footer">
                            <div class="pull-right">
                                <a href="" class="btn btn-default">Sign out</a>
                            </div>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </nav>
</header>

Also, sidebar.blade.php file looks like this.

<!-- sidebar.blade.php -->

<aside class="main-sidebar">
    <section class="sidebar">    
        <div class="user-panel">
            <div class="pull-left image">
                <img src="{{asset('img/user2-160x160.jpg')}}" class="img-circle" alt="User Image" />
            </div>
            <div class="pull-left info">
                <p>AppDividend</p>
            </div>
        </div>
        <ul class="sidebar-menu" data-widget="tree">
            <li class="treeview">
                <a href="#">
                    <i class="fa fa-dashboard"></i> <span>Categories</span>
                    <span class="pull-right-container">
                    <i class="fa fa-angle-left pull-right"></i>
                    </span>
                </a>
                <ul class="treeview-menu">
                    <li><a href=""><i class="fa fa-circle-o"></i>Add Category</a></li>
                    <li><a href=""><i class="fa fa-circle-o"></i>All Categories</a></li>
                </ul>
            </li> 
        </ul>
    </section>
</aside>

Now, if you have included the proper css and js files, then hit the following URL in the browser.

http://localhost:8000/admin

Remeber, you need to start the laravel development server.

Conclusion

You can further modify the theme by dividing into smaller dynamic pieces as per your requirement. This is just a demo. Our theme looks like this.

 

adminlte laravel

The post How To Integrate Admin Template In Laravel 5.5 appeared first on AppDividend.

]]>
https://appdividend.com/2017/11/28/integrate-admin-template-laravel-5-5/feed/ 9
Laravel 5.5 Tutorial With Example From Scratch https://appdividend.com/2017/08/20/laravel-5-5-tutorial-example/ https://appdividend.com/2017/08/20/laravel-5-5-tutorial-example/#comments Sun, 20 Aug 2017 19:30:10 +0000 http://localhost/appdividend/?p=898 Laravel 5.5 Tutorial With Example From Scratch

Laravel 5.5 Tutorial With Example From Scratch is Laravel 5.5 CRUD tutorial for beginners. Laravel has recently launched its new version called Laravel 5.5, and it is also come up with a bunch of new Features. Today, we are not discussing in depth new features of Laravel 5.5, just list them but rather than focusing […]

The post Laravel 5.5 Tutorial With Example From Scratch appeared first on AppDividend.

]]>
Laravel 5.5 Tutorial With Example From Scratch

Laravel 5.5 Tutorial With Example From Scratch is Laravel 5.5 CRUD tutorial for beginners. Laravel has recently launched its new version called Laravel 5.5, and it is also come up with a bunch of new Features. Today, we are not discussing in depth new features of Laravel 5.5, just list them but rather than focusing on the coding in Laravel 5.5. It’s small application in Laravel 5.5. Laravel is most flexible and elegant PHP Framework so far and always come up with new things. Laravel is the best representation of PHP Language in my opinion. It is the by far most in built functionality Framework. Creator has seriously put his own heart to make it and right now maintaining. Every Laravel events, we will see there is always new and new coming ready with this Framework, and that is why It is the most trusted framework among the PHP Community. It provides us the power to whatever we can build and play with this structure, with in scope and also with out its scope if you have in-depth knowledge of Latest PHP version.

Laravel 5.5 New Features

  1. Custom validation rules object.
  2. Returns response data from the validator.
  3. Improvements with the default error views.
  4. Great support for the custom error reporting.
  5. Support for email themes in mailable.
  6. We can render mailable in the browser.
  7. Vendor packages have provider support.
  8. It adds front end presets, which means we can use Vue, React.js or none of them if we want.
  9. Laravel Migrate Fresh command.
  10. Whoops, which was there in Laravel 4.2 is back in Laravel 5.5
  11. Laravel Package Auto Discovery.

Installation Requirments

  • PHP >= 7.0.0
  • OpenSSL PHP Extension
  • PDO PHP Extension
  • Mbstring PHP Extension
  • Tokenizer PHP Extension
  • XML PHP Extension
Note:  Here Laravel 5.5 requires PHP 7 or above version. If you have PHP version like 5.4, 5.5, 5.6, then It will not work. Please upgrade it to PHP 7

Laravel 5.5 CRUD Tutorial From Scratch

Step 1: Installing The Laravel 5.5 Framework.

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

It will create a directory and install all the Laravel specific dependencies.

Note: Here, we are not going to in detail about front end dependencies like Vue.js or React.js using Laravel Mix so, we are not going to install any of the Node dependencies right now.

Step 2: Setup a MySQL database in .env file.

Create one database in MySQL and then switch to your editor and open the .env file.

// .env

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=Laravel55
DB_USERNAME=root
DB_PASSWORD=mysql

I have setup my local database credentials. You just need to change last three constants and you are ready to go.

Now, migrate two tables provided by Laravel 5.5. Switch to your terminal and type following command.

php artisan migrate

It will create two tables in your database.

  1. users
  2. password_resets

Step 3: Create a model as well as migration file for our Products table.

Type the following command in your terminal.

php artisan make:model Product -m

It will create two files.

  1. Product.php model.
  2. create_products_table migration file.

We need to create Schema for the products table. So navigate to Laravel55  >>  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();
    });
}

So, for our products table, there will be 5 columns. timestamps() have 2 columns

  1. created_at
  2. updated_at

Now, migrate the table by the following command.

php artisan migrate

In the database, you can see the products table.

Step 4:  Make one view file to add the form data in the database.

Make one folder called products and then create a file in the resources  >>  views  >>  products  >>  create.blade.php and put the following code in it.

<!-- create.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>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>

Step 5: Create one controller and route to display the Product form

Go to the terminal and type the following command.

php artisan make:controller ProductController --resource

It will create one controller file called ProductController.php and It has all the CRUD Functions, we need to seek.

Here, we have used resource parameter, so by default, It provides us some routing patterns,  but right now, we will not see until we register one route in routes  >>  web.php file. So let us do it.

// web.php

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

Now, switch to your terminal and type the following command.

php artisan route:list

You will see following route list.

Laravel 5.5 crud

 

Next step would be to go to ProductController.php file and add into create() function some code.

// ProductController.php

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

After that, we need to start Laravel Development server. So in the terminal, hit the following command.

php artisan serve

Switch to the browser and hit this URL: http://localhost:8000/products/create
You will see the following screen.
Laravel 5.5 Tutorial Step By Step

Step 6: Put the Laravel 5.5 Validation in Product Form.

First, we need to apply an action to our product creation form.

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

<form method="post" action="{{url('products')}}">

Now, we need to handle CSRF issue. So, put the following code in the form

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

{{csrf_field()}}

We also need to handle Mass Assignment Exception. So we need to go to app  >>  Product.php  file and in that put the protected $fillable property in it.

// Product.php

protected $fillable = ['name','price'];

If you see the resource routes then it has post request has ‘/products‘ route and store function in ProductController.php file. So we need to code the store function in order to save the data in the database.

One thing to keep in mind that, we need to include the namespace of Product.php  model in the ProductController.php file. So type the following line at the starting of ProductController.php file.

use App\Product;

Also, we need to put the validation there.

// 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');;
    }

Now, if validation fails then we need to show an error. So go back to create.blade.php and put the following code after h2 tag.

<!-- create.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>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>

At last, go to the browser and hit the development Laravel URL: http://localhost:8000

If you submit the form without any value then, you can see the errors like below image.

Laravel 5.5 Validation Example From Scratch

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');
  }
In Laravel 5.5 we directly get the array of the values return by validation function and use it to insert in the database, which is new feature in Laravel 5.5

Step 7: Make an index page to list the products.

For that, first, we need to send the data to the index.blade.php. So, in ProductController.php file, we need to write the code to fetch the data and return it to the index view.

// 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'));
    }

In resources  >>  views  >>  products, create one blade file called index.blade.php file and put the following code in it.

<!-- 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>

So, when you hit the URL: http://localhost:8000/products

 

Laravel 5.5 crud example from scratch

Step 8: Make an edit view for update the products.

Our step will be to add the edit function in ProductController.php file and put the following code in it.

// 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'));
    }

Now, make an edit.blade.php file inside resources  >>  views  >>  products

<!-- 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>

A further step would be to code the update function.

// 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');
    }

Step 9: Delete the 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');
    }

Our Laravel 5.5 CRUD Tutorial With Example From Scratch is over. I put the Github Link over here.

Download On Github

Github Steps:

  1. Clone the repository.
  2. Type this command: composer update
  3. Configure the database in the .env file.
  4. Start the Laravel development server: php artisan serve
  5. Switch to the URL: http://localhost:8000/products/create

The post Laravel 5.5 Tutorial With Example From Scratch appeared first on AppDividend.

]]>
https://appdividend.com/2017/08/20/laravel-5-5-tutorial-example/feed/ 35