Tutorial Laravel Fortify #1 : Apa itu Laravel Fortify ?

Halo teman-teman semuanya, pada kesempatan kali ini kita semua akan
belajar bagaimana cara membuat Authentication di Laravel
menggunakan Laravel Fortify Jadi apa Laravel Fortify itu sendiri ? Laravel
Fortify merupakan backend uathentication yang digunakan oleh Laravel
Jetsream. Ya benar, bahwa Laravel Jetstream untuk proses authentication dia
menggunakan service yang dimiliki oleh Laravel Fortify.
Seperti, register, login, forgot password, reset password, sampai two-factor
authentication.

Disini kita dapat menggunakan Fortify (tanpa Jetstream) untuk membuat

sebuah backend authentication untuk aplikasi Laravel. Dengan menggunakan
Laravel Fortify kita diminta untuk membuat halaman template sendiri, disini
kita bisa bebas menggunakan pilihan template, seperti blade, vue dan yang
lain-lain.
Sebelum kita belajar langsung membuat project dengan Laravel Fortify, akan
lebih baik jika kita semua mengetahui lebih detail tentang Laravel Fortify,
seperti cara installasi, konfigurasi dan fitur-fitur yang disediakan.

Cara Installasi Laravel Fortify

Kita bisa menginstall Laravel Fortify dengan perintah di bawah ini :

composer require laravel/fortify

Saat installasi pastikan teman-teman harus terhubung dengan internet,

karena package ini akan diunduh secara online.

Publish Konfigurasi

Setelah kita berhasil menginstall Laravel Fortify di dalam project Laravel kita,
kita bisa melakukan publish konfigurasi, ini akan membantu kita untuk
melakukan kustomisasi fitur-fitur ataupun logika yang ada di dalam Laravel
Fortify. Silahkaan jalankan perintah di bawah ini :
php artisan vendor:publish --provider="Laravel\Fortify\FortifyServiceProvider"

Jika perintah di atas berhasil dijalankan, maka kita akan mendapatkan banyak
file-file config, diantaranya adalah :

 app/Actions/Fortify/
 app/config/fortify.php
 app/Providers/FortifyServiceProvider.php

Dimana semua file yang ada di dalam folder app/Actions/Fortify/ adalah

Backend service yang menangani proses Authentication di Laravel Fortify,
disini kita juga bisa melakuakn kustomisasi sesuai dengan kebutuhan kita,
misalnya ingin membuat rule baru untuk password dan yang lain-lain.
Kemudian untuk file app/config/fortify.php digunakan untuk melakukan
beberapa config, misalnya setting field username, guard, middleware dan
mengaktifkan serta menon-aktifkan fitur-fitur di dalam Laravel Fortify.

Dan untuk file app/Providers/FortifyServiceProvider.php merupakan provider yang

digunakan oleh Laravel Fortify. Setelah proses installasi Laravel Fortify
selesai kita harus melakukan registrasi provider ini di dalam
file app/config/app.php. Silahkan buka file tersebut dan tambahkan kurang lebih
seperti berikut ini :
/*
* Application Service Providers...
*/
....
App\Providers\FortifyServiceProvider::class,

Fitur-fitur Laravel Fortify

Untuk mengaktifkan dan menon-aktifkan fitur-fitur yang disediakan oleh

Laravel Fortify, kita bisa mengaturnya di dalam file app/config/app.php, kurang
lebih seperti berikut ini :
'features' => [
Features::registration(),
Features::resetPasswords(),
// Features::emailVerification(),
Features::updateProfileInformation(),
Features::updatePasswords(),
Features::twoFactorAuthentication([
'confirmPassword' => true,
]),
],

Di atas kita bisa dengan mudah mengaktifkan dan menon-aktifkan fitur-fitur di

Laravel Fortify, dan jika ingin mengaktifkan fitur untuk Two-factor, kita harus
membuat tampilannya sendiri.
Di artikel-artikel selanjutnya kita semua akan belajar untuk praktek membuat
Authentication menggunakan Laravel Fortify dan untuk tampilannya kita akan
menggunakan Bootstrap.

Tutorial Laravel Fortify #2 : Installasi dan Persiapan

Project Laravel
 

