Sampai tahap ini kita sudah memahami dua pilar dalam membentuk sebuah website, yakni HTML dan CSS, dengan membuat sebuah halaman website sederhana dalam menampilkan informasi mengenai kota Bandung.

Dalam pengembangannya kita sudah memahami perbedaan block element dan inline element. Kita juga sudah terapkan konsep semantic HTML sehingga kerangka HTML yang dibuat, sesuai dengan fungsi elemennya.

Lalu kita juga sudah memahami bagaimana cara kerja CSS dalam mendekorasi elemen HTML, menetapkan sebuah selector, membangun layout dengan menggunakan float, dan mengetahui prinsip pendekatan layout yang responsif dengan teknik media query.

Selanjutnya kita akan belajar mengenai pilar ketiga dalam pengembangan website, yaitu JavaScript. Dalam mempelajarinya kita akan coba menyelesaikan sebuah studi kasus, yakni membuat kalkulator berbasis website. Targetnya pada akhir kelas ini kita dapat membangun kalkulator sederhana yang tampak gambar di bawah ini:


Menarik bukan? Tentunya sebelum kita membahas JavaScript lebih jauh, kita akan belajar bagaimana cara membuat layout kalkulator.

Dalam proses pembuatanya, kita akan mencoba teknik baru dalam penyusunan layout, yakni menggunakan Flexbox. Teknik ini hadir pada CSS3 dan menjadi salah satu pendekatan populer dalam penyusunan layout yang responsif. Nantinya kalkulator yang kita kembangkan ini dapat digunakan dengan baik pada mobile device.


Sebelumnya : Memperbaiki CSS Selanjutnya : Flexible Box Model