Download Laravel App
composer create-project --prefer-dist laravel/laravel my-app
C:\xampp\htdocs\laravel10project>composer create-project laravel/laravel laravel10project
Connecting our Database
open .env file root directory.
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laraveldb
DB_USERNAME=root
DB_PASSWORD=
Create Controller ProductController php artisan make:controller ProductController --resource
C:\xampp\htdocs\laravel\laravel10project>php artisan make:controller ProductController --resource
app\Http\Controllers\ProductController.php
//app\Http\Controllers\ProductController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Product;
class ProductController extends Controller
{
/**
* Display a listing of the resource.
*/
public function index()
{
$product = Product::orderBy('created_at', 'DESC')->get();
return view('product.index', compact('product'));
}
/**
* Show the form for creating a new resource.
*/
public function create()
{
return view('product.create');
}
/**
* Store a newly created resource in storage.
*/
public function store(Request $request)
{
Product::create($request->all());
return redirect()->route('product.index')->with('success', 'Product added successfully');
}
/**
* Display the specified resource.
*/
public function show(string $id)
{
$product = Product::findOrFail($id);
return view('product.show', compact('product'));
}
/**
* Show the form for editing the specified resource.
*/
public function edit(string $id)
{
$product = Product::findOrFail($id);
return view('product.edit', compact('product'));
}
/**
* Update the specified resource in storage.
*/
public function update(Request $request, string $id)
{
$product = Product::findOrFail($id);
$product->update($request->all());
return redirect()->route('product.index')->with('success', 'product updated successfully');
}
/**
* Remove the specified resource from storage.
*/
public function destroy(string $id)
{
$product = Product::findOrFail($id);
$product->delete();
return redirect()->route('product.index')->with('success', 'product deleted successfully');
}
}
Database Migration C:\xampp\htdocs\laravel\laravel10project>php artisan make:model Product -m
database/migrations/create_products_table.php
//database/migrations/create_products_table.php
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
public function up(): void
{
Schema::create('products', function (Blueprint $table) {
$table->id();
$table->string('title');
$table->string('price');
$table->string('product_code');
$table->text('description');
$table->timestamps();
});
}
public function down(): void
{
Schema::dropIfExists('products');
}
};
run this migration C:\xampp\htdocs\laravel\laravel10project>php artisan migrate
open app/Product.php and update the below field
app/Models/Product.php
//app/Models/Product.php
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Product extends Model
{
use HasFactory;
protected $fillable = [
'title',
'price',
'product_code',
'description'
];
}
Create Blade View Bootstrap 5 https://getbootstrap.com/docs/5.3/getting-started/download/
create folder layouts and product
resources/views/layouts/app.blade.php
//resources/views/layouts/app.blade.php
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Laravel 10 CRUD (Create, Read, Update and Delete)</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
</head>
<body>
@include('layouts.navbar')
<div class="container py-5">
@yield('body')
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
</body>
</html>
resources/views/layouts/navbar.blade.php
//resources/views/layouts/navbar.blade.php
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="container">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ route('product.index') }}">Product</a>
</li>
</ul>
</div>
</div>
</nav>
resources/views/product/create.blade.php
//resources/views/product/create.blade.php
@extends('layouts.app')
@section('body')
<h1 class="mb-0">Add Book</h1>
<hr />
<form action="{{ route('product.store') }}" method="POST">
@csrf
<div class="row mb-3">
<div class="col">
<input type="text" name="title" class="form-control" placeholder="Title">
</div>
<div class="col">
<input type="text" name="price" class="form-control" placeholder="Price">
</div>
</div>
<div class="row mb-3">
<div class="col">
<input type="text" name="product_code" class="form-control" placeholder="Product Code">
</div>
<div class="col">
<textarea class="form-control" name="description" placeholder="Descriptoin"></textarea>
</div>
</div>
<div class="row">
<div class="d-grid">
<button class="btn btn-primary">Submit</button>
</div>
</div>
</form>
@endsection
resources/views/product/edit.blade.php
//resources/views/product/edit.blade.php
@extends('layouts.app')
@section('body')
<h1 class="mb-0">Edit Product</h1>
<hr />
<form action="{{ route('product.update', $product->id) }}" method="POST">
@csrf
@method('PUT')
<div class="row">
<div class="col mb-3">
<label class="form-label">Title</label>
<input type="text" name="title" class="form-control" placeholder="Title" value="{{ $product->title }}" >
</div>
<div class="col mb-3">
<label class="form-label">Price</label>
<input type="text" name="price" class="form-control" placeholder="Price" value="{{ $product->price }}" >
</div>
</div>
<div class="row">
<div class="col mb-3">
<label class="form-label">Product Code</label>
<input type="text" name="product_code" class="form-control" placeholder="Product Code" value="{{ $product->product_code }}" >
</div>
<div class="col mb-3">
<label class="form-label">Description</label>
<textarea class="form-control" name="description" placeholder="Descriptoin" >{{ $product->description }}</textarea>
</div>
</div>
<div class="row">
<div class="d-grid">
<button class="btn btn-warning">Update</button>
</div>
</div>
</form>
@endsection
resources/views/product/index.blade.php
//resources/views/product/index.blade.php
@extends('layouts.app')
@section('body')
<div class="d-flex align-items-center justify-content-between">
<h1 class="mb-0">List Product</h1>
<a href="{{ route('product.create') }}" class="btn btn-primary">Add Product</a>
</div>
<hr />
@if(Session::has('success'))
<div class="alert alert-success" role="alert">
{{ Session::get('success') }}
</div>
@endif
<table class="table table-hover">
<thead class="table-primary">
<tr>
<th>#</th>
<th>Title</th>
<th>Price</th>
<th>Product Code</th>
<th>Description</th>
<th>Action</th>
</tr>
</thead>
<tbody>
@if($product->count() > 0)
@foreach($product as $rs)
<tr>
<td class="align-middle">{{ $loop->iteration }}</td>
<td class="align-middle">{{ $rs->title }}</td>
<td class="align-middle">{{ $rs->price }}</td>
<td class="align-middle">{{ $rs->product_code }}</td>
<td class="align-middle">{{ $rs->description }}</td>
<td class="align-middle">
<div class="btn-group" role="group" aria-label="Basic example">
<a href="{{ route('product.show', $rs->id) }}" type="button" class="btn btn-secondary">Detail</a>
<a href="{{ route('product.edit', $rs->id)}}" type="button" class="btn btn-warning">Edit</a>
<form action="{{ route('product.destroy', $rs->id) }}" method="POST" type="button" class="btn btn-danger p-0" onsubmit="return confirm('Delete?')">
@csrf
@method('DELETE')
<button class="btn btn-danger m-0">Delete</button>
</form>
</div>
</td>
</tr>
@endforeach
@else
<tr>
<td class="text-center" colspan="5">Product not found</td>
</tr>
@endif
</tbody>
</table>
@endsection
resources/views/product/show.blade.php
//resources/views/product/show.blade.php
@extends('layouts.app')
@section('body')
<h1 class="mb-0">Detail Product</h1>
<hr />
<div class="row">
<div class="col mb-3">
<label class="form-label">Title</label>
<input type="text" name="title" class="form-control" placeholder="Title" value="{{ $product->title }}" readonly>
</div>
<div class="col mb-3">
<label class="form-label">Price</label>
<input type="text" name="price" class="form-control" placeholder="Price" value="{{ $product->price }}" readonly>
</div>
</div>
<div class="row">
<div class="col mb-3">
<label class="form-label">product_code</label>
<input type="text" name="product_code" class="form-control" placeholder="Product Code" value="{{ $product->product_code }}" readonly>
</div>
<div class="col mb-3">
<label class="form-label">Description</label>
<textarea class="form-control" name="description" placeholder="Descriptoin" readonly>{{ $product->description }}</textarea>
</div>
</div>
<div class="row">
<div class="col mb-3">
<label class="form-label">Created At</label>
<input type="text" name="created_at" class="form-control" placeholder="Created At" value="{{ $product->created_at }}" readonly>
</div>
<div class="col mb-3">
<label class="form-label">Updated At</label>
<input type="text" name="updated_at" class="form-control" placeholder="Updated At" value="{{ $product->updated_at }}" readonly>
</div>
</div>
@endsection
Define Route routes/web.php
//routes/web.php
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\ProductController;
Route::get('/', function () {
return view('welcome');
});
Route::resource('/product', ProductController::class);
Run C:\xampp\htdocs\laravel\laravel10project>php artisan serve Starting Laravel development server: http://127.0.0.1:8000
