Hugo ve Netlify ile Websitesi Oluşturma

Posted on February 20, 2023  •  2 minutes  • 396 words  • Other languages:  English

Hugo ve Netlify Kullanarak Bir Web Sitesi Nasıl Oluşturulur?

Türkçe’ye tercüme edilmesinde ChatGPT kullanılmıştır.

Hugo

Hugo bir statik site oluşturucusudur (SSG: static site generator). SSG, statik bir web sitesi oluşturan bir araçtır. Ziyaret edildiklerinde dinamik olarak değişmezler ve herkes tarafından aynı şekilde görülebilirler. Çeşitli temaları olan web siteleri üretmek için özel bir araçtır. RStudio'daki blogdown paketi de aynı amaçla Hugo’yu kullanır.

Netlify

Netlify, İçerik Dağıtım Ağları (CDN: Content Delivery Network) ile web sitelerinin sürekli güncellenmesi ve dağıtımı için bir platformdur. “Hugo web sitenizi yönetmek için sürekli dağıtım hizmetleri, küresel CDN, ultra hızlı DNS, atomik dağıtımlar, anında önbellek geçersiz kılma, tek tıklamayla SSL, tarayıcı tabanlı bir arayüz, bir CLI ve diğer birçok özellik sağlar.” şeklinde açıklanmıştır.

Başlangıç

Öncelikle, web sitesi içeriği ve ilgili yapılandırma dosyaları ve klasörleri GitHub’ta barındırılabilir, bu da canlı web sitesine içerik ve değişikliklerin daha erişilebilir ve hızlı bir şekilde dağıtılmasını sağlar.

GitHub ve Netlify profillerinin oluşturulması gerekir. Hugo, Windows ve Linux işletim sistemlerinde Komut İstemi Arayüzü (CLI: Command Line Interface) aracılığıyla çalışır.

1. Hugo, yerel geliştirme için mevcut işletim sistemine yüklenmelidir. Windows işletim sistemi için PowerShell’de şu kod çalıştırılarak yüklenebilir:

winget install Hugo.Hugo

2. Sitede kullanmak için bir tema indirmek gerekmektedir.
3. Temanın bir örnek site klasörü varsa, ana proje klasörüne kopyalamak, varsayılan yazılarla temayı daha kolay görmemizi sağlayacaktır. (npm run veya hugo serve gibi) temanın dokümanlarında belirtilen komutlarla, site yerel bilgisayarınızda çalıştırılabilir ve PowerShell’de belirtildiği adreste (http://localhost:1313/) tarayıcıyla görüntülenebilir.
4. Projenin, dosyaların olduğu klasör GitHub’a yüklenmelidir: GitHub Desktop kullanarak, yeni bir depo (repository) oluşturmak ve GitHub’ta yayınlamak (commit ve push) mümkündür.
5. Projeyi içeren çevrimiçi GitHub deposu, Netlify ile paylaşılabilmektedir. Netlify’da oturum açtıktan sonra ilgili sayfada “Yeni site ekle (Add new site)” seçeneği bulunur ve “Mevcut bir projeyi içe aktar (Import and existing project)” seçilir.
6. Netlify özelleştirilmiş komutlar ile de çalıştırılabilir. Örneğin npm i && HUGO_ENVIRONMENT=production hugo –gc.
7. Herhangi bir hata olursa, log kaydı ayrıntılar için Netlify’de kontrol edilebilir.
8. Herhangi bir değişiklik veya yeni bir yazı dosyası GitHub proje deposuna yüklenirse, Netlify tarafından otomatik olarak site tekrar oluşturulur. Bir sorun yoksa site saniyeler içinde çevrimiçi olur.

Ücretsiz ve Premium Web Sitesi Oluşturma

Seçilen temanın fikri mülkiyet kullanımı öğrenilmelidir. GitHub ücretsiz bir üyeliğe sahiptir. Netlify’nin de ücretsiz bir üyelik seçeneği vardır. Netlify’den daha fazlasını almak isterseniz, premium bir abonelik seçeneği de bulunur. (www.myname.com ) gibi belirli bir alan adını kiraladıysanız, alan adı sunucularını Netlify’e yönlendirerek projenizle kendi alan adınızı kullanabilirsiniz."

Ayrıntılı Bilgi İçin: Host on Netlify by Hugo