Yapay Zeka Görsel Üretici Projesi

Bu projede, Hugging Face API'sini kullanarak kullanıcıların prompt'lara göre görsel üretebildiği yapay zeka tabanlı bir web sitesi tasarladım. Üretilen görseller /feed sayfasında listeleniyor ve kullanıcılar burada başkalarının oluşturduğu görselleri de inceleyebiliyor. Bir görsele tıklandığında açılan modal üzerinden görseli indirmek ya da favorilere eklemek mümkün. Görsellerin daha verimli yüklenmesi için Next.js'in varsayılan image loader'ı yerine Supabase'in image loader'ını kullandım.

Öne Çıkan Özellikler 🌟

• Prompt ile Görsel Üretimi: Kullanıcılar bir prompt girerek yapay zeka ile kendilerine özgü görseller oluşturabiliyor.
• Gerçek Zamanlı Bildirimler: Herhangi bir kullanıcı yeni bir görsel oluşturduğunda, aktif tüm kullanıcılara anında bildirim gidiyor.
• GitHub ile Giriş: Farklı bir yaklaşım denemek için klasik giriş yöntemi yerine GitHub ile giriş kullandım. Giriş yapmamış bir kullanıcı işlem yapmaya çalıştığında modal açılmak yerine "Unauthorized" uyarısı içeren bir toast mesajı gösteriliyor.
• Optimize Görsel Yükleme: Daha iyi performans için varsayılan Next.js image loader'ı yerine Supabase'in image loader'ını kullandım.

Ek Sayfalar

• /history: Kullanıcılar daha önce ürettikleri görselleri görüntüleyebiliyor.
• /collection: Kullanıcılar favorilerine kaydettikleri görselleri görebiliyor.

Giriş Zorunluluğu

Görsel üretebilmek için giriş yapmak gerekiyor. Diğer birçok projemde klasik giriş yöntemlerini uyguladığım için bu projede farklı bir yol izleyip GitHub ile kimlik doğrulamayı tercih ettim. Giriş yapılmadığında "Unauthorized" uyarısı veren bir toast bildirimi çıkıyor; böylece yalnızca giriş yapmış kullanıcılar görsel oluşturabiliyor.

Not: Bu proje Next.js'in serverless API yapısını ve actions.ts dosyasını kullanıyor. Hobby planında fonksiyon çalışma süresi 1 dakikayla sınırlı olduğundan, görsel üretimi uzun sürerse hata alabilirsiniz. Projeyi sade tutmak için bu sorunu çözmemeyi tercih ettim; ancak işlem süresinin uzadığı durumlarda bu hatanın oluşabileceğini göz önünde bulundurun.

Teşekkür

Bu proje DevChallenges.io tarafından sağlanan tasarım ve gereksinimlere göre hazırlandı. Bu ve benzeri projeler için platformlarına göz atabilirsiniz!

Bağlantılar

• Kaynak Kod: GitHub Deposu
• Demo: Yapay Zeka Görsel Üretici Canlı Demo