Halo teman-teman semuanya, pada kesempatan kali ini kita semua akan
belajar bagaimana cara installasi project Laravel baru yang akan kita gunakan
untuk praktek membuat Authentication dengan Laravel Fortify. Sebelum kita
mulai membuat project Laravel baru, pastikan teman-teman sudah
menginstall Composer terlebih dahulu.

Composer

Composer merupakan package manager di PHP untuk mempermudah developer

dalam menambahkan sebuah library atau plugin di dalam project yang di
bangun. Untuk installasi Composer bisa disesuaikan dengan sistem operasi
yang digunakan.

 Installasi Composer di Windows : https://getcomposer.org/doc/00-

intro.md#installation-windows
 Installasi Composer di Linux / Mac : https://getcomposer.org/doc/00-
intro.md#installation-linux-unix-macos

Untuk memastikan apakah komputer kita sudah terinstall Composer atau

belum, kita bisa mencoba menjalankan perintah di bawah ini di dalam
terminal/CMD :
composer

Jika berhasil, maka kurang lebih tampilannya seperti berikut ini :

Server Requirements

Sebelum kita lanjutkan membuat project Laravel baru, Laravel 8 sendiri

memiliki beberapa persyaratan yang harus dipenuhi, diantaranya adalah :
  PHP >= 7.3
 BCMath PHP Extension
 Ctype PHP Extension
 Fileinfo PHP extension
 JSON PHP Extension
 Mbstring PHP Extension
 OpenSSL PHP Extension
 PDO PHP Extension
 Tokenizer PHP Extension
 XML PHP Extension

Jika teman-teman menggunakan Homestead, maka syarat-syarat di atas

sudah otomatis terinstall di dalam komputer kita. Setelah persyaratan di atas
sudah terpenuhi, sekarang kita bisa lanjutkan untuk membuat project Laravel
bearu menggunakan Composer.

Langkah 1 - Installasi Laravel

Silahkan masuk ke dalam folder di mana kita akan menyimpan projectnya,

jika menggunakan XAMPP kita bisa masuk di dalam folder htdocs. Kemudian
jalankan perintah di bawah ini :
composer create-project --prefer-dist laravel/laravel laravel-fortify

Perintah di atas akan membuat project Laravel baru dengan nama laravel-

fortify silahkan tunggu proses installasiu sampai selesai, disini mungkin akan
mebutuhkan waktu agak lebih lama, karena semua paket akan diounduh
secara online.

Langkah 2 - Menjalankan Laravel

Setelah proses installasi selesai, sekarang kita bisa mencoba menjalankan

project Laravel tersebut menggunakan built-in server dari Laravel. Silahkan
jalankan perintah di bawah ini :
cd laravel-fortify
php artisan server

Jika berhasil, maka project Laravel kita akan dijalankan menggunakan

port 8000 di dalam localhost, kita bisa membukanya di http://localhost:8000
kurang lebih tampilannya seperti berikut ini :

Langkah 3 - Konfigurasi Database

Setelah kita berhasil menginstall project Laravel baru, sekarang kita lanjutkan
untuk mengatur koneksi database dan membuat database. SIlahkan buka
file .env kemudian cari kode berikut ini :
DB_DATABASE=laravel
DB_USERNAME=root
DB_PASSWORD=

kemudian ubah menjadi seperti berikut ini :

DB_DATABASE=db_laravel_fortify
DB_USERNAME=root
DB_PASSWORD=
Di atas untuk nama database yang akan kita gunakan
adalah db_laravel_fortify dan untuk password silahkan disesuaikan dengan
konfigurasi dari MySQL masing-masing, jika menggunakan XAMPP, maka
tidak perlu diisi.

Sekarang silahkan lanjutkan untuk membuat database baru dengan

nama db_laravel_fortify di dalam http://localhost/phpmyadmin, kurang lebih
seperti berikut ini :

Di artikel selanjutnya, kita semua akan belajar bersama-sama bagaimana

cara installasi Laravel fortify di dalam project Laravel kita. Terima Kasih
utorial Laravel Fortify #3 : Installasi dan Konfigurasi
Laravel Fortify
 

Halo teman-teman semuanya, diartikel sebelumnya kita semua seudah

belajar bersama-sama bagaimana cara installasi dan konfigurasi project baru
dengan Laravel. Dan pada kesempatan kali ini kita semua akan belajar
bagaimana cara installasi dan konfigurasi Laravel Fortify di dalam project
Laravel kita.

