Laravel 9 Custom Auth Login and Registration Tutorial

 ref: https://www.positronx.io/laravel-custom-authentication-login-and-registration-tutorial/

Laravel 9 Custom Auth Login and Registration Tutorial

Laravel custom login and registration tutorial; In this tutorial, we will explain how to create custom authentication login and registration in the Laravel application.

 

Laravel is a top-notch PHP framework that is a boon for web developers, and it offers numerous packages and plugins to build any type of functionality.

 

When we talk about the authentication feature, you can install and use the Laravel JetStream package.

 

Having said that, we are going to share with you the traditional method through which you can create custom authentication in laravel.

 

This quick guide, bit by bit, describes the simple method to build custom login, registration and dashboard pages or templates.

 

Laravel 9 Custom Auth Login and Registration Example

  • Step 1: Create Laravel App
  • Step 2: Connect to Database
  • Step 3: Set Up Auth Controller
  • Step 4: Create Auth Routes
  • Step 5: Create Auth Blade View Files
  • Step 6: Run Laravel Development Server

Create Laravel App

We assume you have already configured Composer on your system, run the following command to install the new laravel app. However, you can skip this step if the app is already installed.

composer create-project --prefer-dist laravel/laravel laravel_demo_app
Bash

Next, head over to app folder:

cd laravel_demo_app
Bash

Connect to Database

Now, you have to add database name, username, and password into the .env configuration file to connect the laravel app to the database:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=database_name
DB_USERNAME=database_user_name
DB_PASSWORD=database_password
Bash

If you are using MAMP local server in macOs; make sure to append UNIX_SOCKET and DB_SOCKET below database credentials in .env file.

UNIX_SOCKET=/Applications/MAMP/tmp/mysql/mysql.sock
DB_SOCKET=/Applications/MAMP/tmp/mysql/mysql.sock
Bash

The laravel app comes with a default User model and migration file, and we only have to run the following command to create the new table inside the database. So, get to the terminal and execute the following command to run the migration.

php artisan migrate
Bash

Set Up Auth Controller

Next, type the suggested command on the command prompt and execute the command to generate a new controller file by the name of CustomAuthController.

php artisan make:controller CustomAuthController
Bash

Thereafter, open app\Http\Controllers\CustomAuthController.php file and carefully place the following code within the file.

<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Hash;
use Session;
use App\Models\User;
use Illuminate\Support\Facades\Auth;
class CustomAuthController extends Controller
{
    public function index()
    {
        return view('auth.login');
    }  
      
    public function customLogin(Request $request)
    {
        $request->validate([
            'email' => 'required',
            'password' => 'required',
        ]);
   
        $credentials = $request->only('email', 'password');
        if (Auth::attempt($credentials)) {
            return redirect()->intended('dashboard')
                        ->withSuccess('Signed in');
        }
  
        return redirect("login")->withSuccess('Login details are not valid');
    }

    public function registration()
    {
        return view('auth.registration');
    }
      
    public function customRegistration(Request $request)
    {  
        $request->validate([
            'name' => 'required',
            'email' => 'required|email|unique:users',
            'password' => 'required|min:6',
        ]);
           
        $data = $request->all();
        $check = $this->create($data);
         
        return redirect("dashboard")->withSuccess('You have signed-in');
    }

    public function create(array $data)
    {
      return User::create([
        'name' => $data['name'],
        'email' => $data['email'],
        'password' => Hash::make($data['password'])
      ]);
    }    
    
    public function dashboard()
    {
        if(Auth::check()){
            return view('dashboard');
        }
  
        return redirect("login")->withSuccess('You are not allowed to access');
    }
    
    public function signOut() {
        Session::flush();
        Auth::logout();
  
        return Redirect('login');
    }
}
PHP

Create Auth Routes

This step explains how to create routes with POST and GET methods for handling custom authentication in laravel application. Consequently, open and add the recommended code in the routes/web.php file:

<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\CustomAuthController;

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
*/
Route::get('dashboard', [CustomAuthController::class, 'dashboard']); 
Route::get('login', [CustomAuthController::class, 'index'])->name('login');
Route::post('custom-login', [CustomAuthController::class, 'customLogin'])->name('login.custom'); 
Route::get('registration', [CustomAuthController::class, 'registration'])->name('register-user');
Route::post('custom-registration', [CustomAuthController::class, 'customRegistration'])->name('register.custom'); 
Route::get('signout', [CustomAuthController::class, 'signOut'])->name('signout');
PHP

Create Auth Blade View Files

