MACOS'da Hugo ile web sitesi kurulumu

MACOS’da Hugo ile web sitesi kurulumu

Murat Haktanır

Apr 02, 2023 - 2 Min read

Bu yazımızda MACOS’da Hugo ile websitesi kurulumunu HUGO dokümanlarından faydalanarak işleyeceğiz.

Adım adım kurulumu buradan takip edebilir, kendi yerel ortamınızda deneme yapabilirsiniz.

İlk Aşama

Pakat yöneticiniz var mı?

“Paket yönetim sistemi ya da paket yöneticisi; yazılım paketlerinin ve kütüphanelerinin kurulum, güncelleme, konfigürasyon, kaldırılması işlemlerinin tutarlı ve stabil bir şekilde yürütülmesini sağlayan olan sistemlerdir. Tipik olarak paket ve kütüphanelerin hangi versiyonunun kurulduğunu ve birbirlerine olan bağımlılıklarını da hesaba katarlar. Modern paket yöneticilerinin birçoğu merkezi bir kaynaktan yazılım ve kütüphanelerin indirilip yüklenmesi işlevine sahiptirler.” (wiki)

Farklı paket yöneticileri arasında Homebrew öne çıkan özellikleriyle tercihimiz oluyor.

Homebrew yüklemek için aşağıdaki kodu terminale yapıştırmanız gerekiyor.

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Homebrew ile Hugo extended sürümünü bilgisayarımıza yüklememiz gerekiyor. Bunun için aşağıdaki kodu terminalde çalıştırmanız gerekiyor.

brew install hugo

İkinci Aşama

Bu aşamaya geçmeden önce bilgisayarınızda kendinize bir çalışma alanı belirlemeniz gerekiyor. Dosya yöneticinizde veya terminalde kendinize hugo isimli bir dosya oluşturabilir ve bu dosya içerisinde localde çalıştıracağınız dosyalarını kurabilirsiniz.

Terminal için aşağıdaki kod ile hangi path içerisinde olduğunuzu belirlemeniz önemlidir.

pwd

Bulunduğunuz dosyayı belirlendikten, Hugo yüklendiktens sonra ilk sitenizi localinizde çalıştırmak için hazırsınız demektedir. Aşağıdaki kodlar ile ilk kurulumu yapabilirsiniz.


hugo new site quickstart
cd quickstart
git init
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke themes/ananke
echo "theme = 'ananke'" >> config.toml
hugo server

Üçüncü Aşama

Anake temalı hugo websiteniz şu anda çalışıyor olmalı ve tarayıcınızda localhost:1313 ile ulaşılabilir olması gerekir.

Eğer bu aşamaya kadar gelmeyi başardıysanız bundan sonra içerik yüklerken yapacaklarınız önemlidir.

Aşağıdaki kod ile post isimli bir dosya içerisinde ilk postu açabilir ve düzenleyebilirsiniz.

hugo new posts/my-first-post.md

Hugo bu kod ile content/posts/ içeriğinde my-first-post isminde bir md dosyasını oluşturacaktır.

Kullandığınız düzenleme programı ile bu md dosyasını açarak düzenleme yapabilirsiniz. Eğer terminalde devam etmek istiyorsanız vim ile de bu dosyayı düzenlemeye devam edebilirsiniz.

---
title: "My First Post"
date: 2022-11-20T09:03:20-08:00
draft: true
---

Yukarıdaki eklemeyi düzenleme programanızda ya da vim ile eklemeniz gerekiyor. Burada yazdıklarımıza inceleyelim.

** title: postunuz başlığını temsil etmektedir. ** date: Bu postun hangi zamana ait olduğunu bildirir. ** draft ise iki şarta bağlı olarak çalışır. Eğer true ise Hugo bu postu yayına almayacak ve geliştirme ortamında düzenlemeye devam etmeniz için tutacaktır. Localde çalışmayacaktır. Diğer değerimiz ‘false’ ise yayına almanızı sağlyacaktır.

“—” işaretlerinden sonra md file ile yazacaklarınız “content” olarak algılanacak ve md file kuralarına tabi olacaktır.

Son olarak bu aşamalardan sonra aşağıdaki kod ile

hugo server

localhost:1313 içerisinde ilk postunuzu görebilir, düzenleme programınızda düzenlemeye devam edebilirisinz.

Hugo ile websitesini tasarlamak ve geliştirmek statik websiteleri arasında hem seo hem de açılış hızları bağlamında birçok faydayı bünyesinde bulundurmaktadır.

Hugo hakkında sorularınız olursa yorumlarda paylaşabilirsiniz.