Laravel Fortify merupakan backend uathentication yang digunakan oleh

Laravel Jetsream. Ya benar, bahwa Laravel Jetstream untuk proses
authentication dia menggunakan service yang dimiliki oleh Laravel Fortify.
Seperti, register, login, forgot password, reset password, sampai two-
factor authentication. Langsung saja kita mulai.
Langkah 1 - Installasi Laravel Fortify

Silahkan masuk di dalam project Laravel yang sebelumnya kita sudah buat,
kemudian jalankan perintah di bawah ini untuk melakukan installasi Laravel
Fortify :
composer require laravel/fortify

Silahkan tunggu proses installasi sampai selesai, dan pastikan teman-teman

harus terhubung dengan interrnet, karena package ini akan diunduh secara
online.

Langkah 2 - Konfigurasi Laravel Fortify

Setelah proses installasi Laravel Fortify menggunakan Composer selesai,

sekarang kita lanjutkan untuk melakukan publish file-file konfigurasi dari
Laravel Fortify. Silahkan jalankan perintah di bawah ini :
php artisan vendor:publish --provider="Laravel\Fortify\FortifyServiceProvider"

Jika berhasil, kita akan mendapatkan banyak sekali file-file untuk kebutuhan
Authenticarion di dalam project Laravel kita, diantaranya adalah :

 app/Actions/Fortify/
 app/config/fortify.php
 app/Providers/FortifyServiceProvider.php

Di dalam folder app/Actions/Fortify/ ada beberapa file, dimana file-file inilah

yang akan digunakan untuk melakukan beberapa action, seperti Create
User, Password Validation, Reset Password, Update Password dan Update
Profile. Dimana disini kita juga bisa melakukan kustomisasi sesuai dengan
kebutuhan kita.
Untuk file app/config/fortify.php berisi bebepa konfigurasi yang ada di
dalam Laravel Fortify, seperti default Guard, Middleware, sampai fitur-fitur yang
ada di dalam Laravel Fortify.

Langkah 3 - Mengaktifkan Fitur Authentication

Sekarang kita akan mengaktifkan view untuk Authentication di Laravel Fortify.

Silahakn buka file app/Providers/FortifyServiceProvider.php  pada
function boot silahkan tambahkan kode berikut ini :
//register
Fortify::registerView(function () {
return view('auth.register');
});

//login
Fortify::loginView(function () {
return view('auth.login');
});

//forgot
Fortify::requestPasswordResetLinkView(function () {
return view('auth.forgot-password');
});

//reset
Fortify::resetPasswordView(function ($request) {
return view('auth.reset-password', ['request' => $request]);
});

Di atas untuk register kita akan menggunakan view dengan

nama register.blade.php yang berada di dalam folder auth. Kurang lebih
seperti berikut ini :
//register
Fortify::registerView(function () {
return view('auth.register');
});

Dan untuk proses login, kita menggunakan nama file login.blade.php di

dalam folder auth. Kurang lebih seperti ini :
//login
Fortify::loginView(function () {
return view('auth.login');
});

Kemudian untuk view yang akan kita gunakan untuk mengirim link reset
password yaitu forgot-password.blade.php yang berada di dalam folder auth.
Kurang lebih seperti berikut ini :
//forgot
Fortify::requestPasswordResetLinkView(function () {
return view('auth.forgot-password');
});

Setelah link berhasil dikirim melalui email, maka kita akan melakukan update
password. Dan untuk view yang akan kita gunakan yaitu reset-
password.blade.php yang nanti akan dibuat di dalam folder auth. Kurang lebih
seperti ini :
//reset
Fortify::resetPasswordView(function ($request) {
return view('auth.reset-password', ['request' => $request]);
});

Jika file app/Providers/FortifyServiceProvider.php  di tulis dengan lengkap,

kurang lebih seperti berikut ini :
<?php

namespace App\Providers;

use App\Actions\Fortify\CreateNewUser;
use App\Actions\Fortify\ResetUserPassword;
use App\Actions\Fortify\UpdateUserPassword;
use App\Actions\Fortify\UpdateUserProfileInformation;
use Illuminate\Support\ServiceProvider;
use Laravel\Fortify\Fortify;

class FortifyServiceProvider extends ServiceProvider