You need to create auth folder in resources/views/ folder and likewise create a new login.blade.php file within, there after place the following code in resources/views/auth/login.blade.php file:

@extends('layouts.login')
@section('content')
<main class="login-form">
    <div class="cotainer">
        <div class="row justify-content-center">
            <div class="col-md-4">
                <div class="card">
                    <h3 class="card-header text-center">Login</h3>
                    <div class="card-body">
                        <form method="POST" action="{{ route('login.custom') }}">
                            @csrf
                            <div class="form-group mb-3">
                                <input type="text" placeholder="Email" id="email" class="form-control" name="email" required
                                    autofocus>
                                @if ($errors->has('email'))
                                <span class="text-danger">{{ $errors->first('email') }}</span>
                                @endif
                            </div>
                            <div class="form-group mb-3">
                                <input type="password" placeholder="Password" id="password" class="form-control" name="password" required>
                                @if ($errors->has('password'))
                                <span class="text-danger">{{ $errors->first('password') }}</span>
                                @endif
                            </div>
                            <div class="form-group mb-3">
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" name="remember"> Remember Me
                                    </label>
                                </div>
                            </div>
                            <div class="d-grid mx-auto">
                                <button type="submit" class="btn btn-dark btn-block">Signin</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
@endsection
PHP

You have to move to resources/views/auth folder, similarly create a new registration.blade.php file within, after that update the suggested code in the resources/views/auth/registration.blade.php file:

@extends('layouts.login')
@section('content')
<main class="signup-form">
    <div class="cotainer">
        <div class="row justify-content-center">
            <div class="col-md-4">
                <div class="card">
                    <h3 class="card-header text-center">Register User</h3>
                    <div class="card-body">
                        <form action="{{ route('register.custom') }}" method="POST">
                            @csrf
                            <div class="form-group mb-3">
                                <input type="text" placeholder="Name" id="name" class="form-control" name="name"
                                    required autofocus>
                                @if ($errors->has('name'))
                                <span class="text-danger">{{ $errors->first('name') }}</span>
                                @endif
                            </div>
                            <div class="form-group mb-3">
                                <input type="text" placeholder="Email" id="email_address" class="form-control"
                                    name="email" required autofocus>
                                @if ($errors->has('email'))
                                <span class="text-danger">{{ $errors->first('email') }}</span>
                                @endif
                            </div>
                            <div class="form-group mb-3">
                                <input type="password" placeholder="Password" id="password" class="form-control"
                                    name="password" required>
                                @if ($errors->has('password'))
                                <span class="text-danger">{{ $errors->first('password') }}</span>
                                @endif
                            </div>
                            <div class="form-group mb-3">
                                <div class="checkbox">
                                    <label><input type="checkbox" name="remember"> Remember Me</label>
                                </div>
                            </div>
                            <div class="d-grid mx-auto">
                                <button type="submit" class="btn btn-dark btn-block">Sign up</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
@endsection
PHP

Head over to resources/views/ folder, then create the new dashboard.blade.php file, then add the given below code in the resources/views/dashboard.blade.php file:

<!DOCTYPE html>
<html>
<head>
    <title>Custom Auth in Laravel</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <nav class="navbar navbar-light navbar-expand-lg mb-5" style="background-color: #e3f2fd;">
        <div class="container">
            <a class="navbar-brand mr-auto" href="#">PositronX</a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
                aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav">
                    @guest
                    <li class="nav-item">
                        <a class="nav-link" href="{{ route('login') }}">Login</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ route('register-user') }}">Register</a>
                    </li>
                    @else
                    <li class="nav-item">
                        <a class="nav-link" href="{{ route('signout') }}">Logout</a>
                    </li>
                    @endguest
                </ul>
            </div>
        </div>
    </nav>
    @yield('content')
</body>
</html>
PHP

Run Laravel Development Server

Finally, we need to run the laravel development server, which will help us start the app on the browser. Ensure that you execute the given below command through the command prompt.

php artisan serve
Bash

Add the following url on the browser’s address bar and test the app recklessly.

http://127.0.0.1:8000/login
Bash

Laravel custom authentication tutorial

Conclusion

Laravel custom authentication tutorial is over.

This quick guide helped us ascertain how to smoothly and effortlessly create a user login and user registration in the laravel app without using any third-party or external plugin or package.

 

View File Code :

 

https://drive.google.com/file/d/1aZ4hN7y7lfGuIlfXf4S2zjKGAck9P5dx/view?usp=share_link

 

Post a Comment

Previous Post Next Post