Hallo ...
Semangat pagi !
Saat Saya posting artikel ini cuaca agak mendung kawan, tapi tenang saja, hati Saya tetap cerah kok *eaa*
Sejak Saya diberitahu oleh teman PKL bahwa ada framework css selain bootstrap, Saya langsung kepo. Saya coba mengorek informasi dari teman-teman RPL, dan juga mbah google tentunya. Ternyata tidak banyak artikel-artikel yang membahas tentang Framework CSS Materialize ini. Setelah membaca dan bertanya, ternyata Materialize ini cukup mudah untuk dipahami ketimbang bootstrap, dan tampilannya juga lumayan lebih bagus *menurut Saya*. Dan tentu tetap Responsive.
Nah, apa sih Framework CSS Materialize itu ?
Yuk simak !
Latar Belakang
Di tengah-tengah kepopuleran framework CSS seperti Bootstrap, Metro UI, Foundation, Flat UI, dan lain sebagainya yang memudahkan para developer untuk mendesain webnya. Lalu muncul salah satu framework bertema material design bernama Materialize.Sejarah
Di tahun 2014 Setelah Google mengumumkan Material Design, sebuah front-end design untuk produk mereka, yang pada awalnya hanya untuk platform Android saja, mulai digunakan oleh para developer web. Tak lupa Google juga mulai merubah desain produk-produk mereka dengan Material Design, yang membuatnya menjadi design yang "kekinian".Diprakarsai oleh Alvin Wang dan teamnya, Materialize merupakan salah satu framework material design, yang banyak digunakan oleh para web developer. Di dalam Materialize terdapat berbagai fitur pengenalan framework, mulai dari about yang berisi pengenalan produk, getting started tahapan sebelum memulai, css, components dan java script bagian yang berisikan code-code dan fitur-fitur yang berada di materialize, mobile bagian yang memperlihatkan beberapa fitur yang tersedia pada materialize untuk mobile, sampai showcase bagian yang memperlihatkan demo dari web yang menggunakan materialize, semuanya tersedia disitu.
Dengan framework materialize sendiri, kamu sudah bisa membangun sekedar web responsive bahkan web dengan model parallax. Karena memang pada dasarnya dibuat untuk mempermudah para web developer dalam mendesign front-end web mereka.
Materialize bisa menjadi pilihan alternatif bagi para developer jika ingin mendesain webnya dengan hal yang berbeda, karena memiliki fitur-fitur yang berbeda dari framework lain. Website Materialize dapat diakses di alamat materializecss.com.
Pengertian
Materialize adalah kerangka kerja seperti bootstrap, dimana framework khusus untuk frontend yang terdiri dari HTML, CSS, dan Javascript yang dapat kita gunakan langsung. Uniknya, Materialize mengimplementasikan material design (salah satu design yang dilakukan oleh google).Materialize dapat didownload di Website resminya. "Download disini"
Ada dua cara untuk memulai menggunakan materialize yaitu dengan menggunakan css biasa dan sass.
Materialize sendiri sudah mengandung SASS Mixin ,yang mempermudah Kamu dalam menggunakan CSS.
ini contoh penggunaan SASS (saya mengambil contoh sintaks css animation) :
-webkit-animation: 0.5s;
-moz-animation: 0.5s;
-o-animation: 0.5s;
-ms-animation: 0.5s;
animaton: 0.5s;
dari semua sintaks di atas Anda hanya perlu memanggil dalam satu baris sintaks sass mixin seperti ini :
@include animation(.5s);
Referensi
- https://www.codepolitan.com/- http://www.dumetschool.com/
