This post is also available in:
English
Halo teman teman semuanya, kali ini kita akan membahas cara membuat login dan register menggunakan CI4.
1. Install CodeIgniter 4
Untuk proses install codeigniter 4, teman semua dapat di lakukan dengan dua cara, dengan cara manual dan dengan cara menggunakan composer. saya sarakan menggunkaan cara comooser.
Install Dengan Cara manual
Silahkan download file CodeIgniter 4 pada link berikut:
Kemudian extract pada web server Anda.
Jika Anda menggunakan XAMPP, extract di folder:
C:\xampp\htdocsJika Anda menggunakan WAMPSERVER, extract di folder:
C:/wamp64/wwwRename nama foldernya, sesuaikan dengan nama project teman teman semua.
Install Dengan Composer
Di folder di atas root proyek Anda:
composer create-project codeigniter4/appstarter project-rootPerintah di atas akan membuat folder “project-root”.
Jika Anda menghilangkan argumen “project-root”, perintah akan membuat folder “appstarter”, yang dapat diganti namanya sesuai kebutuhan.
Jika Anda tidak membutuhkan atau ingin menginstal phpunit, dan semua dependensi penyusunnya, tambahkan opsi –no-dev ke akhir baris perintah di atas. Itu hanya akan menghasilkan kerangka kerja, dan tiga dependensi tepercaya yang kami bundel, yang diinstal oleh komposer.
Contoh perintah instalasi seperti itu, menggunakan “appstarter” project-root default:
komposer create-project codeigniter4/appstarter –no-dev
2. Buat Database dan Table
Sebelum membuat tabel teman teman di haruskan setting .env pada codeigniter 4.
Selanjutnya, temukan kode berikut:
| 1 | # CI_ENVIRONMENT = production |
Kemudian ubah menjadi seperti berikut:
| 1 | CI_ENVIRONMENT = development |
Teman semuanya, untuk buat database menggunakan codeigniter 4 dapat di lakukan dengan dua cara kembali. Dapat di lakukan dengan cara manual dengan membuat di phpmyadmin atau teman semua dapat membuat dengan migration. Saya rekomendasikan menggunakan migration.
Silahkan teman semua, buka terminalnya kita akan membuat data migration.
Kemudian ketik perintah berikut untuk membuat file migrasi:
php spark migrate:create usersPerintah tersebut akan membuat file dengan nama 2022-04-25-061811_Users.php, di dalam folder, app/Database/Migration.
Tanggal dan waktu di awal nama file menandakan versi dari migrasi.
Berikut ini adalah isi file 2022-04-25-061811_Users.php.
<?php
namespace App\Database\Migrations;
use CodeIgniter\Database\Migration;
class Users extends Migration
{
public function up()
{
//
}
public function down()
{
//
}
}
Pada class Users terdapat dua method, yakni up() dan down(). Method ini nantinya akan dijalankan saat melakukan migrasi.
Method up() akan dijalankan saat melakukan migrasi, sedangkan down() saat melakukan rollback.
Silahkan ubah kode pada file 2022-04-25-061811_Users.php menjadi seperti ini:
<?php
namespace App\Database\Migrations;
use CodeIgniter\Database\Migration;
class Users extends Migration
{
public function up()
{
$this->forge->addField([
'id' => [
'type' => 'INT',
'constraint' => 5,
'unsigned' => true,
'auto_increment' => true
],
'name' => [
'type' => 'VARCHAR',
'constraint' => '255'
],
'email' => [
'type' => 'VARCHAR',
'constraint' => '255',
],
'password' => [
'type' => 'VARCHAR',
'constraint' => '255',
],
'created_at' => [
'type' => 'TIMESTAMP',
'null' => true,
],
]);
// primary key
$this->forge->addKey('id', TRUE);
// tabel users
$this->forge->createTable('users', TRUE);
}
public function down()
{
$this->forge->dropTable('users');
}
}
Oke, sekarang mari kita coba lakuka migrasi pertama.
Lakukan migrasi dengan perintah:
php spark migrateOutput :
3. Buat file Model
Pada tutorial ini, hanya dibutuhkan satu file model yaitu “UserModel.php”.
Buat sebuah file model bernama “UserModel.php” pada folder “app/Models”, kemudian ketikan kode berikut:
<?php namespace App\Models;
use CodeIgniter\Model;
class UserModel extends Model{
protected $table = 'users';
protected $allowedFields = ['name','email','password','created_at'];
}4. Buat file Controller Register.php
Buat file controller dengan nama “Register.php” pada folder “app/Controllers”, kemudian ketikan kode berikut:
Pada controller “Register.php” diatas, terdapat dua function, yaitu: function index(), dan function save().
Function index(), berfungsi untuk menampilkan sebuah view benama “register”, sedangkan function save() berfungsi untuk menyimpan data ke table “users” yang ada di database sekaligus mengenkripsi password dengan fungsi password_hash().
5. Buat file View register.php
Buat sebuah file view bernama “register.php” pada folder “app/Views”, kemudian ketikan kode berikut:
Pada view “register.php”, kita memanggil Bootstrap 5 CDN, baik CSS dan juga JavaScript-nya.
Kunjungi URL berikut untuk info lebih lanjut tentang Bootstrap 5:
Selain itu, juga terdapat sebuah form untuk register berupa: input name, email, password, dan Confirm password.
6. Buat file Controller Login.php
Buat sebuah file Controller lagi bernama “Login.php” pada folder “app/Controllers”, kemudian ketikan kode berikut:
<?php namespace App\Controllers;
use CodeIgniter\Controller;
use App\Models\UserModel;
class Login extends Controller
{
public function index()
{
helper(['form']);
echo view('login');
}
public function auth()
{
$session = session();
$model = new UserModel();
$email = $this->request->getVar('email');
$password = $this->request->getVar('password');
$data = $model->where('email', $email)->first();
if($data){
$pass = $data['password'];
$verify_pass = password_verify($password, $pass);
if($verify_pass){
$ses_data = [
'id' => $data['id'],
'name' => $data['name'],
'email' => $data['email'],
'logged_in' => TRUE
];
$session->set($ses_data);
return redirect()->to('/dashboard');
}else{
$session->setFlashdata('msg', 'Wrong Password');
return redirect()->to('/login');
}
}else{
$session->setFlashdata('msg', 'Email not Found');
return redirect()->to('/login');
}
}
public function logout()
{
$session = session();
$session->destroy();
return redirect()->to('/login');
}
} Pada controller “Login.php” diatas terdapat tiga function, yaitu: function index(), function auth(), dan function logout().
Function index() berfungsi untuk menampilkan view bernama “login” yang akan menampilkan form login.
Function auth() berfungsi untuk melakukan autentikasi beserta meng-set variable session jika autentikasi valid.
Function logout() berfungsi untuk logout beserta menghancukan variable session.
7. Buat file View login.php
Buat sebuah file view lagi bernama “login.php” pada folder “app/Views”, kemudian ketikan kode berikut:
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-alpha1/css/bootstrap.min.css" integrity="sha384-r4NyP46KrjDleawBgD5tp8Y7UzmLA05oM1iAEQ17CSuDqnUK2+k9luXQOfXJCJ4I" crossorigin="anonymous">
<title>Login</title>
</head>
<body>
<div class="container">
<div class="row justify-content-md-center">
<div class="col-6">
<h1>Sign In</h1>
<?php if(session()->getFlashdata('msg')):?>
<div class="alert alert-danger"><?= session()->getFlashdata('msg') ?></div>
<?php endif;?>
<form action="/login/auth" method="post">
<div class="mb-3">
<label for="InputForEmail" class="form-label">Email address</label>
<input type="email" name="email" class="form-control" id="InputForEmail" value="<?= set_value('email') ?>">
</div>
<div class="mb-3">
<label for="InputForPassword" class="form-label">Password</label>
<input type="password" name="password" class="form-control" id="InputForPassword">
</div>
<button type="submit" class="btn btn-primary">Login</button>
</form>
</div>
</div>
</div>
<!-- Popper.js first, then Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-alpha1/js/bootstrap.min.js" integrity="sha384-oesi62hOLfzrys4LxRF63OJCXdXDipiYWBnvTl9Y9/TRlw5xlKIEHpNyvvDShgf/" crossorigin="anonymous"></script>
</body>
</html>Pada view “login.php”, kita juga memanggil Bootstrap 5 CDN, baik CSS maupun JavaScript-nya.
Selain itu, juga terdapat sebuah form untuk login berupa: input email dan password.
8. Buat file Controller Dashboard.php
Selain Controller Register.php dan Login.php, buat sebuah file Controller lagi bernama “Dashboard.php” pada folder “app/Controllers”.
Kemudian ketikan kode berikut:
<?php namespace App\Controllers;
use CodeIgniter\Controller;
class Dashboard extends Controller
{
public function index()
{
$session = session();
echo "Welcome back, ".$session->get('name');
}
}Pada Controller “Dashboard.php” hanya terdapat satu function, yaitu function index() yang berfungsi untuk menampilkan text “Welcome Back [username yang login]”.
Tujuan dari Controller ini nantinya untuk di proteksi agar user tidak dapat mengakses Dashboard tanpa login.
9. Buat file Filters Auth.php
CodeIgniter 4 menyediakan fitur Filter yang berfungsi untuk menghandle Before Request ataupun After Request.
Fitur ini sangat bermanfaat untuk menangani pengecekan atau memvalidasi setiap request atau beberapa request yang di tulis dengan kode yang sama.
Mungkin terdengar rumit, tapi sebenarnya tidak.
Pada kasus ini, kita akan mem-proteksi function index() pada Controller Dashboard.php dari users yang belum login menggunakan Filter.
Dengan demikian, Anda akan memiliki gambaran secara umum seperti apa cara kerja Filter pada CodeIgniter 4.
Buat sebuah file Filter bernama “Auth.php” pada folder “app/Filters”, kemudian ketikan kode berikut:
Pada Filter “Auth.php” diatas, terdapat 2 function yaitu: function before() dan function after().
Pada kasus ini, kita hanya bermain di function before().
Function before, berfungsi untuk memvalidasi request sebelum request itu sendiri dilakukan.
Pada filter “Auth.php” diatas, kita me-redirect users ke halaman login jika mengakses suatu halaman sebelum login.
Hal ini bisa berlaku secara global, dengan kata lain berlaku untuk setiap request, atau bisa juga untuk beberapa request saja.
Pada kasus ini, kita hanya menggunakannya untuk mem-proteksi Controller “Dashboard.php”.
Jadi, kita tidak memberlakukannya secara global, karena kita ingin Controller Login.php dan Register.php tetap dapat diakses tanpa login.
Selanjutnya buka file “Filters.php” yang terdapat pada Folder “app/Config”, kemudian temukan kode berikut:
$routes->get('/', 'Home::index');$routes->get('/', 'Home::index');
$routes->get('/dashboard', 'Dashboard::index',['filter' => 'auth']);10. Testing
php spark serve
Baca juga tutorial lainnya di sini:
Cara Menghilangkan Index.php di CodeIgniter
Cara Mengirim permintaan AJAX dengan token CSRF di CodeIgniter 3
Demikian tutorial pembahasan Codeigniter kali ini, semoga bermanfaat, jika ada pertanyaan silahkan tinggalkan komentarnya.
Terimakashi……………
It is in point of fact a great and useful piece of information. I’m
glad that you simply shared this helpful info with us. Please keep us up to date like
this. Thanks for sharing.
my page :: Jasa SEO Purwokerto
you’re welcome, thank you for visiting my site
Hi, I do think this is a great site. I stumbledupon it 😉 I will revisit once again since i have
book marked it. Money and freedom is the greatest way to change, may you be rich
and continue to help others.
Here is my web page; Lapak Satria
Amen, thank you friend
Hello mates, its great article about teachingand completely defined, keep it up
all the time.