LESS nedir ?

Less Ruby de geliştirilmiş ve zamanla Javascripte aktarılmış bir css preprocessor (css onişlemcisi) dir.

Less icinde fonksiyonları, değişkenleri, karıştırmaları(mixin), matematiksel hesapları barındıran ve css yazımında kod fazlalığının onune gecen bir dinamik stil dosyasıdır. Stilleri tum ozellikleriyle destekleyen aynı zamanada icinde kendi kurallarını barındıran ve kullanıldığı projede buyuk yazılım kolaylığı sağlayan ender dillerden biridir.

Kullanıcıya sunduğu bircok kolaylık mevcut ancak iclerinde en yararlı olan ozelliği değişken tanımlama ozelliğidir. Değişken tanımlayarak yazılan kodları daha basit ve hızlı yontemde yazmanınızı sağlar. Ayrıca ileride birden cok alanın guncellenme gibi bir durum oluştuğunda ilgili değişkenin guncellenmesini rahatlıkla yapabilirsiniz.

Less bircok kullanıcıda merak uyandırmaktadır. Bu nedenle cok sayıda kullanıcı tarafından da ilgi gormektedir. Less dosyasının kullanımı ve kurulumu hızlı ve basittir. Yalnızca tarayıcı ve node.js uzerinde calışabilmektedir ve Less.js ve Css olmak uzere iki farklı şekilde kullanılabilmektedir.

LESS aynı zaman da size tasarım şablonları hazırlamanızda da yardımcı oluyor. Orneğin cok sık tasarımlar yapan birisiniz ve her seferinde belirli kodları yazmaktan sıkıldınız kopyala yapıştır ile uğraşmadan bu işin icinden cıkmak istiyor ve bir kalıp hazırlamak istiyorsunuz. Bu konuda da less uzerinde ufak bir script hazırlayıp bu işleri halledebilirsiniz.


Peki nasıl calışır bu less?
Kurulum ve Başlangıc Aşaması

LESS sadece tarayıcı veya node.js uzerinden calışan bir JavaScript yazılımıdır. Kullanımında ise iki ayrı yontem onerilmekte.

1. Yontem : LESS dosyalarını CSS olarak derlemek

Projenizi LESS ile yazdıktan sonra canlıya gecme aşamasında tum LESS dosyaları CSS ’e cevrilebilir ve o haliyle yayınlanabilir. Boylece sadece development aşamasında değil site hızı tarafında da hız kazanılır. Online olarak LESS ’den CSS ’e kod cevirimi yapan bircok arac mevcut. En populerlerinden biri de LESS2CSS.

2 .Yontem : LESS.JS Kullanımı

Bu yontem LESS ’in kendi web sayfasında da tarif edilen, LESS dosyalarınızın altına ekleyeceğiniz bir JS dosyası sayesinde tum stil tanımlanırız gercek zamanlı olarak işlenir ve calışır hale gelir. Kullanımı kolaydır. Ancak kimi zaman verimsiz olabilir. Cunku sitenize giren kullanıcının tarayıcısı daha fazla işlem yapmak zorunda kalır.

Web sayfanıza aşağıdaki satırları eklemek yeterli. Burada onemli nokta stillerimizi iceren LESS dosyaları JS dosyasının ustune olmak durumunda.

3. Yontem : Mixins

Stil birleştirmeleri (Mixins) yapısı sayesinde daha once başka bir element icin tanımladığımız stil seceneklerini bir başka element icin de kullanılabilir kılıyoruz. Normal CSS yazarken bu işlem bir cok kodu kopyala yapıştır mantığında yapmamıza sebep olur ve satır sayısını fazlasıyla arttırırdı.