Kısaca Grunt

Grunt bir görev çalıştırıcısı. Web geliştirme sürecinde ihtiyacınız olan operasyonları otomatize etmenize yarayacak bir araç. Daha çok platforma dönüşmüş olan grunt, yüzlerce eklentiyle istediğiniz forma sokabileceğiniz bir yapılandırma aracı. Hızlıca bir örnek vereceğim. Basit bir web sitesi hazırlıyorsunuz ve stillerinizi css yerine less ile yazdınız, javascriptlerinizi cosnole.log debug satırlarıyla ve bir sürü yorum ile yazdınız. Sitenizi her yayına alacagınızda bir toparlama ve paketleme işi yapmanız gerekiyor, lessilerinizi css'lere derlemek, belki cssmin gibi ufaltma operasyonuna sokmak, imajlarınızı sıkıştırmanız, javascriptlerinizi temizleyip küçültmeniz belki birden fazla kaynağı tek dosyada birleştirmeyi isteyeceksiniz. Her değişiklik yaptığınızda bu işlemleri tekrarlamanıza imkan yok. İşte bu noktada grunt devreye giriyor.

Grunt ile neler yapabilirsiniz?

Sonu yok çünkü kendi eklentilerinizi yazarak node.js yeteneklerini kullanarak yapamayacağınız şey yok. Ama eklenti veritabanından erişebileceğiniz o kadar çok şey var ki.
- Less, Scss, Sass vb... herhangi bir css derleme işinizi
- Kod validasyonu (css, js, html)
- Imaj optimizasyonu
- Birden fazla javascript veya css kaynağını birleştirme
- Css veya javascript sıkıştırma
- Kodunuzdaki yorumları, debug için geriye kalan artıkları temizleme
- Kaynak versiyonlama

Daha sayamadığım bir çok operasyonu grunt ile farklı kombinasyonlarda hazırlamanız mümkün.

Örnek

Versiyonlamayı denemek için kendime bir örnek kod hazırladım ve github'da paylaştım. Basit bir css javascript projesinde kodumu yayınlamadan önce bütün css ve javascript kaynaklarımı sıkıştırıp adlarını versiyonlamarak yayındaki tüm dosyaların en taze kodu kullanmasını sağlamak için grunt kullandım. Projeyehttps://github.com/mfyz/grunt-release-boilerplate adresinden erişebilirsiniz.

Grunt hakkinda daha fazla bilgiye sitesinden erişebilirsiniz:http://gruntjs.com/

Popüler Etiketler

css3 browsers support url macosx apple osx player gimp internet facebook connect api ie browser javascript js php html object rss xml export css opengraph graph share social form button jquery iOS webkit web app app music google db database service free license lisans ubuntu ntfs fstab linux konsol login cache htaccess apache regex open source developer tebrik firefox howto oyun windows örnek kod ios itunes mobile banner workspace twitter meta search ajax portfolio mysql session blog pear mdb2 mssql pgsql compile nedir prepare execute mootools ipucu spam plugin box imza signature mail date sql diff subversion svn ruffles wanda editor coding radio switch optimizasyon analyse procedure pharma hack wordpress http server ingilizce widget language wireless query select html5 input cookie istatistik insanlar media dokuman seo optimization auth doritos kampanya tytz sitemap generator while job iphone ipad app store store in-app purchase purchase verification integration storekit itunes connect screen kontrol yapıları if zaman tarih notebook laptop sosyal link textarea bootstrap xmlhttprequest framework kitap statistics calendar tool mfyz medya download subscription git version control deployment chart applications ui ux icons assets less parse icon ikon grafik logo subdomain injection code kurulum nasıl www redirect crossdomain startups network internet explorer development lifestream table terminal compiler on-the-fly style route router mod_rewrite digital cms design proje fql newsletter ide phpstorm jetbrains xhtml