Irfan Maulana

Membuat Popup Modal Sederhana - Popup Modal adalah jendela sembul yang muncul di sebuah aplikasi baik dengan disengaja ataupun sekarang ini banyak pula yang tanpa dilakukan perintah oleh User namun tiba-tiba muncul Popup Modal tersebut. Dalam sebuah aplikasi ataupun halaman website Popup Modal seringkali digunakan ketika kita ingin memberikan informasi ataupun meminta User melakukan sesuatu namun kita tidak ingin User kita meninggalkan halaman yang sedang dikunjunginya sekarang. Salah satu praktek yang seringkali digunakan adalah untuk membuat form Log-in Register, dimana biasanya menggunakan Popup Modal Sebagai penampung nya.

more

Sisi Gelap Bootstrap CSS - Bootstrap CSS adalah salah satu Framework CSS terpopuler, terbaik dan terlengkap sampai saat ini. Ada banyak sekali hal yang dipermudah dengan menggunakan Bootstrap dibandingkan kita membuatnya manual menggunakan CSS native. Namun seperti setiap hal di dunia ini yang jika digunakan berlebihan pasti akan berdampak tidak baik, maka Bootstrap dengan segala kepopuleran serta kelebihan yang dimilikinya pun terkadang menjadi hal yang tidak baik untuk digunakan.

Apa sebabnya ?

more

Mengenal BEM CSS - Setelah beberapa kali menulis dan menjelaskan soal BEM CSS, kali ini saya coba kembali menuliskan di blog ini dan berusaha menjelaskan mengenai BEM CSS dalam bahasa Indonesia yang semoga bisa dan masih mudah dipahami.

Pada dasarnya sudah banyak artikel diluar sana yang juga menjelaskan hal yang sama mengenai BEM CSS, namun memang sumber yang berbahasa Indonesia memang masih minim atau bahkan sangat sulit untuk ditemukan. Berangkat dari hal tersebut juga saya berusaha konsisten menulis di blog ini dalam bahasa Indonesia.

more

Membuat Button dengan SASS - Button merupakan salah satu kompoenen web yang sering digunakan karena fungsinya yang menunjukkan sebuah aksi yang bisa dieksekusi setelah di klik. Button diluar sana terdapat banyak sekali variasinya tergantung dari faktor kebutuhan, estetika, maupun kesenangan pengguna maupun pengembang web.

more

Membuat CSS Grid - CSS Grid merupakan layout kumpulan class CSS yang digunakan untuk mengatur layout sebuah halaman website. Pada framework-framework CSS populer di luar sana, hampir semuanya mengakomodir kebutuhan CSS Grid dengan pendekatannya masing-masing.

CSS Grid biasanya membagi layout ke dalam konsep row dan column. Dimana row akan berfungsi seperti tr pada table HTML, sedangkan column akan berfungsi layaknya td pada table HTML.

more

Membuat Checkbox dengan SASS - Bila pada tulisan sebelumnya disini kita sudah bahas mengenai sedikit eksperimen kita dalam memberikan Style pada komponen input radio, maka kali ini kita akan coba ber-eksperimen lagi dengan komponen lainnya dan saya memilih komponen input dengan type checbox atau kita sebut saja sebagai checkbox. 

Bosan ? semestinya sih kalau lagi dalam tahap belajar tidak boleh bosan ya, karena learning by doing masih jadi cara yang paling baik buat belajar koding. Jadi ya, sabar ya dan silahkan disimak langkah-langkahnya sebagai berikut :

Pertama, kita akan siapkan seperti biasa HTML dasar yang nantinya akan kita beri style. Sederhana saja cuma definisikan input dengan type=”checkbox”_, kita buat saja 3 varian seperti sebelumnya dengan 1 kita buat sebagai input yang _disable atau tidak dapat dipilih oleh pengguna. Berikut kurang lebih kode HTML yang kita buat :

more

Mengenal SASS, Belajar SASS - Sudah tau SASS ? Yap hari ini kita akan belajar dan mengenal SASS sebagai salah satu vendor CSS Pre-processor yang tersedia di pasaran. Artikel ini ditujukan untuk yang sudah paham dengan CSS, bila Anda merasa masih terlalu awam dengan CSS mungkin artikel ini akan membantu Anda memahami CSS.

Pre-processor sendiri merupakan extend dari CSS, dimana ketika kita ngoding CSS kita biasa berkutat dengan bahasa yang sudah harus matang dan tidak boleh ada proses lagi bagi browser untuk memahami nya, ini yang membuat kita tidak bisa menanamkan logic seperti perulangan, peng-kondisian, ataupun pemakaian kembali kode yang ada. Dari sinilah lahir berbagai pre-processor untuk CSS, termasuk SASS itu sendiri.

more

Pernahkan Anda melihat komponen input dengan tipe Radio standard yang di sajikan oleh HTML ? Betapa tidak enaknya dipandang mata bukan ? Maka sekarang kita akan coba memberikan sentuhan sederhana kita agar tampilan input dengan tipe Radio ini lebih nyaman untuk dilihat mata.

Pertama, kita akan coba buat elemen HTML radio kita dan coba saja kita lihat apa yang ditampilkan oleh browser kita apabila tidak ada satupun style yang berada disana, berikut potongan kode HTML nya :

more

Mengenal CSS - Setelah seri 1 membahas HTML, pada seri kedua kali ini saya akan membahas mengenai CSS dasar.

Sekali lagi saya mengingatkan bahwa tulisan ini adalah rangkaian untuk memberikan pengetahuan dasar bagi mereka yang pemula yang ingin belajar dan mengetahui dasar untuk menjadi Frontend Developer.

Berikut bahasan mengenai CSS, silahkan disimak.

more