Di postingan ini, saya akan menunjukkan proses pembuatan halaman login dan send message menggunakan Bootstrap. Hal-hal yang saya lakukan adalah:
1. Membuat halaman login
Pertama saya membuat halaman login terlebih dahulu. Saya menggunakan extension vscode yang mempunyai snippet untuk Bootstrap 5. Di snippet itu, style dan snippet Bootstrap 5 digunakan dari CDN yang disediakan oleh Bootstrap sendiri di dokumentasinya. Di login ini, saya membuat form yang mempunyai input username dan email, checkbox untuk remember me, dan tombol submit. Selain itu di halaman ini juga ada link ke halaman register dan contact us
2. Membuat halaman register
Meskipun untuk tugas tidak ada perintah membuat halaman register, saya tetap membuatnya karena tidak jauh berbeda dengan halaman login. Di halaman ini, selain ada form input username dan password, ada juga input email dan retype password. Selain itu, tidak ada checkbox untuk remember me. Mirip seperti halaman login juga, terdapat link ke halaman login dan contact us.
3. Membuat halaman contact us
Yang berikutnya adalah halaman contact us sebagai halaman untuk mengirim pesan. Di halaman ini saya membuat form yang memiliki input text nama, email, dan no telpon, juga input textarea untuk pesannya sendiri. Di halaman ini saya juga menggunakan Font Awesome untuk menambahkan icon sebagai dekorasi.
4. Deploy website
Seperti biasa, yang terakhir saya lakukan adalah men-deploy website. Sama seperti tugas-tugas sebelumnya, saya menggunakan github pages. Saya membuat sebuah repo baru di Github dan meng-push kodenya ke repo tersebut. Kemudian saya mengaktifkan github pages di setting repo tersebut sehingga website tersebut bisa diakses.
Tidak ada komentar:
Posting Komentar