Skip to content
This repository has been archived by the owner on Dec 7, 2022. It is now read-only.

grafixcw/boilerplate

Repository files navigation

[PROJE_ADI] Web Sitesi

[PROJE_ADI] için tasarlanmış web sitesinin HTML dönüşümü projesidir.

Başlarken

Proje geliştirilirken HTML, CSS ve JavaScript harici olarak bazı teknolojiler kullanılmıştır. Geliştirme için en azından bu araçlar/teknolojilerin kullanımı hakkında bilginiz olması beklenir.

Araçlar / Teknolojiler

  • Node.js
  • NPM / Yarn Paket Yöneticisi
  • Gulp.js
  • Bootstrap
  • jQuery
  • SASS CSS Preprocessor

Özellikler

  • Sass dosyaları CSS'e dönüştürülür. Dönüştürme sonrası autoprefixer ile package.json dosyası içerisinde belirtilmiş, tarayıcı listesine göre stil değerlerine ön ek eklenir. Tek dosyada birleştirilip küçültülür.
  • JavaScript dosyaları tek dosyada birleştirilip küçültülür. Güncel ES6 yazımını destekler, Babel ile ES5 yazımına çevrilir.
  • Görseller formatlarına uygun şekilde optimize edilir.
  • Browser-sync ile canlı sunucu oluşturulup, dosya değişikliklerine göre sayfa yenilemeleri otomatik yapılır.
  • Çıktı dosyalarını zip olarak arşivleyebilirsiniz.

Kurulum Talimatları

Projeyi indirin

Projeyi, git üzerinden klonlayabilir ya da bu linkten indirebilirsiniz.

git clone [GITHUB_REPO].git

Node.js

Geliştirmeye başlamadan önce sisteminizde Node.js yüklü olduğundan emin olunuz. Eğer sisteminizde yüklü değilse nodejs.org adresinden işletim sisteminize uygun sürümü indirip kurunuz.

UYARI!

Mevcut sisteminizde daha önceden Gulp.js'yi global olarak kurduysanız, lütfen npm rm --global gulp komutu ile sisteminizden kaldırın.

Detaylı bilgi için bu makaleyi okuyabilirsiniz.

Gulp.js CLI'yi yükleyin

Komutu çalıştırarak Gulp.js CLI'yi yükleyin.

npm install --global gulp-cli

Bağımlılıkları yükleyin

Proje geliştirilirken Yarn paket yöneticisi kullanılmıştır. Kullanmak istediğiniz paket yöneticisine uygun aşağıdaki kurulum komutlarını çalıştırın.

# Yarn Paket Yöneticisi için;
yarn install

# NPM Paket Yöneticisi için;
npm install

Geliştirmeye başlayın

Belirtilen talimatları uyguladıktan sonra aşağıdaki komutu çalıştırarak geliştirmeye başlayabilirsiniz.

# Yarn Paket Yöneticisi için;
yarn dev

# NPM Paket Yöneticisi için;
npm run dev

Happy coding 😎


Demo

Projeyi buradan inceleyebilirsiniz.

Hata ve Yeni Özellik İstekleri

Geliştirme aşamasında herhangi bir hata mı aldınız? Yeni bir özellik eklemenmesini mi istiyorsunuz? O halde Github üzerinde yeni bir istek başlığı oluşturunuz.

Telif Hakkı & Lisans

Telif hakları Grafix Kreatif Yazılım Atölyesi ve Tanju Yıldız'a aittir. Proje kodları MIT lisansı altında sunulmuştur.