ETS PWEB

ETS PWeb

Nama : Hana Maheswari

NRP : 5025211182

Kelas : Pweb A

Tahun : 2023

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

HTML (HyperText Markup Language) adalah bahasa yang menggunakan tanda-tanda tertentu (tag) untuk menyatakan kode-kode yang harus ditafsirkan oleh browser agar halaman tersebut dapat ditampilkan secara benar. Secara umum, fungsi HTML adalah untuk mengelola serangkaian data dan informasi sehingga suatu dokumen dapat diakses dan ditampilkan di Internet melalui layanan web.

Fungsi HTML yang lebih spesifik yaitu :

Membuat halaman web.
Menampilkan berbagai informasi di dalam sebuah browser Internet.
Membuat link menuju halaman web lain dengan kode tertentu (hypertext).

CSS merupakan kode-kode yang dipakai untuk mendesain laman HTML. CSS berfungsi untuk membantu para web designer agar dapat mengubah dan menambahkan, baik teks, gambar, hingga latar belakang sebuah halaman HTML. Biasanya, keberadaan CSS dapat langsung terlihat dengan adanya perbedaan pada warna teks. CSS memberi perintah teks berwarna biru dengan tag <span> dengan tambahan tag class=” nama warna”. Dengan demikian, setiap tag <span> muncul, teks yang mengikutinya akan berwarna sesuai warna yang diinginkan.

Fungsi CSS lainnya :

Proses loading halaman web lebih cepat

Satu rangkaian kode CSS dapat diaplikasikan untuk beberapa halaman website sekaligus sehingga jumlah kode dapat diminimalkan. Hal ini tentunya akan membuat beban loading website menjadi lebih kecil sehingga kecepatan saat loading website menjadi lebih cepat.

Beragam variasi

8HTML dapat digunakan untuk mengatur tampilan website, tetapi terbatas. Namun hal tersebut tidak berlaku bagi CSS yang menawarkan lebih banyak style tampilan pada halaman website.

Tampilan website akan lebih rapi

9Dengan menggunakan CSS, tampilan halaman website pun akan rapi dan optimal di berbagai ukuran layar pengguna, baik desktop maupun smartphone. Sehingga pemilik website tidak perlu mengatur website saat dibuka dari perangkat-perangkat pengunjung.

JavaScript adalah bahasa skrip yang digunakan untuk membuat konten halaman web dinamis, berfungsi untuk membuat elemen yang mampu meningkatkan interaksi pengunjung seperti menu drop-down, animasi, dan warna background dinamis.

Fungsi Javascript secara detail :

Efisiensi Pengembangan Aplikasi Web dan Seluler

Pengembangan framework JavaScript, yang terdiri dari library kode JavaScript, memungkinkan developer menggunakan kode JS siap pakai dalam proyek mereka. Proses yang harus dilalui menjadi lebih cepat dan efisien karena tidak perlu menulis kode dari nol. Misalnya, framework front-end seperti jQuery dan ReactJS dapat membantu meningkatkan efisiensi desain. Developer dapat menggunakan ulang dan memperbarui komponen kode tanpa memengaruhi satu sama lain, baik dari segi fungsi maupun nilai. Implementasi kode JS di Node.js juga berperan penting dalam web development. Node.js dapat mengurangi waktu respons server karena sifatnya yang single-threaded dan memiliki arsitektur non-blocking.

Membangun Web Server dan Aplikasi Server

Melalui Node.js, JavaScript memungkinkan developer membangun web server dan infrastruktur back-end sehingga akan menghemat waktu dan tenaga dalam hal pembuatan web server. Modul HTTP built-in pada bahasa pemrograman ini memungkinkan untuk mengembangkan server HTTP basic yang menampilkan teks biasa saat pengunjung mengakses halaman web. Developer dapat menggunakan web server Node.js sendiri, Node-OS, atau milik pihak luar seperti Microsoft Internet Information Services (IIS) dan Apache untuk menangani permintaan HTTP.

Membuat Website yang Interaktif

Fungsi JavaScript berikutnya adalah untuk menciptakan halaman web yang dinamis, seperti untuk menampilkan animasi, mengubah visibilitas teks, dan membuat menu drop-down. Meskipun dapat digunakan HTML dan CSS saja untuk membuat website, halaman yang dihasilkan hanya akan memiliki tampilan statis tanpa adanya JavaScript. Bahasa pemrograman ini memungkinkan pengunjung berinteraksi dengan halaman web, dan Anda pun bisa menyajikan user experience yang lebih baik. Selain itu, JavaScript memungkinkan Anda mengubah konten dan nilai atribut HTML tanpa harus merefresh halaman web dulu.

Bootstrap adalah framework CSS, HTML, dan JavaScript untuk mempermudah pembuatan website responsif dan mobile-friendly. Dengan framework ini, developer bisa bekerja lebih cepat dengan memanfaatkan berbagai fungsi dan fitur framework.

Beberapa fungsi utama Bootstrap :

Mengembangkan website mobile-friendly. Sudah lama dikenal sebagai framework mobile-first, Anda bisa mengandalkan sistem grid untuk menciptakan website yang bekerja sempurna di perangkat mobile.
Menjadikan website lebih interaktif. Fitur custom plugin JQuery memungkinkan Anda untuk berkreasi dengan pop-up, transisi, carousel, dan elemen interaktif lainnya.
Menambahkan elemen website lebih mudah. Memanfaatkan koleksi elemen bawaan, developer dapat langsung menambahkan menu drop down, navigasi, gambar thumbnail, dan elemen dasar lainnya ke dalam website.
Mempercepat resize gambar. Developer tidak perlu menyediakan file gambar dalam banyak ukuran atau menambahkan script panjang untuk membuat gambar responsif. Cukup dengan class.img-responsive, ukuran gambar di website akan menyesuaikan ukuran layar perangkat user secara otomatis.
Mendesain tampilan website modern. Era website statis klasik telah lama selesai. Sekarang adalah masa keemasan website modern dengan tampilan fresh, clean, dan relatif minimalis. Dan Bootstrap adalah framework unggulan untuk mewujudkan website modern kekinian.
Menghemat Waktu Developer. Tidak perlu membuang-buang waktu untuk mengembangkan website dari nol (scratch). Dengan berbagai fitur bawaan framework, dapat menghasilkan website berkualitas dalam waktu singkat.

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

HTML dan CSS

Link Deploy : Deploy Portofolio
Link Github : Github Portofolio

Javascript

Link Deploy : Deploy Form Validasi
Link Github : Github Form Validasi

Bootstrap

Link Deploy : Deploy Login Page
Link Github : Github Login Page

3. Sebuah perpustakaan ingin membuat aplikasi web. Fungsi aplikasi untuk display koleksi buku, peta lokasi, informasi berita/ kegiatan, dan pendaftaran online. Desainkan front end website perpustakaan.