Skip to main content

Tugas 6: Membuat Website dengan Bootstrap

 Tugas 6: Membuat Website dengan Bootstrap

Nama: Aulia Eka Putri Aryani
NRP: 05111940000044
Kelas: PWEB-B

Pembahasan

Pada pertemuan PWEB minggu lalu, saya diminta untuk membuat website yang berisikan form login, kontak, dan carousel dengan menggunakan bootstrap. Dalam pembuatan website ini, saya mengimplementasikan HTML, CSS, JavaScript, dan Bootstrap yang telah dipelajari sebelumnya, serta memanfaatkan Github Pages untuk meng-host website ini. Adapun konten dari website yang saya buat adalah sebagai berikut.

  1. Home, yang berisikan navigation, carousel, dan footer
  2. Contact, yang berisikan navigation, map, informasi kontak, form kontak, dan footer
  3. Modal Login, yang berisikan form login yang dilengkapi dengan bootstrap alert danger apabila terdapat kolom yang kosong atau alert success apabila login berhasil

Berikut adalah tampilan dari website yang telah saya buat. Untuk lebih Jelasnya dapat diakses pada link berikut.

Halaman Home

Halaman Contact

Modal Login

Modal Login dengan Danger Alert

Modal Login dengan Success Login

Adapun source code dari website ini dapat diakses pada link berikut atau dapat dilihat pada embed di bawah ini.

  • index.html (sebgaai halaman home dan modal login)
  • contact.html (untuk halaman contact dan modal login)
  • style.css (untuk style website)
  • login.js (untuk validation dan alert pada modal login)

Comments

Popular posts from this blog

Tugas 8: Implementasi PHP dan MySQL (CRUD)

 Tugas 8: Implementasi PHP dan MySQL (CRUD) Nama: Aulia Eka Putri Aryani NRP: 05111940000044 KELAS: PWEB-B Pembahasan Pada tugas kali ini, saya diminta untuk membuat website pendaftara n siswa yang mengimplementasikan proses CRUD (Create, Read, Update, dan Delete) dengan memanfaatkan PHP dan MySQL yang telah dipelajari sebelumnya. Dalam pengerjaan website ini, saya menggunakan HTML, CSS dan Bootstrap, serta PHP dan MySQL melalui phpmyadmin. Berbeda dengan pengerjaan-pengerjaan sebelumnya, hosting yang digunakan untuk pembuatan website ini adalah 000webhost. Alasan perpindahan dari Github Pages ke 000webhost ialah karena  Github Pages sudah tidak memadai sebagai tempat hosting dynamic website yang memerlukan post, get, dan database yang dapat terhubung ke website. Adapun tampilan dari website pendaftaran siswa yang saya buat dapat dilihat pada link berikut atau gambar di bawah ini. Tampilan ...

Tugas 5: Membuat Formulir Validasi dengan JavaScript

Tugas 5: Membuat Formulir Validasi dengan JavaScript Nama: Aulia Eka Putri Aryani NRP: 05111940000044 Kelas: PWEB-B Pembahasan Pada pertemuan PWEB minggu lalu, saya diminta untuk membuat website pendaftaran kuliah tatap muka yang merupakan formulir validasi yang tidak dapat di- submit hingga seluruh datanya terisi. Untuk membuat website ini, saya mengimplementasikan HTML, CSS, dan JavaScript yang telah dipelajari sebelumnya serta memanfaatkan Github Pages untuk meng-host halaman website ini. Adapun isi dari formulir yang saya buat adalah sebagai berikut. Fakultas Departemen Nama NRP Email Kota Penyintas Dosis Vaksin Jenis Vaksin Ketersediaan Tatap Muka Seperti yang diminta oleh dosen saya, saya tidak mengizinkan user untuk melakukan submit formulir jika terdapat data yang belum terisi dan mengeluarkan alert apabila terdapat data yang kosong. Selain mengeluarkan alert, saya juga memberikan focus pad...

Evaluasi Akhir Semester

Evaluasi Akhir Semester Nama : Aulia Eka Putri Aryani NRP : 05111940000044 Kelas : PWEB-B Pembahasan Fitur-fitur yang akan saya bangun untuk aplikasi website sekolah saya disesuaikan dengan 4 role yang ada, yakni sebagai berikut. Admin Login Dashboard Menampilkan jumlah siswa aktif Menampilkan jumlah guru aktif Menampilkan jumlah pemasukan (dalam 1 bulan) Menampilkan jumlah pengeluaran (dalam 1 bulan) Manajemen Siswa Menambah data siswa Menampilkan data siswa Mengubah data siswa Menghapus data siswa Mencari data siswa Mengunduh data siswa Manajemen Guru Menambah data guru Menampilkan data guru Mengubah data guru Menghapus data guru Mencari data guru Mengunduh data guru Manajemen Orang Tua Me...