Seçili işlere dön
Mobile-first SaaS menu · Aralık 2025 — Ocak 2026

Sofra QR

Restoranların marka, şube, kategori, ürün ve QR akışlarını yönettiği; misafire mobil menü, işletmeye web ve mobil yönetim yüzeyleri sunan ürün.

sofra-qr.lab
SOFRA / PANEL3 ŞUBE
Filtre KahveKahveler · aktif₺95
San SebastianTatlılar · aktif₺185
Cold BrewSoğuklar · aktif₺120
SOFRABugün ne
istersin?
4ürün yüzeyi
OAuth/JWTortak kimlik akışı
TR/ENmenü deneyimi
01 / BAĞLAM

Neden yaptım?

Problem

Basılı menüler güncel kalmıyor; fiyat, görsel ve bulunabilirlik değişiklikleri operasyon yükü yaratıyor. İşletme tarafında marka ve şube ayrımı, misafir tarafında ise hızlı ve sade bir menü deneyimi aynı veri modeli içinde çözülmeliydi.

Yaklaşım

Sistemi tek bir ekrana sıkıştırmak yerine ortak API etrafında dört yüzeye ayırdım: müşteri menüsü, web yönetim paneli, mobil yönetim uygulaması ve backend. Marka → şube → kategori → ürün sahipliği API katmanında doğrulanırken medya dosyaları ayrı bir obje depolama katmanında tutuluyor.

02 / MİMARİ

Parçalar değil,
veri akışı.

Her katman tek bir sorumluluğu taşıyor; ürün davranışı sınırların arasında kaybolmuyor.

01Müşteri menüsü · React + TanStack Router/Query
02Web paneli · Next.js + Ant Design
03Mobil panel · Expo + React Native
04Node.js · Express · TypeScript API
05MongoDB · Mongoose veri katmanı
06Google OAuth/JWT + sahiplik kontrolleri
07GCP Cloud Storage medya katmanı
03 / PROBLEM ÇÖZME

Zor kısımlar.

CHALLENGE 01

Aynı API, farklı kullanıcı yüzeyleri

Müşteri menüsü yalnızca aktif ve gerekli veriyi okurken yönetim yüzeyleri CRUD, sıralama, medya ve yetki bilgisine ihtiyaç duyuyor. Public endpoint’leri korumalı yönetim akışlarından ayırarak sözleşmeyi her istemci için sade tuttum.

CHALLENGE 02

Çok kiracılı sahiplik zinciri

Bir ürünün yetkisi kategori, şube ve marka üzerinden kullanıcıya kadar uzanıyor. Bu zinciri controller’lara dağıtmak yerine tekrar kullanılabilir ownership middleware’leriyle API sınırında doğruladım.

04 / STACK

Doğru iş için
doğru araç.

01
Express + TypeScript

Domain modüllerini ince HTTP katmanları ve tipli servis/repository sınırlarıyla kurmak için.

02
MongoDB + Mongoose

Marka, şube, kategori ve ürün şemasını hızlı iterasyonlarla geliştirmek; ilişkileri uygulama seviyesinde açık tutmak için.

03
TanStack Query

Birden fazla React yüzeyinde sunucu durumunu, yükleme/hata akışlarını ve yeniden sorgulamayı tek düzende yönetmek için.

04
Next.js + Ant Design

Yoğun CRUD ve yönetim ekranlarını tutarlı bileşenlerle hızlıca kurmak için.

05
Expo + React Native

Aynı işletme akışlarını mobilde güvenli saklama, görsel seçme ve QR paylaşımı gibi cihaz yetenekleriyle sunmak için.

06
Google OAuth + JWT

Web ve mobil istemcilerin ortak API’ye aynı kimlik modeliyle erişebilmesi için.

07
GCP Cloud Storage

Ürün ve marka medyasını uygulama sunucusundan ve MongoDB’den bağımsız ölçeklemek için.

05 / RETROSPECTIVE

Öğrendiklerim.

01

Aynı ürünün müşteri ve işletme yüzeyleri farklı veri yoğunlukları ister; public API ile yönetim API’sini ayırmak iki tarafı da sadeleştirir.

02

Hiyerarşik sahiplik kontrolleri baştan modellenmediğinde her yeni kaynak yetki borcu üretir.

03

Medya dosyasını veritabanına yüklemek yerine referansını saklamak, depolama ve uygulama sorumluluklarını ayırır.

06 / FUTURE PLANS

Bir sonraki sürüm.

Menü analitiğiRol bazlı ekip erişimiMedya optimizasyon akışı