Langsung ke konten utama

TUGAS 6 PEMROGRAMAN WEB (D) - Form Login & Contact Us dengan Bootstrap

 


Tugas kali ini membuat website form login dan contact us menggunakan salah satu framework CSS paling populer, yaitu Bootstrap. Dalam proses pengerjaannya, menggunakan HTML, CSS (Bootstrap), dan JavaScript (internal). JavaScript di sini dipakai untuk menampilkan alert bahwa data telah di-submit atau dikirim. Laman website-nya dapat diakses pada link berikut. Untuk hosting web sendiri memakai Netlify.

Konten dari website:

  1. Login page, berisi halaman login sebagai tampilan awal ketika website pertama kali dijalankan.  Ada beberapa kolom yang semuanya wajib diisi dan tidak boleh kosong, yaitu:
    • Email, harus berformat seperti email pada umumnya.
    • Password
  2. Contact us page, berisi halaman contact us guna mengirim pesan ke pemilik web. Ada beberapa kolom yang semuanya wajib diisi dan tidak boleh kosong, yaitu:
    • Name
    • Email, harus berformat seperti email pada umumnya.
    • Phone
    • Message
Di tiap page, bagian bawah form, terdapat tautan (hyperlink) yang mengarahkan page satu sama lain.

Tampilan Website

  1. Login page

  2. Contact us page

Source Code

  • index.html
  • contact.html
  • style.css

Komentar

Postingan populer dari blog ini

ETS REKAYASA KEBUTUHAN (A) - GoToko

Pada Evaluasi Tengah Semester (ETS) kali ini melakukan analisis kebutuhan aplikasi GoToko . Sebelum kita menganalisis lebih jauh tentang GoToko, kita perlu mengetahui terlebih dahulu apa saja kebutuhan yang harus digali untuk sebuah aplikasi perangkat lunak. Kebutuhan Fungsional Kebutuhan fungsional adalah kebutuhan dari penggunaan software yang harus dibangun oleh developer ke dalam produk agar pengguna dapat menyelesaikan tugas mereka, sehingga memenuhi persyaratan bisnis. Kebutuhan fungsional menyatakan apa yang harus dilakukan oleh sistem. Kebutuhan fungsional juga sangat bergantung dari jenis perangkat lunak, pengguna sistem, dan jenis sistem yang perangkat lunak tersebut gunakan. Kebutuhan Non-Fungsional Kebutuhan non fungsional merupakan kebutuhan yang menggambarkan bagaimana sistem berkerja ke depannya.  Kebutuhan non-fungsional menjelaskan tentang constraint atau standar yang harus dipatuhi oleh sistem. Kebutuhan non-fungsional juga mendefinisikan karakteristik dari kuali...

TUGAS 7 PEMROGRAMAN BERORIENTASI OBJEK (B) BAGIAN I - Login Panel

  Tugas kali ini sedikit memodifikasi aplikasi LoginPanel dengan implementasi GUI dengan komponen AWT dan Swing milik Bapak Fajar Baskoro dan disadur dari link berikut . Aplikasi ini merupakan aplikasi sederhana untuk melakukan proses login. Username dan password telah di-set sebelumnya pada aplikasi, sehingga jika salah satu inputan entah username atau password salah, maka akan muncul "Login Denied!". Jika benar, akan memunculkan "Login Granted!". Ada 1 class yang dipakai dalam aplikasi ini: Login , sebagai class untuk melakukan proses login serta pengecekan username dan password. Lalu, aplikasi ini juga menggunakan beberapa library/package: Java.awt.* , untuk proses inputan dalam sebuah program yang telah dijalankan. Java.awt.event.* , untuk proses deklarasi dari class event yang berisi komponen program yang digunakan untuk mengambil semua file dari package event pada java.awt. Java.awt.swing.* , untuk mendeklarasikan sebuah komponen grafis dengan perintah yang di...

EAS REKAYASA KEBUTUHAN (A) - Aplikasi Pemesanan Gedung Acara

Pada Evaluasi Akhir Semester (EAS) kali ini melakukan analisis kebutuhan aplikasi  Pemesanan Gedung Acara . Sebelum kita menganalisis lebih jauh tentang aplikasi ini, kita perlu mengetahui terlebih dahulu apa saja kebutuhan yang harus digali untuk sebuah aplikasi perangkat lunak. Kebutuhan Fungsional Pengguna dapat melakukan registrasi akun. Pengguna dapat melakukan perubahan detail akun. Pengguna dapat melakukan pencarian gedung acara berdasarkan kata kunci tertentu. Pengguna dapat melihat detail gedung acara. Pengguna dapat memberikan review kepada gedung acara yang pernah dipesan. Pengguna dapat melakukan transaksi pemesanan gedung acara via e - wallet ataupun e - banking . Pengguna dapat melihat daftar riwayat transaksi pemesanan gedung. Pengguna dapat membatalkan transaksi pemesanan gedung. Pengguna dapat melihat status transaksi pemesanan gedung. Pengguna dapat melihat promo penyewaan gedung. Pengguna dapat menghubungi customer service yang menjadi penanggungjawab tiap venue...