{
/**
* Register any application services.
*
* @return void
*/
public function register()
 {
//
}

/**
* Bootstrap any application services.
*
* @return void
*/
public function boot()
{
Fortify::createUsersUsing(CreateNewUser::class);

Fortify::updateUserProfileInformationUsing(UpdateUserProfileInformation::class);
Fortify::updateUserPasswordsUsing(UpdateUserPassword::class);
Fortify::resetUserPasswordsUsing(ResetUserPassword::class);

//register
Fortify::registerView(function () {
return view('auth.register');
});

//login
Fortify::loginView(function () {
return view('auth.login');
});

//forgot
Fortify::requestPasswordResetLinkView(function () {
return view('auth.forgot-password');
});

//reset
Fortify::resetPasswordView(function ($request) {
return view('auth.reset-password', ['request' => $request]);
});

}
}

Langkah 4 - Register Fortify Service Providers

Setelah kita berhasil mengaktifkan view untuk Authentication di dalam

function boot di FortifyServiceprovider, sekarang kita lanjutkan untuk
melakukan register provider dari Laravel Fortify. Silahkan buka
file config/app.php kemudian tambahkan kode berikut ini di dalam array
providers :
'providers' => [
...
App\Providers\FortifyServiceProvider::class,
];

Sekarang kita sudah bisa menggunakan Laravel Fortify di dalam Project

Laravel kita untuk melakukan proses Autentication. Jika ingin menggunakan
fitur Two-factor Authentication, silahkan teman-teman bisa membuat
tampilannya sendiri, karena Laravel Fortify tidak menyediakan templaate
tersebut. Akan tetapi jika menggunakan Laravel Jetstream, maka tampilan
tersebut sudah otomatis dibuatkan.

Langkah 5 - Menjalankan Migration

Setelah semua proses installasi dan konfigurasi Laravel Fortify selesai,

sekarang kita lanjutkan untuk melakukan migrasi database. Silahkan jalankan
perintah di bawah ini :
php artisan migrate

Jika Berhasil maka teman-teman bisa cek database dengan

nama db_laravel_fortify, maka kita sudah berhasil dibuatkan beberapa
table secara otomatis.

Di artikel selanjutnya kita semua akan belajar bagaimana cara membuat

proses Register menggunakan Laravel Fortify. Dan kita akan menggunakan
Bootstrap untuk membuat tampilannya. Terima Kasih
Tutorial Laravel Fortify #4 : Membuat Fitur Register

Halo teman-teman semuanya, di artikel sebelumnya kita semua telah belajar

bagaimana cara installasi dan konfigurasi Laravel Fortify di dalam project
Laravel baru. Pada tutorial kali ini kita semua akan belajar bagaimana cara
membuat proses Register menggunakan Laravel Fortify. Jadi harus teman-
teman tahu, bahwasanya kita nanti hanya akan membuat sebuah view saja,
karena untuk controller atau actions sudah otomatis dibuatkan oleh Laravel
Fortify. Kita hanya perlu fokus di dalam template view saja.

Langkah 1 - Membuat Layout App

Pertama, hal yang harus kita lakukan adalah membuat layouts, dimana layout
ini akan digunakan extend dari semua template Auth kita. Silahkan buat folder
baru dengan nama layouts di dalam folder resources/views kemudian di dalam
folder layouts dilahkan buat file baru dengan nama app.blade.php dan silahkan
masukkan kode berikut ini :
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-
fit=no">

<!-- Bootstrap CSS -->

<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link href="https://fonts.googleapis.com/css2?
family=Quicksand:wght@300;400;500;600&display=swap" rel="stylesheet">
<title>{{ $title ?? config('app.name') }}</title>
<style>
body {
background: lightgray;
font-family: 'Quicksand', sans-serif
}
</style>
</head>
<body>

<div class="container mt-5">

<div class="row justify-content-center">
@yield('content')
</div>
</div>

<!-- Optional JavaScript -->

<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script
src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
<script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script
>
</body>
</html>

Di atas kita menggunakan CSS Bootstrap secara CDN atau online, jadi
pastikan teman-teman semuanya harus terhubung menggunakan internet
saat menjalankan project ini, akan tetapi jika ingin bisa dijalankan secara
offline, silahkan bisa mengunduh file-file CSS dari Bootstrap.

