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

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