Gulp Nedir? Nasıl Kurulur?

Gulp Nedir? Nasıl Kurulur?

Gulp, otomatize edilmesi gereken işleri sizin kurguladığınız sürece göre yapan bir araçtır.

Gulp Nedir?

Teknoloji geliştikçe bazı kavramların tanımları da gelişiyor. Bir kaç yıl önce front-end geliştirici kavramı PSD'yi CSS'ye aktaran olarak biliniyordu. Ancak gelişen web dünyası ile birlikte bilmediğimiz kavramlar ortaya çıktı ve sonucunda front-end geliştirici tanımı tamamen gelişti. Günümüzde "front-end geliştirici" kavramı, CSS framework bilen, CSS preprocessor kullanan, FTP araçlarını kullanabilen, versiyon kontrol sistemi kullanan, W3C standartlarına uygun kod yazabilen, Javascript'e aşina olan kişiler olarak tanımlanıyor.

Front-end geliştiriciler yeni teknolojileri kullandıkça otomatize edilmesi gereken angarya işler de çoğaldı. Bu angarya işler için modüller, araçlar üretildi. İşte Gulp bu araçlardan bir tanesi.

Gulp ile Neler Yapabilirsiniz?

  • Kodlarınızı W3C standartlarına göre kontrol ettirebilirsiniz.
  • Pre-processorlerle yazdığınız kodları derleyebilirsiniz.
  • Dosyalarımızın boyutunu düşürebilirsiniz.
  • Resim sıkıştırabilirsiniz.
  • HTML, CSS, JS kodlarınızı sıkıştırabilirsiniz.
  • Hatta dosyalarınızı FTP'ye bile atabilirsiniz.
  • Daha fazla  gulp eklentileri için buraya tıklayın.

Gulp Nasıl Kurulur?

Gulp kullanabilmemiz için bilgisayarımızda Node JS'in global olarak kurulu olması lazım. Node JS kurmak için buraya tıklayın. İlk önce sisteminize gulp kurmanız lazım. Bunun için aşağıdaki kodu konsol ekranında (cmd) çalıştırın.

npm install -g gulp

Sonrasında gulp kullanmak istediğiniz proje dizinini konsol ekranından açıp aşağıdaki kodu yazın.

npm install gulp --save-dev

Proje dizininizde "node_modules" adında yeni bir klasör oluştu. Bu klasörde kurulumunu yaptığınız nodejs modülleri bulunur. Aşşağıdaki kodları gulpfile.js adında dosya oluşturup içine yazın. 

// Gulp modülünü sayfamıza dahil edelim 

var gulp = require('gulp'); 

// Gulp ile default olarak bir görev tanımlayıp ekrana Merhaba, Gulp yazalım. 
gulp.task('default', function() { console.log('Merhaba, Gulp'); });

Konsol ekranını açıp ekrana gulp yazın ve gulp dosyasını çalıştırın.

Evet, gulp çalıştı ve konsol ekranına "Merhaba, Gulp" yazısını yazdırdı.

Eklenti Kurulumu

Gulp eklentilerine buradan erişebilirsiniz. Beğendiğiniz eklentinin üzerine tıklayın. Açılan sayfada install bölümünde eklentinin kurulumu için çalıştıracağınız kod parçacığı bulunmakta. Bu kodu konsol ekranında çalıştırın ve sonrasında example bölümündeki örnekleri de gulpfile.js dosyasına dahil edip konsolda "gulp" komutuyla çalıştırın.

Yorum Yaz

Yorum yazabilmek için üye girişi yapmanız gerekiyor!

Anlatım için teşekkürler
Çok işime yarayacak.

Yukarı Git