Di atas kita menggunakan sintaks blade untuk menampilkan content

dengan @yield('content') dimana sintaks tersebut akan otomatis mencari
sebuah blade section dengan nama content.
Langkah 2 - Membuat View Register

Setelah kita berhasil membuat template untuk layouts, sekarang kita lanjutkan
untuk membuat view untuk halaman register. Silahkan buat sebuah folder
baru dengan nama auth di dalam folder resources/views kemudian di dalam
folder auth silahkan buat file baru dengan nama register.blade.php dan silahkan
masukkan kode berikut ini :
@extends('layouts.app', ['title' => 'Register - SantriKoding.com'])

@section('content')

<div class="col-md-8">
<div class="card border-0 shadow rounded">
<div class="card-body">
<h4 class="font-weight-bold">REGISTER</h4>
<hr>
<form action="{{ route('register') }}" method="POST">
@csrf

<div class="row">

<div class="col-md-6">
<div class="form-group">
<label class="font-weight-bold text-uppercase">Full
Name</label>
<input type="text" name="name" value="{{ old('name') }}"
class="form-control @error('name') is-invalid @enderror" placeholder="Masukkan Nama
Lengkap">
@error('name')
<div class="alert alert-danger mt-2">
{{ $message }}
</div>
@enderror
</div>
</div>

<div class="col-md-6">
<div class="form-group">
<label class="font-weight-bold text-uppercase">Email
address</label>
<input type="email" name="email"
value="{{ old('email') }}" class="form-control @error('email') is-invalid @enderror"
placeholder="Masukkan Alamat Email">
@error('email')
<div class="alert alert-danger mt-2">
{{ $message }}
</div>
@enderror
</div>
 </div>

<div class="col-md-6">
<div class="form-group">
<label class="font-weight-bold text-
uppercase">Password</label>
<input type="password" name="password" class="form-
control @error('password') is-invalid @enderror" placeholder="Masukkan Password">
@error('password')
<div class="alert alert-danger mt-2">
{{ $message }}
</div>
@enderror
</div>
</div>

<div class="col-md-6">
<div class="form-group">
<label class="font-weight-bold text-uppercase">Konfirmasi
Password</label>
<input type="password" name="password_confirmation"
class="form-control" placeholder="Masukkan Konfirmasi Password">
</div>
</div>

</div>

<button type="submit" class="btn btn-primary">REGISTER</button>

</form>
</div>
</div>
<div class="login mt-3 text-center">
<p>Sudah punya akun ? Login <a href="/login">Disini</a></p>
</div>
</div>

@endsection

Di atas kita buat view ini menggunakan extends dari layouts app yang sudah
kita buat sebelumnya, dan kita juga definisikan untuk titlenya, kurang lebih
seperti ini :
@extends('layouts.app', ['title' => 'Register - SantriKoding.com'])

Dan untuk semua view register yang kita buat akan kita letakkan di dalam
blade section, dimana ini akan otomatis di render oleh @yield di dalam file
layouts app.
@section('content')
 //kode view register ditulis disini

@endsection

Dan untuk action dari form register yang kita buat, akan kita arahkan ke
sebuah route yang bernama register :
<form action="{{ route('register') }}" method="POST">

Jika teman-teman cek di dalam file routes/web.php maka teman-teman tidak

akan menemukan route tersebut, lantas kenapa bisa seperti itu ? Ya, route
tersebut sebenarnya ada, akan tetapi di letakkan di dalam
folder vendor/laravel/fortify/routes/routes.php. Dan kita tidak disarankan untuk
mengubah apapun yang ada di dalam folder tersebut, karena jika kita
melakukan update composer, maka semua kode yang dirubah akan hilang
kembali.

langkah 3 - Uji Coba Fitur Register

Sekarang kita bisa mencoba menjalankan di

dalam http://localhost:8000/register jika berhasil maka kurang lebih
tampilannya seperti berikut ini :
Kemudian silahkan klik REGISTER tanpa mengisi apapun di dalam form, maka
akan menampilkan sebuah validaasi, kurang lebih seperti berikut ini :

Dan sekarang jika kita mengisi semua form dan klik REGISTER, maka akan
menampilkan error, sebenarnya kita sudah berhasil melakukan proses
registrasi, error tersebut muncul, karena kita beelum membuat sebuah view
dengan nama home.

