Add Authentication (Login, Register, Logout)

Step 12 — Add Authentication (Login, Register, Logout)

In this step, we’ll add authentication to your Laravel 12 CRUD app.
This means users will be able to register, log in, and log out, and only logged-in users can create, edit, or delete posts.

Step 1 — Install Laravel UI

By default, Laravel 12 doesn’t come with built-in authentication.
We’ll use the Laravel UI package to easily generate it.

Run these commands in your terminal:


composer require laravel/ui
php artisan ui bootstrap --auth

This will automatically create:

Login, Register, and Logout pages
Authentication routes
Auth controllers and views
A sample HomeController

Step 2 — Install frontend dependencies

To include Bootstrap styles and JS for the authentication pages, run:


npm install
npm run dev

💡 If you don’t have Node.js installed, you can skip this step —
your app will still function without the Bootstrap styling.

Step 3 — Run migrations

Laravel already includes a migration for the users table.
Run the migration to create it in your database:


php artisan migrate

Now your database has a A users table to store registered users.

Step 4 — Protect routes (require login)

We only want logged-in users to manage posts.

Open your controller:

app/Http/Controllers/PostController.php

and add this inside the class:


public function __construct()
{
    $this->middleware('auth');
}

Now, all post-related routes require users to log in before accessing them.

Step 5 — Update routes

Open your routes/web.php file and replace the old routes with the following:


use Illuminate\Support\Facades\Route;
use App\Http\Controllers\PostController;

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
*/

Route::get('/', function () {
    return view('welcome');
});

// Authentication routes (login, register, logout)
Auth::routes();

// Redirect after login
Route::get('/home', function () {
    return redirect()->route('posts.index');
})->name('home');

// Protect post routes with authentication
Route::middleware('auth')->group(function () {
    Route::resource('posts', PostController::class);
});

✅ This setup ensures:

/register, /login, and /logout are available for all users.
/posts can only be accessed by logged-in users.
After login, users are redirected to the posts list.

Step 6 — Add Login/Logout links in the layout

Open your layout file:
resources/views/layouts/app.blade.php

Add this small navigation bar before the main container:


<nav class="navbar navbar-expand-lg navbar-light bg-light mb-4">
    <div class="container">
        <a class="navbar-brand" href="{{ url('/') }}">Laravel 12 CRUD</a>

        <ul class="navbar-nav ms-auto">
            @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') }}">Register</a></li>
            @else
                <li class="nav-item">
                    <span class="nav-link">Hi, {{ Auth::user()->name }}</span>
                </li>
                <li class="nav-item">
                    <form action="{{ route('logout') }}" method="POST" class="d-inline">
                        @csrf
                        <button type="submit" class="btn btn-link nav-link">Logout</button>
                    </form>
                </li>
            @endguest
        </ul>
    </div>
</nav>

Step 7 — Test the authentication

Now test your app:

Visit /register → create a new user account.
After login, you’ll be redirected to /home (which redirects to /posts).
Visit /posts → You can now create, edit, or delete posts.
Logout → try visiting /posts again — you’ll be redirected to the login page.

✅ Authentication works perfectly!

✅ Summary

You have successfully added authentication to your Laravel 12 CRUD app!

It now includes:

✅ Login
✅ Register
✅ Logout
✅ Protected Routes

Souy Soeng