Laravel is world famous php framework.it has various features.Laravel is a MVC architecture. In this tutorial will see how to make a website with crud operation contact form in Laravel 8.Laravel 8 – CRUD application tutorial with Example. Here is the Best Place to Learn Laravel 8 Articles.
Lets do the Project Step by Step Laravel 8 From Scratch
First Step
In computer create the folder Laravel Projects.and open the folder. and type the address bar on cmd
Install Laravel 8
Create a new Project type the command on the command prompt . I create the project name basicweb
|
1 |
composer create-project --prefer-dist laravel/laravel basicweb |
Change .env File
Change .env File for username, password and DB Name
After that run check the application the welcome screen of Laravel framework look like this.
|
1 2 3 4 5 6 |
DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=3306 DB_DATABASE=basicweb DB_USERNAME=root DB_PASSWORD= |
After that run check the application the welcome screen of Laravel framework look like this.
|
1 |
php artisan serve |
Create Controller
Create the controller name which is WelcomeController
Create the controller name which is AboutController
Create the controller name which is ServiceController
Create the controller name which is ContactController
|
1 2 3 4 |
php artisan make:controller ContactController --resource php artisan make:controller WelcomeController --resource php artisan make:controller ServiceController –resource php artisan make:controller AboutController –resource |
Create Views
Create a Folder inside the resources-views
Create the following pages
welcome.blade.php
Service.blade.php
About.blade.php
Contact.blade.php
layout.blade.php
In Laravel you have create the pages using pagename.blade.php
Create page layout.blade.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<!DOCTYPE html> <html> <head> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script> </head> <body> <div class="container"> <div class="jumbotron"> <h1>TutusFunny</h1> </div> <a href="{{ url('/') }}" class="btn btn-warning">Home</a> <a href="{{ url('/about') }}" class="btn btn-warning">About</a> <a href="{{ url('/service') }}" class="btn btn-warning">Service</a> <a href="{{ url('/contact/create') }}" class="btn btn-warning">Contact</a> </div> @yield('content') </br> <div class="card bg-light text-dark"> <div class="card-body">Copyright 2021 tutusfunny.com</div> </div> </body> <html> |
welcome.blade.php
|
1 2 3 4 5 6 7 8 9 10 11 12 |
@extends("layout") @section('content') <div class="card"> <div class="card-header">Welcome Page</div> <div class="card-body">This Welcome</div> </div> @stop |
service.blade.php
|
1 2 3 4 5 6 7 8 9 10 11 12 |
@extends("layout") @section('content') <div class="card"> <div class="card-header">Service Page</div> <div class="card-body">This Service</div> </div> @stop |
about.blade.php
|
1 2 3 4 5 6 7 8 9 10 11 12 |
@extends("layout") @section('content') <div class="card"> <div class="card-header">About Page</div> <div class="card-body">This About</div> </div> @stop |
Create a Folder inside the resources-views
inside the views folder create the contacts folder
inside the folder create the following pages
create.blade.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
@extends("layout") @section('content') <div class="card"> <div class="card-header">Contactus Page</div> <div class="card-body"> <form action="{{ url('contact') }}" method="post"> {!! csrf_field() !!} <label>Name</label></br> <input type="text" name="name" id="name" class="form-control"></br> <label>Subject</label></br> <input type="text" name="subject" id="subject" class="form-control"></br> <label>Message</label></br> <input type="text" name="message" id="message" class="form-control"></br> <input type="submit" value="Save" class="btn btn-success"></br> </form> </div> </div> @stop |
index.blade.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
@extends("layout") @section('content') <div class="card"> <div class="card-header">Contactus Page</div> <div class="card-body"> @foreach($contacts as $contact) <h4>{{ $contact->name }}</h4> <h6>{{ $contact->subject }}</h6> <p>{{ $contact->message }}</p> <a href="{{ url('contact'). '/' .$contact->id}}" class="btn btn-info">View </a> <a href="{{ url('contact'). '/' .$contact->id. '/edit' }}" class="btn btn-info">Edit </a> </hr> @endforeach </div> </div> @stop |
edit.blade.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
@extends("layout") @section('content') <div class="card"> <div class="card-header">Contactus Page</div> <div class="card-body"> <form action="{{ url('contact/' .$contact->id) }}" method="post"> {!! csrf_field() !!} @method("PATCH") <input type="hidden" name="id" id="id" value="{{$contact->id}}" id="id" /> <label>Name</label></br> <input type="text" name="name" id="name" value="{{$contact->name}}" class="form-control"></br> <label>Subject</label></br> <input type="text" name="subject" id="subject" value="{{$contact->subject}}" class="form-control"></br> <label>Message</label></br> <input type="text" name="message" id="message" value="{{$contact->message}}" class="form-control"></br> <input type="submit" value="Update" class="btn btn-success"></br> </form> </div> </div> @stop |
show.blade.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
@extends("layout") @section('content') <div class="card"> <div class="card-header">Contactus Page</div> <div class="card-body"> <h4>{{ $contact->name }}</h4> <h6>{{ $contact->subject }}</h6> <p>{{ $contact->message }}</p> <a href="{{ url('contacts'). '/' .$contact->id}}" class="btn btn-info">View </a> </hr> </div> </div> @stop |
thanks.blade.php
|
1 2 3 4 5 6 7 8 9 10 11 12 |
@extends("layout") @section('content') <div class="card"> <div class="card-body"> <h2>Thank you for Contact US</h2> </div> </div> </div> @stop |
Controller
After that Pass All view pages through Controller. you have to add the Model namespace here
use App\Models\Contact; Data is coming from the database via Model.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 |
<?php namespace App\Http\Controllers; use App\Models\Contact; use Illuminate\Http\Request; class ContactController extends Controller { public function index() { $contacts = Contact::all(); return view ('contact.index')->with('contacts', $contacts); } public function create() { return view('contact.create'); } public function store(Request $request) { $input = $request->all(); Contact::create($input); return view('contact.thanks'); } public function show($id) { $contact = Contact::find($id); return view('contact.show')->with('contact', $contact); } public function edit($id) { $contact = Contact::find($id); return view('contact.edit')->with('contact', $contact); } public function update(Request $request, $id) { $contact = Contact::find($id); $input = $request->all(); $contact->update($input); return view('contact.thanks'); } public function destroy($id) { } } |
Routes
Pages are Manage through routes. If you are crud system simple you can add it the routes one line look like this
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<?php use Illuminate\Support\Facades\Route; use App\Http\Controllers\WelcomeController; use App\Http\Controllers\ServiceController; use App\Http\Controllers\AboutController; use App\Http\Controllers\ContactController; Route::get('/', [WelcomeController::class, 'index']); Route::get('/service', [ServiceController::class, 'index']); Route::get('/about', [AboutController::class, 'index']); Route::resource('/contact', ContactController::class); |
Create Model
Model is used to get the data from the database.
Create the Model name which is Contact
|
1 |
php artisan make:model Contact |
After Model is Created the look like this. Code inside Model Class (app\Models\)
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Model; class Contact extends Model { protected $table = "contacts"; protected $primarykey = "id"; protected $fillable = ["name","subject","message"]; } |
Create Migration
Create the tables
|
1 |
php artisan make:migration create_contacts_table |
|
1 2 3 4 5 6 7 8 9 10 |
public function up() { Schema::create('contacts', function (Blueprint $table) { $table->id(); $table->string('name'); $table->string('subject'); $table->string('message'); $table->timestamps(); }); } |
|
1 |
php artisan migrate |
i have attached the video link below. which will do this tutorials step by step.
