6 puan yazan GN⁺ 2025-05-04 | 5 yorum | WhatsApp'ta paylaş
  • Kişisel blogu mevcut sahip olunan alan adı üzerinde statik sayfalar olarak kurmayı; içerik ekleme ve temel SEO gereksinimlerini birlikte karşılayan asgari bir uygulamayı hedefliyor
  • Uygulama; küçük bir template.html, markdown2, O1'den istenerek oluşturulan render.py ve Markdown yazı yazma ile basitçe ilerliyor
  • Şablon, system-ui, azami genişlik 70ch, color-scheme: light dark, viewport, UTF-8 gibi yalnızca temel HTML/CSS kullanıyor
  • render.py, ./posts/{post}/eng.md dosyasını HTML'ye dönüştürüyor, görsel yollarını ayarlıyor ve ardından ./blog/{post}.html ile index.html dosyalarını oluşturuyor
  • Jekyll, Ghost, WordPress olmadan da yalnızca statik render alma ve barındırma ile işletilebilir bir blog oluşturulabileceğini gösteriyor

Minimum blog gereksinimleri ve gerçek yapılandırma

  • Başlangıç noktası dört gereksinimdi
    • Zaten sahip olunan alan adını kullanmak
    • Modern web standartlarını izlemek ve makul bir SEO'ya sahip olmak
    • Yeni içerik eklemeyi çok kolay hale getirmek
    • Tüm sayfaların statik olarak build edilmesi
  • Gerçek uygulama akışı basit
    • Küçük bir template.html yazmak
    • pip install markdown2 çalıştırmak
    • O1'den render.py betiği istemek
    • Yazıyı yazdıktan sonra render edip barındırmak
  • Jekyll, Ghost, WordPress gibi mevcut blog motorları kullanılmıyor

Şablon ve render betiği

  • template.html, temel HTML belge yapısını ve minimum CSS'i içeriyor
    • color-scheme: light dark ile açık/koyu renk düzenini belirtiyor
    • Gövde stili system-ui, sans-serif, azami genişlik 70ch, satır yüksekliği 1.5, yazı boyutu 1.25em olarak ayarlanıyor
    • id="head-link" eklenmiş ana sayfa bağlantısı ve {{ content }} yer tutucusu kullanılıyor
  • render.py, markdown2 ile Markdown yazılarını HTML'ye dönüştürüyor
    • Girdi dizini ./posts, çıktı dizini ./blog
    • Her yazı ./posts/{post_directory}/eng.md konumundan okunuyor
    • İlk # başlığı yazı başlığı olarak kullanılıyor
    • Markdown, fenced-code-blocks, header-ids seçenekleriyle dönüştürülüyor
    • Görsel yollarındaki <img src=", /posts/{post_code}/ temel alınacak şekilde değiştiriliyor
    • Şablondaki {{ content }} dönüştürülmüş HTML ile değiştiriliyor ve başlık dizesi de yazı başlığıyla değiştiriliyor
  • Dizin sayfası da aynı betik içinde oluşturuluyor
    • Önce greetings.md HTML'ye dönüştürülüyor
    • Her yazının başlığı okunup /blog/{post_code}.html bağlantı listesine ekleniyor
    • Nihai sonuç index.html olarak kaydediliyor
  • Yazı 2025-03-31 tarihinde elle yazılmıştır

5 yorum

 
ifmkl 2025-05-07

Ben de şu anda blogumu tam olarak yukarıdaki gibi işletiyorum. Kişisel gereksinimlerimi karşılayan bir SSG oluşturup kullanıyorum. Yani küçük görsel, kategori ve etiket özelliklerinden yararlanmak için ayrı ayrı özel işlevler ekledim. Eklediğim görselleri otomatik olarak webp'ye dönüştürüp ona göre referans veriyorum ve bu sayede render hızı beni fazlasıyla memnun ediyor.

 
winterjung 2025-05-07

Aa, bu tür özel işlevleri doğrudan kod yazarak mı ekliyorsunuz? Ben de hep DIY yapmaya niyetleniyorum ama daha önce kullandığım SSG blog framework'lerinin sunduğu genişletme ve eklenti özellikleri yüzünden tereddütte kalıyorum.

 
ifmkl 2025-05-07

Açgözlülüğü bırakıp sadece o kısmı çıkardığınızda gerisi aslında çok da zor değil. ssg de yapay zekadan isterseniz tüm kodu yazıyor; özellik eklemesini söylerseniz aslında hepsini ekliyor haha

 
ndrgrd 2025-05-04