Langkah 4 - Membuat View Home

Sekarang kita lanjutkan untuk membuat view home, di dalam home kita akan
menampilkan nama user yang berhasil register dan membuat tombol untuk
proses logout. Silahkan buat file baru dengan nama home.blade.php di dalam
folder resources/views dan masukkan kode berikut ini :
@extends('layouts.app')

@section('content')

<div class="col-md-8">
<div class="card border-0 shadow rounded">
<div class="card-body">
Selamat Datang <strong>{{ auth()->user()->name }}</strong>
<hr>
<a href="{{ route('logout') }}" style="cursor: pointer"
onclick="event.preventDefault();
document.getElementById('logout-form').submit();" class="btn btn-md
btn-primary">LOGOUT</a>
 <form id="logout-form" action="{{ route('logout') }}" method="POST"
style="display: none;">
@csrf
</form>
</div>
</div>
</div>

@endsection

Di atas kita buat view home ini extends dari file layouts app.
@extends('layouts.app')

Kemudian untuk tampilan home sendiri kita letakkan di dalam blade section.
@section('content')

//kode menampilkan home disini

@endsection

Dan untuk menampilkan data user yang berhasil melakukan register, kita
menggunakan sintaks blade seperti berikut ini :
Selamat Datang <strong>{{ auth()->user()->name }}</strong>

Dan untuk membuat proses logout kita membuat sebuah button yang

mengarah kesebuah form dengan action logout. Kurang lebih seperti berikut
ini :
<a href="{{ route('logout') }}" style="cursor: pointer"
onclick="event.preventDefault(); document.getElementById('logout-form').submit();"
class="btn btn-md btn-primary">LOGOUT</a>

<form id="logout-form" action="{{ route('logout') }}" method="POST" style="display:

none;">
@csrf
</form>

Sekarang jika kira refresh halaman home, maka kurang lebih hasilnya seperti
berikut ini :
Gimana mudah bukan ? membuat proses register di Laravel menggunakan
Laravel Fortify. Di artikel selanjutnya kita semua akan belajar bagaimana cara
membuat fitur login. Terima Kasih
Tutorial Laravel Fortify #5 : Membuat Fitur Login

Halo teman-teman semuanya, di artikel sebelumnya kita semua sudah belajar

bagaimana cara membuat fitur register menggunakan Laravel Fortify. Pada
artikel kali ini kita semua akan coba belajar mengimplementasikan fitur login
menggunakan Laravel Fortify.

Seperti langkah-langkah sebelumnya, disini kita hanya akan fokus untuk

membuat tampilan untuk form login, karena untuk controller atau actions
sudah otomatis dibaut oleh Laravel Fortify.

Langkah 1 - Membuat View Login

Sekarang, silahkan buat file baru dengan nama login.blade.php di dalam

folder resources/views/auth kemudian silahkan masukkan kode berikut ini di
dalam file tersebut :
@extends('layouts.app', ['title' => 'Login - SantriKoding.com'])

@section('content')
<div class="col-md-4">
<div class="card border-0 shadow rounded">
<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
@endif
<h4 class="font-weight-bold">LOGIN</h4>
<hr>
<form action="{{ route('login') }}" method="POST">
@csrf
<div class="form-group">
<label class="font-weight-bold text-uppercase">Email
address</label>
<input type="email" name="email" value="{{ old('email') }}"
class="form-control @error('email') is-invalid @enderror" placeholder="Masukkan
Alamat Email">
@error('email')
<div class="alert alert-danger mt-2">
{{ $message }}
</div>
@enderror
</div>
<div class="form-group">
<label class="font-weight-bold text-uppercase">Password</label>
<input type="password" name="password" class="form-control
@error('password') is-invalid @enderror" placeholder="Masukkan Password">
@error('password')
<div class="alert alert-danger mt-2">
{{ $message }}
</div>
@enderror
</div>
<button type="submit" class="btn btn-primary">LOGIN</button>
<hr>

<a href="/forgot-password">Lupa Password ?</a>

</form>
</div>
</div>
<div class="register mt-3 text-center">
<p>Belum punya akun ? Daftar <a href="/register">Disini</a></p>
</div>
</div>

@endsection

