- Mevcut yorum sistemleri (Disqus, kendi barındırma, GitHub Issues vb.) hız, izleme, bakım yükü ve kullanıcı kısıtlamaları gibi sorunlar nedeniyle tercih edilmiyor
- Bluesky, altyapı bakımı gerektirmemesi, zengin içerik desteği, gerçek ad tabanlı hesaplar, platformlar arası sohbet sağlayabildiği için blog yorumları için uygun
- Uygulama modeli, blog yazısını yayınla → Bluesky'ye paylaş → AT URI'yi blog yazısı meta verisine ekle → ilgili yazının yorum dizisini çekip göster şeklinde
- Bileşenler, tüm yorumların gösterimi, tekil yorum + alt yorum gösterimi ve görsel/link gibi gömülü içeriklerin işlenmesi olmak üzere 3 parçaya ayrılıyor
- Özyinelemeli yöntemle en fazla 5 seviyeli alt yorum gösterimi, görsel ızgara ve modal, bağlantı kartı, desteklenmeyen gömülü içerikler için yedek metin işleme yapılıyor
- Astro + React entegrasyonu ile
client:load kullanarak istemcide yükleme, frontmatter'a DID ve postCid eklenerek etkinleştirme
- Tip güvenliği için
@atcute/client TypeScript tipleri kullanılarak, JavaScript devre dışı olsa bile içeriğin normal şekilde görülebileceği progressive enhancement yapısı kuruldu
- Sunucu/DB olmadan Bluesky API ve CDN kullanarak performans korunuyor
- Bu yaklaşım, sosyal özellikleri her site için yeniden inşa etmek yerine, kullanıcıların zaten kullandığı platformlarla bağlanarak ölçeklenebilirlik ve bağımsızlık sağlıyor
Bluesky'yi yorum sistemi olarak seçme nedeni
- Altyapı bakımı gerekmiyor
- Görsel, bağlantı, alıntı yazısı gibi zengin içerik desteği
- Bluesky hesap tabanlı güven ve sorumluluk
- Blog ile sosyal medya arasında trafik çapraz akışı mümkün
- İçerik sahipliğinin ayrılması (blog yazısı sana ait, yorumlar yazarın)
AT Protokolünü anlama
- DID: Merkeziyetsiz kullanıcı tanımlayıcısı
- CID: İçerik tanımlayıcısı
- AT URI:
at://did:.../app.bsky.feed.post/... biçimli adres
getPostThread API çağrısıyla yorum dizisi getirilebilir, kimlik doğrulaması gerekmez
Bileşen yapısı
- Ana yorum bileşeni
- Tekil yorum + alt yorumları render eden bileşen
- Görsel, bağlantı gibi gömülü içerikleri işleyen bileşen
İç içe yorum işleme
- Özyinelemeli render, en fazla 5 katman derinlik sınırı
- Görsel girintilerle hiyerarşinin gösterimi
Zengin içerik işleme
- Görsel: CDN tarafından sağlanan, çoklu görsel ızgara ve modal görünüm
- Dış bağlantı: Küçük görsel ve açıklama içeren kart renderlama
- Diğer gömüler: Yedek metin gösterimi
Astro entegrasyonu
- React bileşeni +
client:load kullanımı
- frontmatter'a Bluesky DID ve postCid eklenerek yorumların etkinleştirilmesi
Geliştirme deneyimi
- TypeScript tip desteği ile güvenilirlik artışı
- Progressive Enhancement ile API arızasında bile içeriğin etkilenmemesi
- Sunucu/DB yükü olmadan Bluesky altyapısının kullanılması
Sonuç
- Mevcut yorum sistemlerinin sorunlarını atlayıp, kullanıcıların zaten kullandığı platformlarla bağlanmak
- Bluesky'nin büyümesiyle katılımcı sayısının artması mümkün
- ATProto tabanlı olduğu için diğer AppView'lara veya kendi implementasyonunuza geçmek de kolay
Henüz yorum yok.