NovaGreet API: Kendi Discord Welcome Motorumu Nasıl Kodladım?

Temmuz 29, 2026Yazar: Ali Semi
NovaGreet API: Kendi Discord Welcome Motorumu Nasıl Kodladım?

Sadece sıradan bir mesaj atan botlar yerine; her sunucu sahibinin kendi tarzını yansıtabileceği, %100 özelleştirilebilir ve sıfır gecikmeyle çalışan bir görsel motoru kurmak istedim. Bu yazıda, Syntra Games çatısı altında NovaGreet API'yi inşa ederken yaşadığım krizleri, SVG hüsranlarını ve bulduğum çözümleri tüm şeffaflığıyla paylaşıyorum.

1. Yol Haritası & Mimari Kurulum

Faz 1

Çekirdek Motor Seçimi ve SVG Hüsranı

Geliştirme sürecinin en sancılı kısmı Discord'un yapısını anlamaktı. İlk başta sistemi HTML <img> etiketleri için çok hızlı olan SVG formatında kurguladım. Ancak Discord'un SVG formatını embed (önizleme) olarak desteklemediğini acı bir şekilde fark ettim. Sistemi baştan kurgulayıp, doğrudan saf PNG çıktısı veren PHP GD kütüphanesi mimarisine geçiş yaparak çekirdek motoru kurtardım.

PHP GD Engine Image Generation Dynamic Canvas
Faz 2

Geliştirici Paneli (Dashboard) İnşası

Sistemi sadece bir URL'ye hapsetmek en büyük hatam olurdu. İnsanların kolayca görsel tasarlayabilmesi için bir arayüze ihtiyaç vardı. İlk tasarımım yüzlerce kutucuğun üst üste bindiği karmaşık bir yapıydı. Sonrasında akıllı akordeon menüler ve "Discord RAW URL" formatlayıcı içeren profesyonel, Vercel sadeliğinde bir kontrol paneli tasarladım.

Vanilla JS CSS Grid/Flex Responsive UI

2. Geliştirme Günlükleri (Kritik Hatalar)

Her şey her zaman yolunda gitmez. İşte arka planda kod yazarken saç baş yolduran o anlar ve çözümlerim:

[ÇÖZÜLDÜ] BUG-014: Çoklu Dil ve Font Çöküntüsü

Bozuk Karakterler ve Tofu Hatası

Farklı ülkelerden kullanıcıların Japonca veya Arapça isimleri API'ye girdiğinde karakterler bozuk kutucuklar (tofu) olarak çıkıyordu. Çözüm: Sistemi standart fontlardan arındırıp, Google'ın devasa Noto (No Tofu) font ailesini sunucuya entegre ederek global dil desteğini sağladım.

[ÇÖZÜLDÜ] BUG-027: URL Formatlaması ve Mobil Taşma

Discord Değişkenlerinin Bozulması

Bot değişkenlerini ({user.username}) URL'ye eklerken tarayıcı bunları URL formatına (%7B...) çeviriyor ve oluşan devasa link mobil arayüzü yana kaydırarak patlatıyordu. Çözüm: Arayüzde RegExp kullanarak linkleri tekrar RAW formata çevirdim ve URL kutusuna yatay scrollbar (kaydırma çubuğu) ekleyerek taşmayı engelledim.

💡

Geliştiricilere Altın Tavsiyeler

  • Her Formata Güvenmeyin: Web projelerinde harika çalışan bir yapı (örneğin SVG), Discord veya sosyal medya (Open Graph) önizlemelerinde çalışmayabilir. Hedef platformun kurallarına (PNG/JPEG zorunluluğu) göre motorunuzu tasarlayın.
  • Geliştirici Deneyimi (DX) Önemlidir: Kodlarınız ve API'niz harika olabilir ama arayüzünüz karmaşıksa kimse kullanmaz. Kutucukları akordeon menülerle gizleyerek ve "Hızlı Kopyala" butonları ekleyerek deneyimi pürüzsüzleştirin.
  • Uzun Metinleri Hesaba Katın: Kullanıcılar sınırları zorlar. Sunucuya katılan kişinin ismi 30 karakter olduğunda tasarımınızın patlamaması için sisteme kesinlikle bir Auto-Shrink (Akıllı Metin Küçültme) algoritması yazın.
#post-title
Ali Semi

Ali Semi

Ön-yüz geliştiricisi, oyun tasarımcısı ve Syntra Games ekibinin bir parçası. Modern teknolojiler kullanarak yeni nesil dijital deneyimler tasarlıyor.