Özet: Bu rehberde, apibir'in öngörülebilir JSON şeması ve OpenAPI dokümanını yapay zeka asistanlarına vererek sıfırdan canlı bir piyasa takip panosu (HTML + Chart.js) oluşturmanın adımlarını inceliyoruz.
Neden Yapay Zeka ile Finans Panosu Yapmak Kolaylaştı?
Geleneksel borsa ve finans veri kaynakları karmaşık OAuth mekanizmaları, tutarsız XML/CSV çıktıları ve belirsiz alan isimleri nedeniyle yapay zeka modellerini zorlar. Modele rastgele bir API dokümanı verdiğinizde hatalı endpoint uydurma (hallucination) riski yüksektir.
apibir ise tüm uç noktalarda tutarlı bir zarf kullanır:
success: İşlemin başarı durumu (boolean)data: İstenen veri seti (dizi veya nesne)creditsRemaining: Kalan aylık kredi tutarınız
İdeal Prompt Yapısı
Claude 3.5 Sonnet veya ChatGPT-4o gibi gelişmiş bir modele aşağıdaki prompt şablonunu ileterek tam teşekküllü bir gösterge paneli oluşturabilirsiniz:
apibir REST API'sini kullanarak tek dosyalık bir HTML dashboard yaz.
Temel adres: https://api.apibir.com/v1
Kimlik doğrulama: Authorization: apikey <ANAHTAR> (backend proxy ucu: /api/apibir)
Kullanılacak uçlar:
- /fx/latest?symbols=USD,EUR,GAU → kur kartları
- /indices?codes=XU100 → BIST 100 kartı
- /fuel/prices?city=istanbul → akaryakıt fiyatı
- /fx/timeseries?start=..&end=.. → 30 günlük çizgi grafik
İstekler:
1. Chart.js CDN kullan.
2. Üstte özet kartlar, altta çizgi grafik olsun.
3. 60 saniyede bir otomatik veriyi yenile.
4. Türkçe sayı biçimlendirmesi (toLocaleString('tr-TR')) kullan.
Çıktı: Sadece tek bir index.html dosyası ver.
Güvenli Backend Proxy Mimarisi
Yapay zeka asistanının ürettiği HTML kodunu doğrudan istemcide çalıştırırken gizli API anahtarınızı tarayıcıya gömmemelisiniz. Bunun yerine Next.js veya Express tarafında 20 satırlık basit bir proxy uç noktası tanımlamalısınız:
export async function GET(request, { params }) {
const yol = "/" + params.path.join("/");
const url = new URL("https://api.apibir.com/v1" + yol);
new URL(request.url).searchParams.forEach((v, k) => url.searchParams.set(k, v));
const upstream = await fetch(url, {
headers: { Authorization: `apikey ${process.env.APIBIR_KEY}` },
next: { revalidate: 30 } // 30 sn önbellek ile kredi tasarrufu
});
return new Response(await upstream.text(), {
status: upstream.status,
headers: { "Content-Type": "application/json" }
});
}
Sonuç ve Sonraki Adımlar
Bu yöntemle şirket içi finans ekranlarınızı, yatırım takibinizi veya müşteri panolarınızı birkaç dakikada yayına alabilirsiniz. Daha fazla prompt şablonu ve canlı uygulama örnekleri için AI & Dashboard Rehberi sayfamızı inceleyebilirsiniz.