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

Posting Komentar

Postingan populer dari blog ini

TUGAS 3 PEMROGRAMAN WEB (D) - Warung Tegal

Tugas kali ini membuat website Warung Makan Tegal. Dalam proses pengerjaannya, menggunakan  HTML ,   CSS ,   dan JavaScript serta  VSCode  sebagai  text editor . Di website ini, saya mengaplikasikan penggunaan embed video dari Youtube dan image carousel atau slideshow . Laman website-nya dapat diakses pada  link berikut . Untuk  hosting  web sendiri memakai  Netlify . Konten dari website: Main page , berisi daftar makanan, masakan populer, kontak dari warung tegal, serta menu apa saja yang tersedia di dalam website. Tampilan Website Main page Source Code index.html style.css
Posting Komentar
Baca selengkapnya

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...
Posting Komentar
Baca selengkapnya

ETS PEMROGRAMAN BERORIENTASI OBJEK (B) - Mesin ATM

1. Tuliskan skenario fungsionalitas aplikasi berdasarkan tayangan tersebut! Pada video yang ada, ditampilkan proses setor tunai pada mesin ATM. Jadi, awalnya nasabah memasukkan kartu ATM ke dalam mesin. Lalu, memasukkan nomor pin sebanyak 6 digit sesuai yang telah didaftarkan. Jika pin salah, maka mesin akan meminta mengulangi agar memasukkan pin yang benar. Nah, di mesin ATM ini sendiri ada beberapa fitur yaitu setor tunai, penarikan tunai, dan transaksi lainnya (seperti transfer, pembayaran listrik, dll.). Dalam video, nasabah ingin melakukan proses setor tunai. Perlu diketahui di beberapa mesin, setor tunai ada yang menerima pecahan uang Rp100.000,00 saja, ada juga yang juga menerima Rp50.000,00, di video sepertinya hanya menerima Rp100.000,00. Lalu, juga ada batas maksimal berapa nominal atau jumlah uang yang dimasukkan, di video batasnya adalah 50 lembar. Jika lebih, maka kelebihannya akan dikembalikan oleh mesin. Setelah memasukkan uang ke dalam mesin, mesin akan memproses dan ke...
Posting Komentar
Baca selengkapnya