Perbedaan Antara CSS, LESS, & SASS

Perbedaan Antara CSS, LESS, & SASS – Menulis stylesheet untuk situs web adalah seni. Dengan semua cara berbeda kita bisa memanipulasi elemen HTML, penting untuk menjaga kode sebersih mungkin untuk menghindari masalah gaya aneh itu. Di situlah LESS dan SASS masuk.

CSS, LESS dan SASS

Penting untuk mengetahui perbedaan mendasar antara CSS dan LESS dan SASS. LESS dan SASS adalah pra-prosesor untuk kode CSS. Kita dibiarkan menggunakan variabel dan beberapa logika di stylesheet kita. Karena kita dapat menulis kode aktual di dalam stylesheet, lembar kita menjadi dinamis dan sangat berguna untuk desain responsif.

Dengan CSS saja, kita harus menuliskan gaya yang kita inginkan di tempat yang kita inginkan. File CSS kita tidak akan diperbarui setelah dimuat. Apa yang kita tulis adalah apa yang kita dapatkan. Pra-prosesor bisa membuatnya lebih mudah untuk melakukannya.

Tentang Pra-prosesor

Pra-prosesor hanyalah sebuah program yang menulis CSS untuk kita berdasarkan kode yang kita tulis. Dengan menggunakan pra-prosesor, kita dapat melakukan hal-hal seperti menggunakan pewaris pewarisan dan pencampuran. Itu bukan opsi dengan CSS biasa.

Pra-prosesor membuatnya lebih mudah untuk membaca lembar gaya kita dan mencari tahu bagaimana semuanya terhubung. Itu membuatnya lebih mudah untuk mempertahankan dan memperbarui gaya kita tanpa melakukan banyak penggalian untuk mencari tahu mengapa gambar itu tiga piksel tambahan di sebelah kanan.

LESS

LESS singkatan Leaner Style Sheets. Ini biasanya pilihan untuk proyek ketika kita ingin menggunakan JavaScript dengan stylesheet kita. Menggunakan LESS tidak jauh berbeda dari menulis CSS biasa juga. Ada beberapa add-on kecil yang membuatnya lebih mudah untuk menangani CSS kita, tetapi mereka cukup mudah diambil.

Sangat mudah untuk menggunakan kembali bit CSS di dalam file LESS kita dengan menggunakan variabel dan campuran dan bahkan perhitungan. Jika Anda benar-benar memahami gaya aplikasi, kita memiliki opsi untuk mengedit file JavaScript yang mengontrol LESS. Biasanya kita tidak ingin menyentuh file JavaScript tetapi tidak ada salahnya untuk melihat-lihat.

SASS

SASS pada dasarnya sama dengan LESS, kecuali itu digunakan dalam aplikasi Rails. SASS adalah singkatan dari Style Style Synatactically Awesome. Kita dapat menginstalnya dengan hal-hal yang disebut gems dan saya akan membiarkan pengembang Ruby / Rails memberi tahu kalian semua tentang spesifikasinya. Yang utama adalah bahwa SASS adalah pra-prosesor CSS lain yang membuatnya lebih mudah bagi kita untuk menulis CSS.

Kita masih memiliki mix-in dan variabel serta semua hal-hal mewah lainnya. Seperti LESS, SASS juga sepenuhnya kompatibel dengan file CSS biasa. kita tidak perlu waktu lama untuk bangun dan berjalan dengan salah satu dari pra-prosesor ini.

CSS

Satu hal yang tidak dapat kita abaikan, terlepas dari pra-prosesor yang kita gunakan, adalah mengetahui cara nyata menulis CSS. Ketika kita mulai melihat pra-prosesor kita harus memiliki tingkat penguasaan tertentu atas CSS. Kita harus dapat membuat aplikasi web kita terlihat seperti desain tanpa menggunakan pra-prosesor.

Kita juga harus tahu cara merancang file CSS. Itu akan membuat LESS atau SASS mudah dibaca sehingga kita tidak melompat melalui pohon seperti orang gila. Tidak ada yang lebih penting daripada mengetahui dasar-dasarnya dan CSS adalah tentang dasar seperti yang kita dapatkan.

Semoga itu masuk akal tentang CSS vs LESS vs SASS. Mereka semua benar-benar melakukan hal yang sama. Mereka hanya melakukannya dengan sedikit berbeda. Kalian bisa membaca lebih banyak tentang CSS disini. Lalu ada SCSS yang merupakan spin off thingy dari SASS. Saya pernah menggunakannya dalam proyek non-Ruby sebelumnya tetapi untuk bersikap adil itu bukan proyek terbesar. Adakah yang lain yang menggunakan SCSS di luar Ruby / Rails?