Sadece güzel bir font seçince okunur hâle geliyor.

 
GN⁺ 2025-05-04
Hacker News yorumları
  • Bu blog yazısındaki grafik aklıma geldi: https://molodtsov.me/2023/02/how-to-start-your-blog-in-2023/
    Statik site oluşturucu (SSG) bataklığına düşünce, aslında yazmak istediğim yazılar ya da yapmak istediğim işler yerine zamanımın çoğunu SSG'nin kendisi hakkında yazıp onu kurcalamakla geçiriyordum.
    Sonunda SSG'yi bırakıp WordPress kurdum ve kafamdan sildim; büyük bir özgürleşme hissiydi.
    Amaç kurcalamak ve o süreci yazmaksa sorun değil; kurcalamanın yazmayı engellemediği kişiler için de sorun yok, ama ben öyle değildim.
    Yazmaya niyetlendiğiniz anda ihtiyaç duyacağınız son şey, ertelemek için bir bahanedir.

    • 2025'te WordPress, iki tehlikeli özelliği bir arada taşıyor.
      WordPress ve tüm eklentiler güncel tutulmazsa ele geçirilebilir; BDFL ise önemsiz kişisel gerekçelerle güvenlik güncellemelerinin iletilmesini ya da alınmasına erişimi engelleyebilecek biri.
      Statik sitelerde yamanması gereken güvenlik açığı olmadığından, bir SSG projesi yöneticinin sorunları yüzünden tamamen çökerse bile çok fark etmez; ama WordPress'te bu çok önemli hale gelir.
    • Bende de benzerdi. Uzun zaman önce DokuWiki ile başlamıştım, sonra GitHub Pages'i denemeye karar verdim; her şeyi taşıdıktan sonra aramaya ihtiyaç duyunca özel Google araması ekledim.
      Ziyaretçilerin yorum bırakabileceği bir yol gerektiği için Disqus ekledim ve sonunda çeşitli servislerle bolca JavaScript'in karıştığı bir yamalı bohçaya dönüştü.
      Birkaç yıl önce verilerime yeniden doğrudan sahip olmak ve dış servislere bağımlı olmamak için Disqus yorumlarını dışa aktardım; Serendipity ile uğraştıktan sonra WordPress'te karar kıldım.
      Yorumları ve Markdown sayfalarını içe aktarabiliyordum; her şeyi Fediverse'e yayımlayan bir eklenti de vardı.
      SQLite ile çalışır hale getirip otomatik güncellemeleri açınca fiilen bakım gerektirmez oldu.
    • Blog spam'i mi? :) URL şu: https://rakhim.org/honestly-undefined/19/
    • Katılıyorum ama vakaların %95'inde WordPress'in gereğinden fazla olduğunu düşünüyorum.
      Büyük olasılıkla ihtiyaç duyulmayacak özellikler yüzünden çok fazla bakım gerektiriyor. Güncel tutmazsanız bir botnet'in parçası haline gelebilirsiniz.
      Çoğu blog için statik site oluşturucu yeterli; bakım gerekse bile bunu istediğim zamanda yapabilirim.
    • nikola'dan oldukça memnunum: https://getnikola.com/
      Gerçekten istediğim şey, yayımlamak için tek bir komut ve yazılara görselleri kolayca sürükleyip bırakmanın bir yoluydu; ilki iyi çalışıyor, ikincisi de Jupyter Notebook yayımlama özelliğiyle mümkün.
      Kesinlikle istemediğim şey, “HTML'i istemciye göndermek” için veritabanı gibi bir yükün ortaya çıkmasıydı.
  • Güzel, ama buna blog diyebilmek için iki küçük özelliğin daha gerektiğini düşünüyorum.
    Birincisi, yazıları tarihe göre sıralayıp en yenileri önce göstermek ve tarihi bir yerde belirtmek gerekir. Minimal yapıyı korumak için yazı dosyasının meta verileri, örneğin oluşturulma zamanı kullanılabilir.
    İkincisi, elbette bir RSS feed'i gerekir. Mevcut betik ve minimal bir RSS şablonuyla, yalnızca bağlantı ve başlık içeren basit bir feed kolayca yapılabilir gibi görünüyor.

    • RSS iyi bir şey, ama blog olarak kabul edilmek için zorunlu koşul olmamalı bence.
      “Takip edilmek” her zaman iyi değildir ve okura göre şekillenme baskısı yaratabilir. Sosyal medyayı kötü yapan şey tam da budur.
    • Mantıklı.
      1 numarada, TOML gibi bir formatta meta veri içeren bir dosyayı otomatik üretme yönüne eğilimliyim.
      2 numara RSS'i kesinlikle ekleyeceğim, ama 1 numaraya bağlı :-)
  • Bağımsız web sitelerini her zaman sevmişimdir; benim web sitem de yaklaşık 25 yıl önce benzer şekilde başladı.
    O zamanlar bildiğim uygun tek teknoloji Classic ASP olduğu için, en minimal kurulumla basitçe yalnızca ASP ile yapmıştım.
    Şimdi Common Lisp ile statik olarak üretilen bir site olarak çalışıyor ve bu düzenin uzun vadeli kurulum olacağını düşünüyorum: https://github.com/susam/susam.net/blob/main/site.lisp
    Basit bir sayfa demetiyle başlamak, minimum uygulanabilir bir web sitesi yapmanın iyi bir yoluydu; ama zamanla RSS feed’i, tarihe göre blog listesi, etikete göre dizin, araçlar·oyunlar·demolar gibi blog dışı içerik desteği ve üçüncü taraf olmadan yorumlar gibi özelliklere ihtiyaç doğdu.
    Gereksinimler arttıkça kaynak da büyüdü; birkaç yüz satırlık kod artık yaklaşık 1300 satır Common Lisp oldu.
    Yine de tüm kodu tek seferde zihnimde tutabileceğim, bir hata çıkarsa 10 dakika içinde akıl yürütüp düzeltebileceğim bir seviyede tutmak istiyorum.
    Bu aralar sevdiğim blog yazarlarının yazı listelerini sunan bir blogroll ekleme isteğine kapılıyorum. Feed okuyucunun yerini bile alabilir; ama e-postaları da okuyan bir şeye dönüşmemesine dikkat etmeye çalışıyorum.

    • Neredeyse aynı yoldan geçtim.
      Kaynak kod burada: https://github.com/brilee/modern-descartes-v2/blob/master/ma...
      RSS feed’i, tarihe göre blog listesi, etiketleme sistemi ve dosya izlemeli yeniden derleme yapan yerel geliştirme sunucusu içeriyor.
    • Benim izlediğim yol da benzerdi; hatta aslında bunu birkaç kez tekrarladım.
      Güncel sürüm 1000 satırın altında bir Python betiği olarak tutuluyor: https://github.com/llimllib/obsidian_notes/blob/c93b9b5c46fe...
    • Tam olarak bu. “Bu aracı yapmak istiyorum” deyip onu kendin kodlayabilme yeteneği, herhangi bir WYSIWYG’den daha iyi.
      Yazı koleksiyonları, dizinler, slayt gösterileri gibi türetilmiş sayfalar yaptım; insanlar ve video oyunları için etiket varyasyonları da oluşturdum.
      Küçük resim galerisi ya da alıntı kutusu gibi genel widget’ların görünüm ve hissi üzerinde de tamamen kontrol sahibi olabiliyorsun.
    • Lamb’e Flock özelliğini yaptım; feed’leri bloguma sendikasyonla aktaran bir özellik. Bunu çoğunlukla çok kullanıcılı yaklaşıma bir alternatif olarak yaptım: https://github.com/svandragt/lamb
      Üst düzey bir referans olarak işe yarayabilir.
    • RSS ve tarih kesinlikle gerekli olacak gibi.
      İleride shader’lar ve web oyunları da gömmek isteyebilirim; umarım karmaşıklık fazla büyümez.
  • Tarayıcıların text/markdown ve text/gemini’yi yerel olarak desteklemesi güzel olurdu.
    Tarayıcı PDF render edebiliyorsa, Markdown/Gemini içerikleri için basit bir biçimlendirici ve kullanıcının belirleyebileceği bir stil sayfası eklemek o kadar zor görünmüyor.
    Şu anda da text/plain blog yazılabilir, ama gerçek hiper metin olmadığı için SEO’da dezavantaj yaratıyor. Belki link header ile bir tür sihir yapılabilir.
    Başka biçimleri desteklemek, temiz yayın yapmanın eşiğini düşürür ve kontrolü kullanıcıya geri verir.

    • Tarayıcıda yerel Markdown render etme ne yazık ki pek olası görünmüyor.
      Önce tarayıcıların hangi Markdown varyantı ve uzantılarını kullanacakları konusunda anlaşması gerekir. Markdown neredeyse metin biçimleri dünyasının CSV’si gibi; herkes kendi yöntemince kullanıyor.
      Fazla minimal tutulursa işe yaramaz diye şikâyet gelir; uzantılar seçilirse de şişkin diye şikâyet gelir.
      Kısa ve uzun vadeli artılar/eksiler üzerine dikkatli tartışmaya çalışsan bile “mükemmelin iyinin düşmanı olmasına izin verme” sözüyle önün kesilebilir.
      Belirli bir özellik kümesinde uzlaşılsa bile, bunun gerçekten o kadar değerli olup olmadığı da şüpheli.
      PDF’leri tarayıcıda doğrudan okumak yeterince yaygın bir şey; ama Markdown’ı doğrudan okumanın faydası muhtemelen dünyadaki yazılım geliştiricilerin bir kısmına ve beş kadar tuhaf insana gider.
      Bu yüzden yaşadığım sürece tarayıcıda yerel Markdown render etme görmezsem şaşırmam.
    • Tarayıcının PDF render etmesi JavaScript ile yapılıyordu; ya da en azından bir zamanlar öyleydi.
      Tarayıcıda yerel destekten daha yeni bir sürüm gerektiğinde kullanılabilecek XSLT kütüphaneleri de var; jpegxl gibi çeşitli formatlar için kütüphaneler de var.
    • Gemini’nin de kendi formatı mı var?
  • html_content = html_content.replace('Minimum viable blog', title) ise, yazıda Minimum viable blog dizesi her geçtiğinde mevcut yazının başlığıyla mı değişiyor? Bu bir bug değil mi?

    • Evet, iyi yakaladın.
      Yazıdaki kod O1’in hazırladığı ilk taslaktı ve bu dize {{ title }} ile değiştirildi.
  • Yaklaşık 15 yıldır minimal blog denemeleri yapıyorum ve öğrendiğim birkaç püf noktası var.
    const title = lines.match(/# (.+)/)[1] kadarı bile yeterli olduğundan frontmatter’dan kaçınılabilir.
    Bloglarımda yazı sayısı hiç sayfalama, etiket, kategori ya da sıralama gerektirecek kadar artmadı.
    JSX, https://immaculata.dev/guides/enabling-jsx.html gibi şüpheli hack’lerle saf sunucu tarafı string builder olarak epey iyi çalışıyor.
    Artık GitHub Pages’te de https://immaculata.dev/guides/using-gh-pages.html gibi şeylerle Jekyll yerine keyfi build adımı kullanmak kolaylaştı.
    highlight.js, HTML’e yalnızca üç satır ekleyerek kullanılabilen çok kolay kod sözdizimi renklendirmenin kralına yakın; shiki ise havalı ama yavaş.

  • Hugo/Zola + Cloudflare Pages gibi standart statik blog framework’leri kullanırsanız iş kolay
    Benim blogum da 100KB’ın altında minimal bir kurulum ve asıl yazının yazarının sıraladığı tüm ölçütleri karşılıyor
    Hugo Blog Awesome temasını kullanıyorum, 512kb kılavuzunu izleyip sayfa boyutunu kontrol ettim, görselleri ve gereksiz JS’i kaldırdım. Zaten baştan çok fazla yoktu
    Referans: https://512kb.club, https://radar.cloudflare.com/scan

  • Bir süre “MVB” işlettim; benimki daha da basitti
    Sadece tek bir HTML sayfası koyuyor, yazıları .txt dosyaları olarak yazıyor ve ana sayfayı elle güncelliyordum
    Epey uzun uzadıya bir işti ama yine de modern web ile uğraşmaktan daha kolay olduğunu düşünüyorum
    Sonra daha gelişmiş bir yöne geçtim; şimdi kişisel sitem ve blogum için Astro kullanıyorum ve gerçekten harika
    Astro, landing page’inde “içerik odaklı siteler” için en iyi platform olduğunu iddia ediyor; 6 ay kullandıktan sonra buna katılır oldum
    Blog oluşturmak için gereken neredeyse her konuda açık ve takip etmesi kolay teamüller sunuyor, gereksiz kısımları ayıklıyor

    • Astro gerçekten müthiş. Neden daha popüler değil bilmiyorum
    • Başkasının temasını mı kullandığını, yoksa kendin mi yaptığını merak ediyorum
  • Bazı sitelerde Bun JS ve JavaScript string’leri içindeki HTML’i kullanma yöntemini denedim
    Bun’da değişiklik olduğunda statik HTML’i yeniden üreten bir —hot bayrağı var
    IntelliJ IDE, string’in üstündeki // language=html yorumunu algılayıp içerideki HTML’i formatlıyor ve sözdizimi vurgulaması da yapıyor
    Template dili yerine saf JavaScript fonksiyonları kullanınca, template dilinde nasıl yapılacağını aramak zorunda kalmadan ihtiyaç duyduğunuz mantığı doğrudan yazabiliyorsunuz

  • Aşırı şişkin olduğu için yüklenmesi uzun süren web sitelerinden bıktığım için, kendi blogumda da buna çok benzer bir yaklaşım kullanıyorum: https://blog.borrego.dev
    Kaynak: https://github.com/agubelu/blog

    • Çok hoşuma gitti ve güzel görünüyor. Mobilde nasıl görünüyor?