Laravel - Login Register

Halo, pada postingan kali ini, saya akan membagikan bagaimana cara membuat halaman login dan registrasi sederhana menggunakan laravel. Pertama kita perlu buat sebuah project dengan cara sebagai berikut.

create-project laravel/laravel laravel-hallo

Lalu, kita buka file config .env untuk membuat koneksi dengan database yang kita buat. Disini kita membuat database dengan nama hello sehingga pada file confignya sebagai sebagai berikut.

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=hello
DB_USERNAME=root
DB_PASSWORD=

Saat instalasi, Laravel telah menyediakan Schema table users yang bisa dipakai. Jadi kita hanya perlu untuk melakukan migrasi pada database

php artisan migrate

Kemudian kita buat Route Login, Register, dan logoutnya pada routes/web.php sebagai berikut.


Route::get('/', [App\Http\Controllers\AuthController::class, 'showFormLogin'])->name('login');
Route::get('login', [App\Http\Controllers\AuthController::class, 'showFormLogin'])->name('login');
Route::post('login', [App\Http\Controllers\AuthController::class, 'login']);
Route::get('register', [App\Http\Controllers\AuthController::class, 'showFormRegister'])->name('register');
Route::post('register', [App\Http\Controllers\AuthController::class, 'register']);

Route::group(['middleware' => 'auth'], function () {

    Route::get('home', [App\Http\Controllers\HomeController::class, 'index'])->name('home');
    Route::get('logout', [App\Http\Controllers\AuthController::class, 'logout'])->name('logout');
});

Lalu kita bisa buat controller untuk Auth nya dengan menggunakan command berikut

php artisan make:controller AuthController

Setelah itu akan terbentuk file AuthController.php disini kita buat Authnya menjadi sebagai berikut.

<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use Validator;
use Hash;
use Session;
use App\Models\User;
class AuthController extends Controller
{
public function showFormLogin()
{
if (Auth::check()) { // true sekalian session field di users nanti bisa dipanggil via Auth
//Login Success
return redirect()->route('home');
}
return view('login');
}
public function login(Request $request)
{
$rules = [
'email' => 'required|email',
'password' => 'required|string'
];
$messages = [
'email.required' => 'Email wajib diisi',
'email.email' => 'Email tidak valid',
'password.required' => 'Password wajib diisi',
'password.string' => 'Password harus berupa string'
];
$validator = Validator::make($request->all(), $rules, $messages);
if ($validator->fails()) {
return redirect()->back()->withErrors($validator)->withInput($request->all);
}
$data = [
'email' => $request->input('email'),
'password' => $request->input('password'),
];
Auth::attempt($data);
if (Auth::check()) { // true sekalian session field di users nanti bisa dipanggil via Auth
//Login Success
return redirect()->route('home');
} else { // false
//Login Fail
Session::flash('error', 'Email atau password salah');
return redirect()->route('login');
}
}
public function showFormRegister()
{
return view('register');
}
public function register(Request $request)
{
$rules = [
'name' => 'required|min:3|max:35',
'email' => 'required|email|unique:users,email',
'password' => 'required|confirmed'
];
$messages = [
'name.required' => 'Nama Lengkap wajib diisi',
'name.min' => 'Nama lengkap minimal 3 karakter',
'name.max' => 'Nama lengkap maksimal 35 karakter',
'email.required' => 'Email wajib diisi',
'email.email' => 'Email tidak valid',
'email.unique' => 'Email sudah terdaftar',
'password.required' => 'Password wajib diisi',
'password.confirmed' => 'Password tidak sama dengan konfirmasi password'
];
$validator = Validator::make($request->all(), $rules, $messages);
if ($validator->fails()) {
return redirect()->back()->withErrors($validator)->withInput($request->all);
}
$user = new User;
$user->name = ucwords(strtolower($request->name));
$user->email = strtolower($request->email);
$user->password = Hash::make($request->password);
$user->email_verified_at = \Carbon\Carbon::now();
$simpan = $user->save();
if ($simpan) {
Session::flash('success', 'Register berhasil! Silahkan login untuk mengakses data');
return redirect()->route('login');
} else {
Session::flash('errors', ['' => 'Register gagal! Silahkan ulangi beberapa saat lagi']);
return redirect()->route('register');
}
}
public function logout()
{
Auth::logout(); // menghapus session yang aktif
return redirect()->route('login');
}
}
view raw AuthControllert.php hosted with ❤ by GitHub

Kemudian kita buat controller untuk Home dengan menggunakan Command berikut.

php artisan make:controller HomeController

Langkah terakhir kita buat halaman viewnya yaitu login.blade,php, register.blade.php dan home.blade.php sebagai berikut.


Hasil akhirnya kurang lebih seperti ini


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Login</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="col-md-4 offset-md-4 mt-5">
<div class="card">
<div class="card-header">
<h3 class="text-center">Form Login</h3>
</div>
<form action="{{ route('login') }}" method="post">
@csrf
<div class="card-body">
@if(session('errors'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
Something it's wrong:
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
@if (Session::has('success'))
<div class="alert alert-success">
{{ Session::get('success') }}
</div>
@endif
@if (Session::has('error'))
<div class="alert alert-danger">
{{ Session::get('error') }}
</div>
@endif
<div class="form-group">
<label for=""><strong>Email</strong></label>
<input type="text" name="email" class="form-control" placeholder="Email">
</div>
<div class="form-group">
<label for=""><strong>Password</strong></label>
<input type="password" name="password" class="form-control" placeholder="Password">
</div>
</div>
<div class="card-footer">
<button type="submit" class="btn btn-primary btn-block">Log In</button>
<p class="text-center">Belum punya akun? <a href="{{ route('register') }}">Register</a> sekarang!</p>
view raw login.blade.php hosted with ❤ by GitHub
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Register</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="col-md-4 offset-md-4 mt-5">
<div class="card">
<div class="card-header">
<h3 class="text-center">Form Register</h3>
</div>
<form action="{{ route('register') }}" method="post">
@csrf
<div class="card-body">
@if(session('errors'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
Something it's wrong:
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<div class="form-group">
<label for=""><strong>Nama Lengkap</strong></label>
<input type="text" name="name" class="form-control" placeholder="Nama Lengkap">
</div>
<div class="form-group">
<label for=""><strong>Email</strong></label>
<input type="text" name="email" class="form-control" placeholder="Email">
</div>
<div class="form-group">
<label for=""><strong>Password</strong></label>
<input type="password" name="password" class="form-control" placeholder="Password">
</div>
<div class="form-group">
<label for=""><strong>Konfirmasi Password</strong></label>
<input type="password" name="password_confirmation" class="form-control" placeholder="Password">
</div>
</div>
<div class="card-footer">
<button type="submit" class="btn btn-primary btn-block">Register</button>
<p class="text-center">Sudah punya akun? <a href="{{ route('login') }}">Login</a> sekarang!</p>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
view raw register.blade.php hosted with ❤ by GitHub
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Dashboard</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="col-md-12 mt-5">
<div class="card">
<div class="card-header">
<h3>Dashboard</h3>
</div>
<div class="card-body">
<h5>Selamat datang di halaman dashboard, <strong>{{ Auth::user()->name }}</strong></h5>
<a href="{{ route('logout') }}" class="btn btn-danger">Logout</a>
</div>
</div>
</div>
</div>
</body>
</html>
view raw home.blade.php hosted with ❤ by GitHub

Tampilam halaman Home

Tampilan Halaman Login


Tampilan Halaman Register





Komentar

Posting Komentar

Postingan Populer