Membuat Form Login Dengan CI - AdiniahGustika/tekweblanjut-prak06 GitHub Wiki
- Download CodeIgniter
- Download template stisla-master
-
Mengekstrak codeIgniter dan juga template stisla
-
CI dipindahkan ke folder htdoc dan ubah nama folder CI tersebut menjadi form-login.
- Membuka code editor, lalu open folder form-login.
- Selanjutnya mencoba run aplikasi. Sebelumnya XAMPP harus dinyalakan terlebih dahulu.
- Selanjutnya membuka projek tersebut. Klik bagian public.
- Selanjutnya adalah membuat database.
- Selanjutnya, kembali ke code editor lalu melakukan konfigurasi. Klik App\Config\App.php, lalu pada public $baseURL isinya diubah menjadi 'http://localhost/form-login/public/', dan pada bagian public $indexPage dibiarkan kosong.
- Kemudian, konfigurasi database. Username diisi dengan ‘root’ dan database diisi dengan ‘sistem_login’.
- Selanjutnya rename file env menjadi .env dan pada bagian CI_ENVIRONMENT diubah menjadi development.
- Selanjutnya adalah mendesign tampilan login. Buka folder stisla-master lalu copy .github, assets, dev, pages, dan source dan paste didalam folder project(form-login\public\template).
- Lalu, coba buka design halaman login pada stisla-master(stisla-master\pager\auth-login.html).
- Kemudian, coba buka halaman register pada stisla-master(stisla-master\pages\auth-register.html).
- Membuat folder baru pada bagian Views yaitu templates. Didalam folder templates tersebut, dibuat file baru yaitu content.php, header.php, footer.php, wrapper.php.. dan kemudian pada folder Views dibuat file baru yaitu login.php dan register.php.
- Kemudian, copy file auth-login.html ke dalam file login.php. Pada bagian login.php dipecah menjadi 3 bagian dan dimasukkan kedalam file header, footer, dan login.
- Code pada bagian login.php yang dipindahkan kedalam file header.php.
- Code pada bagian login.php yang dipindahkan kedalam file footer.php.
- Kemudian masuk ke Controllers dan buat file baru bernama User.php.
- Membuat code pada file content untuk membuat tampilan yang nantinya akan dipanggil pada bagian Contollers\User.php.
- Kemudian pada file wrapper.php ketikkan code seperti pada gambar dibawah ini.
- Kemudian masuk kedalam file User.php dan ketikkan code seperti pada gambar dibawah ini.
- Kemudian melakukan kofigurasi pada bagian Routes.php. Pada bagian $routes->setDefaultController(‘Home’); diubah menjadi $routes->setDefaultController(‘User’);. Dan $routes->get(‘/’, ‘Home::index’); diubah menjadi $routes->get(‘/’, ‘User::index’);
- Selanjutnya klik file header.php. Pada title yang awalnya <title>Login — Stisla</title> diubah menjadi <title>= $title; ?></title>. Dan ubah code pada line 15-16 menjadi seperti pada gambar dibawah ini.
- Kemudian pada footer.php ubahlah code pada line 12-13 menjadi seperti pada gambar dibawah ini.
- Untuk membuat logo pada menu login, tuliskan code seperti pada gambar dibawah ini.
- Selanjutnya untuk design halaman register. Copy file auth-register.html ke dalam file register.php. Pada bagian register.php, hapus code footer dan header karena sudah ada code sebelumnya.
- Membuat method register.
- Untuk membuat logo pada menu register, tuliskan code seperti pada gambar dibawah ini.
- Selanjutnya membuat action pada file register. Pada line 16-17 masukkan code .
- Selanjutnya membuat model. Klik folder Models, buat file baru bernama M_User.php.
- Pada file M_User ketikkan code seperti pada gambar dibawah ini.
- Membuat method regis.
- Selanjutnya, user melakukan registrasi.
- Untuk mengetahui apakah user berhasil melakukan registrasi, maka buka phpMyAdmin.
- Setelah melakukan register dan berhasil, maka otomatis akan masuk ke menu login.
-
User bisa melakukan login dengan email yang sudah terdaftar.
-
Pada tampilan dibawah ini merupakan tampilan jika user memasukkan email atau password yang salah. Jika email atau password yang dimasukkan user adalah salah, maka akan muncul alert yang menyatakan bahwa kata sandi/password atau email tersebut salah.
- Dan jika email dan password yang dimasukkan user benar, maka tampilan nya akan seperti pada gambar dibawah ini.
