Bubble, kod yazmadan web uygulamaları geliştirmenize olanak tanıyan güçlü bir no-code platformudur. Ancak uygulamanızı dış hizmetlerle buluşturmak için API entegrasyonu yapmanız gerekebilir. Bubble'ın API Connector eklentisi sayesinde REST ve OAuth2 tabanlı API'leri dakikalar içinde bağlayabilirsiniz. Peki hangi adımları izlemeli ve hangi hatalardan kaçınmalısınız? İşte size sağlam bir API entegrasyonu için pratik ipuçları ve kontrol listesi.
API Bağlantısı Kurmadan Önce Hazırlık
- Dokümantasyonu inceleyin: Entegre edeceğiniz API'nin dokümantasyonunu baştan sona okuyun. Hangi endpoint'lerin mevcut olduğunu, hangi authentication yöntemini kullandığını (API key, Bearer token, OAuth2) ve rate limitleri not alın.
- Test ortamı kullanın: Mümkünse API'nin sandbox veya test ortamını kullanarak bağlantıyı deneyin. Canlı ortamda yanlış çağrı yapmak hesabınıza veya verilerinize zarar verebilir.
- Güvenlik önlemlerini alın: API anahtarınızı asla uygulama mantığına gömülü olarak saklamayın. Bubble'da API anahtarlarını Privacy & Security ayarlarından şifreli değişkenler (encrypted constants) olarak tanımlayın.
API Connector Eklentisini Yapılandırma
Bubble'da API entegrasyonu çoğunlukla API Connector eklentisi ile yapılır. Eklentiyi yükledikten sonra aşağıdaki adımları uygulayın:
- Yeni bir API ekleyin: Eklenti sayfasında "Add another API" butonuna tıklayıp API'nize bir isim verin.
- Authentication yöntemini seçin: API'niz API key kullanıyorsa Header veya Query Param olarak gönderebilirsiniz. OAuth2 kullanıyorsa Client ID ve Secret bilgilerini girip yetkilendirme akışını tamamlayın.
- Endpoint'leri tanımlayın: Her bir API çağrısı için ayrı bir endpoint oluşturun. GET, POST, PUT, DELETE gibi HTTP metodlarını doğru seçin. Gerekli parametreleri (path, query, body) ekleyin.
- Test çağrısı yapın: Oluşturduğunuz endpoint'in yanındaki "Initialize call" butonuna tıklayarak test edin. Başarılı bir yanıt alıyorsanız veri yapısını (response structure) tanımlayın.
Veri Dönüşümü ve Hata Yönetimi
Veri Dönüşümü
API'den gelen veriler genellikle JSON formatındadır. Bubble'da bu verileri işlemek için Do Search veya Schedule API Workflow kullanabilirsiniz. Dikkat etmeniz gereken noktalar:
- Veri türlerini kontrol edin: Bubble'da string, number, date gibi veri türleri mevcuttur. API'den gelen değerleri doğru türe dönüştürün (örneğin, tarih alanını "date" formatına çevirin).
- Nested (iç içe) verileri işleyin: API yanıtında birden fazla seviye varsa, her bir seviye için ayrı bir alan oluşturmak yerine Bubble'ın "get data from API" bloğuyla doğrudan erişin.
- Sayfalama (pagination) yapın: Çok sayıda kayıt içeren API'lerde sayfalama mekanizması kullanın. Bubble'da "Loop" işlemi ile tüm sayfaları çekebilir veya kullanıcıya lazy loading sunabilirsiniz.
Hata Yönetimi
API çağrıları her zaman başarılı olmayabilir. Aşağıdaki hata türlerine karşı hazırlıklı olun:
| Hata Kodu | Anlamı | Çözüm Önerisi |
|---|---|---|
| 400 | Geçersiz istek (Invalid request) | Parametreleri ve veri formatını kontrol edin. |
| 401 | Yetkilendirme hatası | API anahtarınızın doğru olduğundan emin olun. Süresi dolmuş olabilir. |
| 429 | Rate limit aşıldı | İstek sıklığını azaltın. Bubble'da "Wait" işlemi veya zamanlayıcı kullanabilirsiniz. |
| 500 | Sunucu hatası | API sağlayıcısının durumunu kontrol edin. Bir süre sonra tekrar deneyin. |
- Hata durumunda kullanıcıyı bilgilendirin: Bubble workflow'unda "On error" dalı oluşturarak kullanıcıya dostça bir mesaj gösterin. Örneğin: "Üzgünüz, veriler şu anda alınamadı. Lütfen daha sonra tekrar deneyin."
- Log kaydı tutun: Hata detaylarını Bubble'ın veritabanına (database) kaydederek ileride analiz yapabilirsiniz.
Performans İpuçları
- Cache kullanın: Sık değişmeyen verileri Bubble'ın Cache işleviyle hafızada tutun. Bu, API çağrı sayısını azaltır ve uygulamanızı hızlandırır.
- İstekleri gruplayın: Aynı API'ye birden fazla istek atmanız gerekiyorsa, bunları tek bir çağrıda birleştirebilir misiniz kontrol edin. Bazı API'lerde "batch" endpoint'i bulunur.
- WS (WebSocket) kullanın: Gerçek zamanlı veri akışı gerekiyorsa, REST yerine WebSocket bağlantısı kullanmayı düşünün. Bubble'da WS desteği sınırlıdır, ancak üçüncü parti servislerle entegre edilebilir.
Yaygın Hatalar ve Kaçınılması Gerekenler
- API anahtarını herkese açık alanlarda saklamak: Şifrelenmemiş API anahtarları güvenlik riski oluşturur. Her zaman encrypted constant kullanın.
- Yanıt yapısını manuel olarak tanımlamamak: Bubble, API çağrısından sonra yanıt yapısını otomatik algılamaz. "Initialize call" sonrası "Create structure from call” seçeneğini kullanarak veri türlerini otomatik doldurun.
- Rate limitleri dikkate almamak: Çok hızlı çağrı yaparsanız API geçici olarak engellenebilir. İstekler arasına en az 1 saniye koyun veya Queue mekanizması kurun.
- Test yapmadan canlıya geçmek: Her yeni endpoint eklediğinizde, farklı senaryolarla test edin. Örneğin, hatalı veri göndererek beklenen hata mesajını alıp almadığınızı kontrol edin.
Kontrol Listesi
- API dokümantasyonu okundu mu?
- Test ortamı belirlendi mi?
- API anahtarı şifrelenmiş değişkene eklendi mi?
- Her endpoint için doğru HTTP metodu seçildi mi?
- Initialize call ile yanıt yapısı alındı mı?
- Hata yönetimi workflow'a eklendi mi?
- Rate limit kontrolü yapıldı mı?
- Cache mekanizması kuruldu mu?
- Kullanıcıya hata mesajları gösterilecek mi?
Bu maddelerin her birini uyguladığınızda Bubble üzerinde sağlam bir API entegrasyonu kurmuş olacaksınız. Unutmayın, no-code araçlarıyla bile karmaşık entegrasyonlar mümkün; yeter ki doğru adımları takip edin. Eğer Webflow ile landing page tasarımı gibi başka no-code projeler de yapıyorsanız, API entegrasyonu bu sayfaları canlı verilerle beslemenin harika bir yolu. Ayrıca, daha karmaşık otomasyonlar için n8n vs Make karşılaştırmamıza göz atarak size en uygun aracı seçebilirsiniz.
Sık Sorulan Sorular
Bubble hangi API türlerini destekler?
Bubble, REST API'leri ve OAuth2 tabanlı API'leri destekler. API Connector eklentisi sayesinde JSON, XML ve form-encoded veri formatlarını işleyebilirsiniz. Ayrıca, WebSocket bağlantıları da üçüncü parti eklentilerle mümkündür.
API anahtarını Bubble'da güvenli bir şekilde nasıl saklarım?
API anahtarlarınızı Bubble'ın 'Privacy & Security' ayarlarından 'Encrypted Constants' olarak tanımlayın. Bu sayede anahtarlar şifrelenir ve uygulama kodunda görünmez. Asla düz metin olarak workflow'larda veya veritabanında saklamayın.
Bubble'da API çağrı süresini nasıl optimize ederim?
Cache kullanarak sık yapılan çağrıları azaltın. İstekleri gruplayın ve gereksiz çağrılardan kaçının. Ayrıca, Bubble'da 'Schedule API Workflow' ile çağrıları arka planda zamanlayarak kullanıcı deneyimini iyileştirebilirsiniz.
API bağlantısı sırasında karşılaşılan '401 Unauthorized' hatası nasıl çözülür?
Bu hata genellikle API anahtarının yanlış girilmesi veya süresinin dolmasından kaynaklanır. API anahtarınızı kontrol edin, eğer OAuth2 kullanıyorsanız token'ı yenileyin. Bubble'da 'Initialize call' sırasında doğru authentication yöntemini seçtiğinizden emin olun.
Bubble'da API'den gelen verileri nasıl sayfalara ayırabilirim?
API'nin desteklediği sayfalama parametrelerini (limit, offset, page) kullanarak Bubble workflow'unda döngü oluşturun. 'Schedule API Workflow' ile arka planda tüm sayfaları çekebilir veya kullanıcının sayfa sonuna gelmesiyle yeni veri yükleyen bir 'Load more' butonu ekleyebilirsiniz.






