Login dan Logout Laravel 9 - Selamat datang di website CopyPasteKode, pada tutorial kali ini kita akan belajar bagaimana cara membuat fitur login pada Laravel 9.
Pada Laravel sendiri sebenarnya sudah mempunyai plugins tersendiri diantaranya yaitu Laravel Breeze dan Laravel Jetstream untuk menangani proses login, register, forgot password dan lain-lain yang menyangkut autentikasi (Authentication) dan autorisasi (Authorization) yang bisa teman-teman pelajari pada dokumentasi Laravel : https://laravel.com/docs/9.x/starter-kits
Untuk tutorial kali ini kita akan belajar cara membuat Login dan Logout pada Laravel secara manual
Perlu teman-teman ketahui bahwa tutorial ini merupakan tutorial bersambung, maka dari itu saya sarankan teman-teman semua untuk mengikuti tutorial Laravel ini dari awal.
Berikut adalah seri tutorial Laravel sebelumnya :
- #1 Tutorial Instalasi Laravel
- #2 Tutorial Templating Laravel
- #3 Tutorial CRUD Laravel
- #4 Tutorial Filter & Search with Pagination Laravel
Disini saya mengasumsikan jika teman-teman sudah mengikuti tutorial Laravel ini dari awal, sehingga teman-teman tidak mengalami kesulitan nantinya dalam mengikuti tutorial ini.
Sebelum kita mulai tutorialnya ada baiknya jika kita mengetahui terlebih dahulu prosedur atau langkah-langkah yang akan kita lakukan, langkah-langkah sebagai berikut :
- Menambahkan tabel users
- Dummy Data / Fake Data
- Membuat Controllers Login
- Membuat Views Login
- Menambahkan Routes Login & Logout
- Konfigurasi RouteServiceProvider
- Testing Login & Logout
Setelah mengetahui prosedur atau langkah-langkah yang harus dikerjakan, langsung saja kita mulai dengan langkah yang pertama.
Memambahkan tabel users
Ketikan perintah berikut pada terminal :
php artisan migrate:refresh --path=database/migrations/2014_10_12_000000_create_users_table.php
Tunggu sampai proses migrate selesai.
Dummy Data / Fake Data
Pada saat proses login tentunya kita membutuhkan data user berupa username / email dan password yang sudah terinput ke database, agar bisa melewati proses login tersebut, dengan menggunakan Factory Pada Laravel kita tidak perlu melakukan input data user secara manual pada database.
Ketikan perintah berikut pada terminal :
php artisan tinker
User::factory()->count(1)->create()Membuat Controllers Login
Ketikan perintah dibawah pada terminal :
php artisan make:controller LoginControllerTunggu sampai proses pembuatan Controllers dengan nama LoginController selesai dibuat, kemudian tambahkan script berikut pada LoginController :
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
class LoginController extends Controller
{
public function index()
{
$data = array(
'title' => 'Form Login',
);
return view('auth/login', $data);
}
public function authenticate(Request $request)
{
$rules = [
'email' => ['required', 'email'],
'password' => ['required'],
];
$customMessages = [
'email.required' => ':attribute tidak boleh kosong!',
'password.required' => ':attribute tidak boleh kosong!',
];
$credentials = $this->validate($request, $rules, $customMessages);
if (Auth::attempt($credentials)) {
$request->session()->regenerate();
return redirect()->intended('dashboard');
}
return back()->with('error', 'Login Gagal!');
}
public function logout(Request $request)
{
Auth::logout();
$request->session()->invalidate();
$request->session()->regenerateToken();
return redirect('/');
}
}
Membuat Views Login
@extends('auth.templates.index')
@section('content')
<div class="login-box">
<!-- /.login-logo -->
<div class="card card-outline card-primary">
<div class="card-header text-center">
<h1><b>Admin</b>LTE</h1>
</div>
<div class="card-body">
<p class="login-box-msg">Sign in to start your session</p>
@if (session('error'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
{{ session('error') }}
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
@endif
<form action="/login" method="post">
@csrf
<div class="input-group mb-3">
<input name="email" type="email" class="form-control @error('email') is-invalid @enderror"
placeholder="Email" value="{{ old('email') }}">
<div class="input-group-append">
<div class="input-group-text">
<span class="fas fa-envelope"></span>
</div>
</div>
@error('email')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
<div class="input-group mb-3">
<input name="password" type="password" class="form-control @error('password') is-invalid @enderror"
autocomplete="off" placeholder="Password">
<div class="input-group-append">
<div class="input-group-text">
<span class="fas fa-lock"></span>
</div>
</div>
@error('password')
<div class="invalid-feedback">
{{ $message }}
</div>
@enderror
</div>
<div class="float-right">
<button type="submit" class="btn btn-primary btn-block">Sign In</button>
</div>
</form>
<p class="mb-1">
<a href="forgot-password.html">I forgot my password</a>
</p>
<p class="mb-0">
<a href="register.html" class="text-center">Register a new membership</a>
</p>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.login-box -->
@endsection
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ $title }}</title>
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
<link rel="stylesheet" href="{{ url('plugins/fontawesome-free/css/all.min.css') }}">
<link rel="stylesheet" href="{{ url('plugins/overlayScrollbars/css/OverlayScrollbars.min.css') }}">
<link rel="stylesheet" href="{{ url('dist/css/adminlte.min.css') }}">
</head>
<body class="hold-transition login-page">
@yield('content')
<script src="{{ url('plugins/jquery/jquery.min.js') }}"></script>
<script src="{{ url('plugins/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
<script src="{{ url('dist/js/adminlte.js') }}"></script>
</body>
</html>
Membuat Controllers Login
Route::get('/login', [LoginController::class, 'index'])->name('login')->middleware('guest');
Route::post('/login', [LoginController::class, 'authenticate']);
Route::get('/logout', [LoginController::class, 'logout'])->name('logout');Route::get('/dashboard', [Dashboard::class, 'index']);
Route::resource('mahasiswa', MahasiswaController::class);Route::get('/dashboard', [Dashboard::class, 'index'])->name('dashboard')->middleware('auth');
Route::resource('mahasiswa', MahasiswaController::class)->middleware('auth');Konfigurasi RouteServiceProvider
public const HOME = '/home'; public const HOME = '/';Testing Login & Logout