Di atas, kita buat agar view login ini menggunakan extends dari layouts app.
Kurang lebih seperti ini :
@extends('layouts.app', ['title' => 'Login - SantriKoding.com'])
Dan untuk view login kita letakkan di dalam blade section, dimana ini akan
dirender oleh file layouts app, menggunakan @yeild :
@section('content')

//kode view login disini

@endsection

Kemudian untuk form action dari login, kita arahkan ke sebuah route yang
bernama login menggunakan method POST
<form action="{{ route('login') }}" method="POST">

Untuk melihat route tersebut di definisikan, maka teman-teman bisa cek di

dalam folder vendor/laravel/fortify/routes/routes.php. Dan kita tidak
diperbolehkan meng-edit file tersebut.

Langkah 2 - Uji Coba Fitur Login

Sekarang kita bisa mencoba menjalankan proses login

di http://localhost:8000/login jika berhasil, maka kurang lebih tampilannya
seperti berikut ini :
Sekarang kita bisa mencoba klik LOGIN tanpa memasukkan data apapun di
dalam form, maka akan menampilkan sebuah error validasi, kurang lebih
seperti berikut ini :

Kemudian, jika kita mencoba memasukkan data user yang belum ada di
dalam database, maka akan menampilkan sebuah error, bawah data belum di
temukan di dalam database, kurang lebih seperti berikut ini :
Sekarang silahkan lakukan uji coba dengan data user yang sudah ada di
dalam database, jika berhasil maka akan menampilkan halaman home,
kurang lebih seperti berikut ini :
Di artikel selanjutnya, kita semua akan belajar bagaimana cara membuat fitur
forgot password dengan cara mengirimkan link reset password via email.
Terima Kasih

Tutorial Laravel Fortify #6 : Membuat Fitur Forgot dan

Reset Password
 

Halo teman-teman semuanya, di artikel sebelumnya kita sudah berhasil

membuat fitur login menggunakan Laravel Fortify. Pada artikel kali ini kita
semua akan belajar bagaimana cara membuat fitur forgot password via email
dan melakukan update password dari link yang dikirim melalui email.

Dan pada praktek kali ini, kita akan menggunakan Mailtrap untuk mengirim
email-nya. Mailtrap adalah layanan fake email yang digunakan untuk
pengujian tanpa harus mengirimkan ke pengguna email aslinya. Ini akan kita
manfaatkan untuk proses kirim reset password via email.

Langkah 1 - Daftar Akun Mailtrap

Sekarang kita akan daftar akun di Mailtrap terlebih dahulu untuk mendapatkan
username dan password untuk SMTP kirim email. Teman-teman bisa klik link
berikut ini : https://mailtrap.io/register/signup?ref=header dan disini kita bisa
daftar menggunakan Google, GitHub dan Microsoft atau kita bisa daftar
secara manual.

Setelah berhasil mendaftar, silahkan masuk ke Demo Inbox dan disini teman-

teman sudah mendapatkan credential untuk SMTP. Kurang lebih seperti ini :

Langkah 2 - Konfigurasi SMTP di Laravel

Setelah kita berhasil mendaftar dan mendapatkan credential untuk username

dan password, sekarang kita lanjutkan untuk meng-konfigurasi di dalam
project Laravel. Silahkan buka file .env kemudian cari kode berikut ini :
MAIL_MAILER=smtp
MAIL_HOST=smtp.mailtrap.io
MAIL_PORT=465
MAIL_USERNAME=
MAIL_PASSWORD=
MAIL_ENCRYPTION=null
MAIL_FROM_ADDRESS="no-reply@santrikoding.com"
MAIL_FROM_NAME="${APP_NAME}"

Silahkan isi bagian MAIL_USERNAME dengan username yang di dapatkan dari

Mailtrap dan MAIL_PASSWORD ini juga di isi password yang di dapatkan dari
Mailtrap.

Langkah 3 - Membuat View Forgot Password

Sekarang kita lanjutkan untuk membuat halaman view untuk proses forgot
password, silahkan buat file baru dengan nama forgot-password.blade.php di
dalam folder resources/views/auth kemudian masukkan kode berikut ini :
@extends('layouts.app', ['title' => 'Forgot Password - SantriKoding.com'])

@section('content')
<div class="col-md-5">
<div class="card">

<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
@endif

<form method="POST" action="{{ route('password.email') }}">

@csrf

