2 min read

Scanly: Modern Bir Menü Yönetim Sisteminin Mimari Yolculuğu

Teknolojiye olan merakım donanım ve Linux dünyasıyla başladı; ancak bu merakı ölçeklenebilir bir yazılım ürününe dönüştürmek aklımdaydı. Scanly, bu vizyonun bir sonucu olarak ortaya çıkan; işletmelerin dijital menülerini ve operasyonlarını yönetebildiği modern bir SaaS platformudur.

Bu yazıda, Scanly'yi geliştirirken kullandığım mimari yaklaşımları ve karşılaştığım problemleri nasıl çözdüğümü özetliyorum.

🎯 Projenin Amacı

Scanly, işletmelerin (kafe, restoran vb.) QR kod tabanlı dijital menülerini oluşturmasını, çok dilli (TR/EN) içerik yönetmesini ve tüm bu süreci tek bir panelden kontrol etmesini sağlar. Projenin odak noktası performans, maliyet verimliliği ve kullanıcı deneyimiydi.

🛠️ Teknik Stack

Projenin temelini, modern web dünyasının en güçlü araçları oluşturuyor:

  • Framework: Next.js 16 (App Router) & React 19
  • Database & ORM: PostgreSQL 17 & Prisma ORM
  • Altyapı: Docker & Coolify (Self-hosted Linux VPS)
  • Media Storage: Cloudflare R2 (S3-compatible)
  • Auth: NextAuth.js

⚙️ Derinlemesine Teknik Mimari

1. Çok Dilli Veri Modelleme (Generic Translation Logic)

En gurur duyduğum kısım burası. Her tabloya name_tr, name_en gibi sütunlar ekleyerek veritabanını kirletmek yerine merkezi bir çeviri tablosu kurguladım.

  • Teknik Detay: Prisma üzerinden Entity (Ürün, Kategori, Mekan) ile Translation tablosunu ilişkilendirdim.
  • Fayda: Sistemde 2 değil, 20 dil olsa bile veritabanı şemam değişmiyor. Tip güvenliği (Type-safety) sayesinde hata payı sıfıra iniyor.

2. Performans ve SEO: Next.js 16 App Router

Menülerin anında açılması müşteri deneyimi için hayatidir.

  • Çözüm: Tüm menü görüntüleme sayfalarını Server Components olarak tasarladım. Veri, istemciye (client) gitmeden sunucuda hazırlandığı için kullanıcı "yükleniyor" ikonunu görmüyor.
  • Güvenlik: Admin panelindeki kritik işlemleri Next.js Server Actions ve Middleware ile koruma altına aldım. Yetkisiz bir kullanıcının sunucu tarafındaki fonksiyonlara erişmesi imkansız hale getirildi.

3. Akıllı Medya Depolama (Cloudflare R2 & S3 API)

Görsel paylaşımı SaaS modellerinde en büyük maliyet kalemidir.

  • Maliyet Yönetimi: AWS S3'ün aksine, veri çıkış ücreti (egress) olmayan Cloudflare R2 kullandım.
  • Entegrasyon: AWS-SDK kullanarak yazdığım özel bir upload servisi ile görselleri doğrudan R2'ye stream ediyorum. Bu, sunucumun diskini yormadan binlerce görseli yönetmemi sağlıyor.

4. Özgür Altyapı: Docker & Coolify

Bulut sağlayıcılara (Vercel vb.) bağımlı kalmak istemedim.

  • Deployment: Projeyi Dockerize ettim. Kendi Linux VPS sunucumda Coolify kullanarak profesyonel bir CI/CD hattı kurdum.
  • Monitoring: Veritabanı (PostgreSQL 17) ve uygulama ayrı konteynerlerde, izole ve güvenli bir şekilde çalışıyor.

🏁 Sonuç

Scanly, benim için sadece bir yazılım projesi değil; bir sistemin sıfırdan nasıl ayağa kaldırılacağının kanıtı. Self Host tarafindaki merakimi, modern web teknolojileri ve doğru mimari kararlarla birleştirerek uçtan uca çalışan bir ürün ortaya çıkardım.

Demoyu görmek isterseniz:
🔗 Corner Bistro