Post

Chirpy - Başlarken

Bu rehberde Chirpy'nin temellerini öğrenin. İlk Chirpy tabanlı web sitenizi nasıl kuracağınızı, yapılandıracağınızı, kullanacağınızı ve web sunucusuna nasıl dağıtacağınızı adım adım keşfedin.

Ön Koşullar

Temel ortam kurulumunu tamamlamak için Jekyll Dokümanlarındaki talimatları izleyin. Ayrıca Git de kurulu olmalıdır.

Kurulum

Yeni Bir Site Oluşturma

Bu tema için yeni bir depo oluşturmanın iki yolu vardır:

  • Using the Chirpy Starter - Güncellemesi kolaydır ve yazmaya odaklanmanıza yardımcı olur.
  • GitHub Fork - Özel geliştirme için uygundur, ancak güncellemesi zordur. Jekyll ile aşina değilseniz bu yöntem önerilmez.

Option 1: Using the Chirpy Starter

Option 2: GitHub Fork

Seçenek 1: Using the Chirpy Starter

GitHub’a giriş yapın ve Chirpy Starter sayfasına gidin, Use this template > Create a new repository butonuna tıklayın ve yeni depoyu USERNAME.github.io olarak adlandırın (USERNAME GitHub kullanıcı adınızı temsil eder).

Seçenek 2: GitHub Fork

GitHub’a giriş yapın ve Chirpy‘i forklayın, ardından depoyu USERNAME.github.io olarak yeniden adlandırın (USERNAME kullanıcı adınızı ifade eder).

Daha sonra, sitenizi yerel makinenize klonlayın. JavaScript dosyalarını oluşturmak için Node.js kurulumunu yapın ve şu komutu çalıştırın:

1
$ bash tools/init

GitHub Pages üzerinde sitenizi yayınlamak istemiyorsanız, yukarıdaki komutun sonuna --no-gh seçeneğini ekleyin.

Yukarıdaki komut şunları yapacaktır:

  1. Kodları en son etikete çeker.
  2. Gereksiz örnek dosyaları kaldırır ve GitHub ile ilgili dosyaları düzenler.
  3. JavaScript dosyalarını assets/js/dist/ dizinine aktarır ve bunları Git tarafından izlenir hale getirir.
  4. Yukarıdaki değişiklikleri kaydetmek için otomatik olarak yeni bir commit oluşturur.

Bağımlılıkları Yüklemek

İlk kez yerel sunucuyu çalıştırmadan önce, sitenizin kök dizinine gidin ve şu komutu çalıştırın:

1
$ bundle

Kullanım

Yapılandırma

_config.yml dosyasındaki değişkenleri gerektiği gibi güncelleyin. Bazı tipik seçenekler şunlardır:

  • url
  • avatar
  • timezone
  • lang
Türkçe için
  • lang: tr-TR
  • timezone: Europe/Istanbul

Sosyal İletişim Seçenekleri

Sosyal iletişim seçenekleri, yan çubuğun altında gösterilir. _data/contact.yml dosyasında belirtilen iletişimleri açık/kapalı olarak ayarlayabilirsiniz.

Stil Sayfasını Özelleştirme

Stil sayfasını özelleştirmeniz gerekiyorsa, temanın assets/css/jekyll-theme-chirpy.scss dosyasını Jekyll sitenizin aynı yoluna kopyalayın ve en sonuna özel stilinizi ekleyin.

6.2.0 sürümünden itibaren, _sass/addon/variables.scss içinde tanımlanan SASS değişkenlerini geçersiz kılmak istiyorsanız, ana sass dosyası _sass/main.scss dosyasını sitenizin _sass dizinine kopyalayın, ardından _sass/variables-hook.scss adında yeni bir dosya oluşturup yeni değerleri atayın.

Statik Varlıkları Özelleştirme

Statik varlıkların yapılandırması 5.1.0 sürümünde tanıtıldı. Statik varlıkların CDN’i _data/origin/cors.yml dosyasında tanımlanır ve web sitenizin yayınlandığı bölgenin ağ koşullarına göre bazılarını değiştirebilirsiniz.

Ayrıca, statik varlıkları kendiniz barındırmak istiyorsanız, chirpy-static-assets adresine başvurun.

Yerel Sunucuyu Çalıştırma

Site içeriğini yayınlamadan önce ön izleme yapmak isteyebilirsiniz. Bunun için şu komutu çalıştırın:

1
$ bundle exec jekyll s

Birkaç saniye sonra, yerel hizmet http://127.0.0.1:4000 adresinde yayınlanacaktır.

Dağıtım

Dağıtıma başlamadan önce, _config.yml dosyasını kontrol edin ve url‘nin doğru yapılandırıldığından emin olun. Ayrıca, proje sitesi tercih ediyorsanız ve özel bir alan kullanmıyorsanız, veya web sunucunuz GitHub Pages dışında başka bir base URL ile sitenizi ziyaret etmek istiyorsanız, baseurl‘i proje adınız olarak değiştirin, örneğin /proje-adı.

Jekyll sitenizi dağıtmak için aşağıdaki yöntemlerden birini seçebilirsiniz.

GitHub Actions Kullanarak Dağıtım

Hazırlanacak birkaç şey var:

  • GitHub Free planındaysanız, sitenizin deposunu herkese açık tutun.
  • Yerel makineniz Linux çalıştırmıyorsa ve Gemfile.lock dosyasını depoya eklediyseniz, sitenizin köküne gidin ve kilit dosyasının platform listesini güncelleyin:

    1
    
    $ bundle lock --add-platform x86_64-linux
    

Sonra, Pages hizmetini yapılandırın:

  1. GitHub’da depo Settings (Ayarlar) sekmesine gidin, sonra sol taraftaki menüden Pages‘i tıklayın. Source (Kaynak) bölümünde, açılır menüden GitHub Actions seçin.

Build source Build source

  1. GitHub’a herhangi bir commit iterek Actions iş akışını tetikleyin. Reposunuzun Actions sekmesinde, Build and Deploy iş akışının çalıştığını görmelisiniz. İnşaat başarıyla tamamlandığında, site otomatik olarak dağıtılacaktır.

Bu noktada, GitHub tarafından belirtilen URL’ye giderek sitenize erişebilirsiniz.

Manuel Olarak İnşa Et ve Dağıt

Kendi barındırılan sunucularda, GitHub Actions’ın sağladığı kolaylıktan yararlanamazsınız. Bu nedenle, sitenizi yerel makinenizde inşa etmeli ve ardından site dosyalarını sunucuya yüklemelisiniz.

Projenin köküne gidin ve sitenizi şu şekilde inşa edin:

1
$ JEKYLL_ENV=production bundle exec jekyll b

Belirli bir çıkış yolu belirtmediyseniz, oluşturulan site dosyaları projenin kök dizinindeki _site klasörüne yerleştirilecektir. Şimdi bu dosyaları hedef sunucuya yüklemeniz gerekmektedir.

This post is licensed under CC BY 4.0 by the author.