<div class="form-group">
<label class="font-weight-bold text-uppercase">Email
Address</label>
<input id="email" type="email" class="form-control
@error('email') is-invalid @enderror"
name="email" value="{{ old('email') }}" required
autocomplete="email" autofocus
placeholder="Masukkan Alamat Email">

@error('email')
<div class="alert alert-danger mt-2">
<strong>{{ $message }}</strong>
</div>
@enderror
</div>

<button type="submit" class="btn btn-primary btn-block">SEND PASSWORD

RESET LINK</button>
 </form>
</div>
</div>
</div>
@endsection

Di atas untuk form action kita arahkan ke sebuah route dengan

nama password.email. Kurang lebih seperti berikut ini :
<form method="POST" action="{{ route('password.email') }}">

Sekarang kita bisa coba jalankan di http://localhost:8000/forgot-password jika

berhasil maka kurang lebih tampilannya seperti berikut ini :

Silahkan masukkan email yang sudah digunakan daftar dan jika berhasil
maka kurang lebih tampilannya seperti berikut ini :
Kemudian, silahkan cek Demo Inbox di Mailtrap, maka kita akan mendapatkan
email yang isinya adalah link untuk reset password. Kurang lebih seperti
berikut ini :
Kemudian silahkan klik Reset Password maka kita akan mendapatkan sebuah
error, kurang lebih seperti berikut ini :

Error tersebut muncul karena kita belum membuat view untuk melakukan
reset password.

Langkah 4 - Membuat View Reset Password

Sekarang kita lanjutkan untuk membuat view untuk proses reset atau update
password di Laravel Fortify. Silahkan buat file baru dengan nama reset-
password.blade.php di dalam folder resources/views/auth kemudian
masukkan kode berikut ini :
@extends('layouts.app', ['title' => 'Reset Password - SantriKoding.com'])

@section('content')
<div class="col-md-5">
<div class="card">

<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
 </div>
@endif

<form method="POST" action="{{ route('password.update') }}">

@csrf

<input type="hidden" name="token" value="{{ $request-

>route('token') }}">

<div class="form-group">
<label class="font-weight-bold text-uppercase">Email
Address</label>
<input id="email" type="email" class="form-control
@error('email') is-invalid @enderror"
name="email" value="{{ $request->email ?? old('email') }}"
required autocomplete="email" autofocus placeholder="Masukkan Alamat Elamil">
@error('email')
<div class="alert alert-danger mt-2">
<strong>{{ $message }}</strong>
</div>
@enderror
</div>

<div class="form-group">
<label class="font-weight-bold text-uppercase">Password</label>
<input id="password" type="password" class="form-control
@error('password') is-invalid @enderror"
name="password" required autocomplete="new-password"
placeholder="Masukkan Password Baru">
@error('password')
<div class="alert alert-danger mt-2">
<strong>{{ $message }}</strong>
</div>
@enderror
</div>

<div class="form-group">
<label class="font-weight-bold text-uppercase">Konfirmasi
Password</label>
<input id="password-confirm" type="password" class="form-control"
name="password_confirmation"
required autocomplete="new-password" placeholder="Masukkan
Konfirmasi Password Baru">
</div>

<button type="submit" class="btn btn-primary btn-block">RESET

PASSWORD</button>
</form>

</div>
</div>
</div>
@endsection
Di atas untuk form action, kita arahkan ke sebuah route yang
bernama password.update.
<form method="POST" action="{{ route('password.update') }}">

Dimana di dalam form ini juga kita menambahkan sebuah input type hidden
untuk menyimpan informasi data Token yang digunakan untuk melakukan
reset password.
<input type="hidden" name="token" value="{{ $request->route('token') }}">

Sekarang kita bisa coba klik Reset Password yaang ada di dalam email, atau
bisa refresh halaman error sebelumnya, jika berhasil, kurang lebih kita akan
mendapatkan sebuah form untuk proses reset atau update password.

Silahkan update password teman-teman dan klik RESET PASSWORD jika berhasil,

maka akan di arahkan ke halaman login dengan pesan sukses. Kurang lebih
seperti berikut ini :
Sampai disini pembahasan tentang cara membuat Authentication
menggunakan Laravel Fortify. Jika teman-teman ada pertanyaan atau
kesulitan, bisa bertanya melalui kolom komentar di bawah. Terima Kasih.