PWEB (A) - ETS

Nama        : Ryan Abinugraha

NRP          : 5025211178

Soal dan Jawaban

1. Jelaskan fungsi html, css, javascript, bootstrap, dalam pembangunan aplikasi web.

HTML (HyperText Markup Language):

HTML adalah bahasa markah yang digunakan untuk membuat struktur dasar dari sebuah halaman web. Jadi, bisa diibaratkan sebagai kerangka atau tulang dari sebuah situs web. HTML menentukan elemen-elemen dasar seperti judul, paragraf, gambar, dan tautan. Ini adalah fondasi dari setiap situs web, seperti tulang dan daging yang memberi bentuk dan struktur pada konten. Jika web adalah tubuh, maka HTML adalah kerangkanya.

CSS (Cascading Style Sheets):

CSS adalah apa yang memberikan gaya dan estetika pada situs web. Ini seperti pakaian yang Anda kenakan - membuat tampilan web menjadi menarik dan berbeda. Dengan CSS, Anda bisa mengubah warna, font, tata letak, dan desain keseluruhan situs. Ini memungkinkan Anda untuk membuat situs Anda tampak unik dan menarik bagi pengunjung. Dalam analogi "fashion", jika HTML adalah tubuh, maka CSS adalah pakaian yang membuat Anda terlihat keren.

JavaScript:

JavaScript adalah bahasa pemrograman yang memberikan interaktivitas pada situs web. Ini seperti otak di balik situs web yang memungkinkan Anda untuk berinteraksi dengan elemen, membuat animasi, validasi formulir, dan banyak lagi. Jika web adalah tubuh dan CSS adalah pakaian, maka JavaScript adalah pergerakan dan perilaku Anda - memberikan situs web kemampuan untuk berinteraksi dengan pengguna.

Bootstrap:

Bootstrap adalah kerangka kerja (framework) front-end yang memudahkan pembangunan situs web yang responsif dan menarik. Ini menyediakan beragam komponen dan gaya bawaan yang dapat digunakan untuk merancang situs web dengan cepat. Dalam analogi rumah, jika HTML adalah fondasi, CSS adalah gaya, dan JavaScript adalah perilaku, maka Bootstrap adalah seperti set bermain yang sudah jadi yang membantu Anda membangun rumah (situs web) Anda dengan cepat dan mudah.

Jadi, dalam pengembangan aplikasi web, HTML adalah dasar struktural, CSS adalah penampilan visual, JavaScript adalah interaktivitas, dan Bootstrap adalah alat bantu yang mempermudah proses pembangunan situs web. Semua elemen ini bekerja bersama untuk menciptakan pengalaman web yang kohesif dan menarik bagi pengguna.

2. Buatlah screenshot dari aplikasi yang telah dikerjakan, kemudian buat link ke tugas source codenya.

link :

https://github.com/RyanAbinugraha/sc_pweb_ETS

3. Tentu, berikut adalah desain front-end website perpustakaan yang mencakup fungsi display koleksi buku, peta lokasi, informasi berita/kegiatan, dan pendaftaran online. Desain ini hanya sebagai contoh dan Anda dapat mengembangkannya lebih lanjut sesuai dengan kebutuhan perpustakaan Anda.

**Header:**

1. Logo perpustakaan.

2. Menu navigasi:

   - Beranda

   - Koleksi Buku

   - Peta Lokasi

   - Berita/Kegiatan

   - Pendaftaran Online

**Beranda:**

- Slider gambar dengan gambar-gambar perpustakaan yang menarik.

- Ringkasan tentang perpustakaan, visi, misi, dan sejarahnya.

- Tombol "Telusuri Koleksi Buku" untuk mengarahkan pengguna ke halaman koleksi buku.

**Koleksi Buku:**

- Filter berdasarkan genre, penulis, tahun terbit, dsb.

- Daftar buku-buku dengan gambar sampul, judul, penulis, dan sinopsis singkat.

- Tombol "Lihat Detail" untuk informasi lebih lanjut tentang setiap buku.

- Pencarian buku dengan kotak pencarian.

**Halaman Detail Buku:**

- Gambar sampul buku.

- Informasi lengkap tentang buku, termasuk penulis, tahun terbit, sinopsis, dsb.

- Tombol "Pinjam Buku" untuk peminjaman buku (jika mendukung layanan ini).

- Tombol "Kembali ke Koleksi" untuk kembali ke halaman koleksi buku.

**Peta Lokasi:**

- Peta dengan penandaan lokasi perpustakaan.

- Alamat lengkap dan informasi kontak.

- Informasi jam buka dan hari operasional.

**Berita/Kegiatan:**

- Daftar berita terbaru dan kegiatan perpustakaan.

- Setiap entri berita atau kegiatan memiliki judul, gambar, tanggal, dan ringkasan.

- Tombol "Baca Selengkapnya" untuk informasi lebih lanjut.

**Halaman Berita/Kegiatan Detail:**

- Judul, gambar, tanggal, dan informasi lengkap tentang berita atau kegiatan.

- Konten berita atau kegiatan.

**Pendaftaran Online:**

- Formulir pendaftaran online dengan bidang seperti nama, alamat, nomor kontak, dsb.

- Tombol "Kirim" untuk mengajukan pendaftaran.

- Informasi tentang keuntungan menjadi anggota perpustakaan.

**Footer:**

- Informasi kontak perpustakaan (alamat, email, nomor telepon).

- Tautan ke media sosial perpustakaan (jika ada).

- Tautan ke halaman Kebijakan Privasi dan Syarat & Ketentuan.

- Tautan ke FAQ (Pertanyaan yang Sering Diajukan).

- Hak cipta dan informasi lainnya.

Pastikan desain website ini responsif sehingga dapat diakses dengan baik di berbagai perangkat, termasuk komputer desktop, tablet, dan ponsel pintar. Selain itu, perhatikan juga aspek keamanan dan privasi ketika menangani pendaftaran online dan data pengguna.