Today, We want to share with you custom login in laravel.In this post we will show you laravel login and registration example, hear for auth middleware in laravel we will give you demo and example for implement.In this post, we will learn about PHP Laravel 6 Sessions Tutorial with an example.
Laravel 7/6 Custom Login Registration Example Tutorial
In this tutorial we learn to all about custom login in laravel Examples like as a laravel 7 make auth, laravel 5 login tutorial, laravel/ui:auth, auth middleware in laravel or many more.
Install Laravel Fresh New Setup
composer create-project --prefer-dist laravel/laravel Blog
Setup Database
DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=3306 DB_DATABASE=pakainfo_users DB_USERNAME=4cgandhi DB_PASSWORD=infinityhionknsjhd54
php artisan migrate
Make Route
Route::get('login', '[email protected]');
Route::post('post-login', '[email protected]');
Route::get('registration', '[email protected]');
Route::post('post-registration', '[email protected]');
Route::get('dashboard', '[email protected]');
Route::get('logout', '[email protected]');
CustomLoginController.php
php artisan make:controller CustomLoginController
app/controllers/CustomLoginController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Validator,Redirect,Response;
Use App\User;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Hash;
use Session;
class CustomLoginController extends Controller
{
public function index()
{
return view('login');
}
public function registration()
{
return view('registration');
}
public function postLogin(Request $request)
{
request()->validate([
'email' => 'required',
'password' => 'required',
]);
$credentials = $request->only('email', 'password');
if (Auth::attempt($credentials)) {
// Authentication passed...
return redirect()->intended('dashboard');
}
return Redirect::to("login")->withSuccess('Oppes! You have entered invalid credentials');
}
public function postRegistration(Request $request)
{
request()->validate([
'name' => 'required',
'email' => 'required|email|unique:users',
'password' => 'required|min:6',
]);
$data = $request->all();
$check = $this->create($data);
return Redirect::to("dashboard")->withSuccess('Great! You have Successfully loggedin');
}
public function dashboard()
{
if(Auth::check()){
return view('dashboard');
}
return Redirect::to("login")->withSuccess('Opps! You do not have access');
}
public function create(array $data)
{
return User::create([
'name' => $data['name'],
'email' => $data['email'],
'password' => Hash::make($data['password'])
]);
}
public function logout() {
Session::flush();
Auth::logout();
return Redirect('login');
}
}
Create 3 Main Blade view
Login Blade.php
<!DOCTYPE html>
<html>
<head>
<title>Login Form - Pakainfo.com</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="{{url('style.css')}}">
</head>
<body>
<div class="container-fluid">
<div class="row no-gutter">
<div class="d-none d-md-flex col-md-4 col-lg-6 bg-image"></div>
<div class="col-md-8 col-lg-6">
<div class="login d-flex align-items-center py-5">
<div class="container">
<div class="row">
<div class="col-md-9 col-lg-8 mx-auto">
<h3 class="login-heading mb-4">Welcome back!</h3>
<form action="{{url('post-login')}}" method="POST" id="logForm">
{{ csrf_field() }}
<div class="form-label-group">
<input type="email" name="email" id="inputEmail" class="form-control" placeholder="Email address" >
<label for="inputEmail">Email address</label>
@if ($errors->has('email'))
<span class="error">{{ $errors->first('email') }}</span>
@endif
</div>
<div class="form-label-group">
<input type="password" name="password" id="inputPassword" class="form-control" placeholder="Password">
<label for="inputPassword">Password</label>
@if ($errors->has('password'))
<span class="error">{{ $errors->first('password') }}</span>
@endif
</div>
<button class="btn btn-lg btn-primary btn-block btn-login text-uppercase font-weight-bold mb-2" type="submit">Sign In</button>
<div class="text-center">If you have an account?
<a class="small" href="{{url('registration')}}">Sign Up</a></div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Registration.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Registration Form - Pakainfo.com</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="{{url('style.css')}}">
</head>
<body>
<div class="container-fluid">
<div class="row no-gutter">
<div class="d-none d-md-flex col-md-4 col-lg-6 bg-image"></div>
<div class="col-md-8 col-lg-6">
<div class="login d-flex align-items-center py-5">
<div class="container">
<div class="row">
<div class="col-md-9 col-lg-8 mx-auto">
<h3 class="login-heading mb-4">Register here!</h3>
<form action="{{url('post-registration')}}" method="POST" id="regForm">
{{ csrf_field() }}
<div class="form-label-group">
<input type="text" id="inputName" name="name" class="form-control" placeholder="Full name" autofocus>
<label for="inputName">Name</label>
@if ($errors->has('name'))
<span class="error">{{ $errors->first('name') }}</span>
@endif
</div>
<div class="form-label-group">
<input type="email" name="email" id="inputEmail" class="form-control" placeholder="Email address" >
<label for="inputEmail">Email address</label>
@if ($errors->has('email'))
<span class="error">{{ $errors->first('email') }}</span>
@endif
</div>
<div class="form-label-group">
<input type="password" name="password" id="inputPassword" class="form-control" placeholder="Password">
<label for="inputPassword">Password</label>
@if ($errors->has('password'))
<span class="error">{{ $errors->first('password') }}</span>
@endif
</div>
<button class="btn btn-lg btn-primary btn-block btn-login text-uppercase font-weight-bold mb-2" type="submit">Sign Up</button>
<div class="text-center">If you have an account?
<a class="small" href="{{url('login')}}">Sign In</a></div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Dashbaord.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Dashboard - Pakainfo.com</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="{{url('style.css')}}">
</head>
<body>
<div class="container-fluid">
<div class="row no-gutter">
<div class="d-none d-md-flex col-md-4 col-lg-6 bg-image"></div>
<div class="col-md-8 col-lg-6">
<div class="login d-flex align-items-center py-5">
<div class="container">
<div class="row">
<div class="col-md-9 col-lg-8 mx-auto">
<h3 class="login-heading mb-4">Welcome To Pakainfo!</h3>
<div class="card">
<div class="card-body">
Welcome {{ ucfirst(Auth()->user()->name) }}
</div>
<div class="card-body">
<a class="small" href="{{url('logout')}}">Logout</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
style.css file inside app/public
:root {
--input-padding-x: 1.5rem;
--input-padding-y: 0.75rem;
}
.login,
.image {
min-height: 100vh;
}
.bg-image {
background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/28963/form-bk.jpg');
background-size: cover;
background-position: center;
}
.login-heading {
font-weight: 300;
}
.btn-login {
font-size: 0.9rem;
letter-spacing: 0.05rem;
padding: 0.75rem 1rem;
border-radius: 2rem;
}
.form-label-group {
position: relative;
margin-bottom: 1rem;
}
.form-label-group>input,
.form-label-group>label {
padding: var(--input-padding-y) var(--input-padding-x);
height: auto;
border-radius: 2rem;
}
.form-label-group>label {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
margin-bottom: 0;
/* Override default `<label>` margin */
line-height: 1.5;
color: #495057;
cursor: text;
/* Match the input under the label */
border: 1px solid transparent;
border-radius: .25rem;
transition: all .1s ease-in-out;
}
.form-label-group input::-webkit-input-placeholder {
color: transparent;
}
.form-label-group input:-ms-input-placeholder {
color: transparent;
}
.form-label-group input::-ms-input-placeholder {
color: transparent;
}
.form-label-group input::-moz-placeholder {
color: transparent;
}
.form-label-group input::placeholder {
color: transparent;
}
.form-label-group input:not(:placeholder-shown) {
padding-top: calc(var(--input-padding-y) + var(--input-padding-y) * (2 / 3));
padding-bottom: calc(var(--input-padding-y) / 3);
}
.form-label-group input:not(:placeholder-shown)~label {
padding-top: calc(var(--input-padding-y) / 3);
padding-bottom: calc(var(--input-padding-y) / 3);
font-size: 12px;
color: #777;
}
@supports (-ms-ime-align: auto) {
.form-label-group>label {
display: none;
}
.form-label-group input::-ms-input-placeholder {
color: #777;
}
}
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.form-label-group>label {
display: none;
}
.form-label-group input:-ms-input-placeholder {
color: #777;
}
}
.error{
color:red;
margin-left: 10px;
}
Run Development Server
php artisan serve php artisan serve --port=8080
Now we are ready to run our example so run bellow command to quick run.
http://localhost:5489/login
I hope you get an idea about custom login in laravel.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.