Next.js App Router ile Ölçeklenebilir Proje Mimarisi

Giriş

Next.js App Router, sunucu bileşenlerini varsayılan hale getirerek web uygulamalarının nasıl yapılandırıldığını önemli ölçüde değiştirdi. Bu yazıda, orta ve büyük ölçekli projelerde uyguladığımız klasör yapısını ve veri erişim yaklaşımını paylaşıyoruz. Amacımız, ekip büyüdükçe kod tabanının okunabilir kalmasını sağlamak.

Klasör Yapısı

Rota klasörlerini yalnızca sayfa ve düzen dosyaları için kullanıyoruz. İş mantığını ve veri erişimini ayrı bir katmanda tutmak, rotaların sade kalmasını sağlıyor. Bileşenleri ise alan bazlı klasörlerde gruplandırıyoruz. Bu yapı, yeni bir geliştiricinin projeye uyum süresini kısaltıyor.

Veri Erişim Katmanı

Tüm veri okuma ve yazma işlemlerini tek bir veri erişim katmanında topluyoruz. Bu katman, yetkilendirme kontrollerini ve doğrulama kurallarını merkezi olarak uygular. Sunucu bileşenleri doğrudan bu katmanı çağırır; istemci bileşenlerine ise yalnızca ihtiyaç duydukları veriler aktarılır. Böylece hassas alanların yanlışlıkla istemciye gönderilmesi riskini azaltıyoruz.

Önbellekleme Kararları

Her sayfa için içeriğin ne sıklıkla değiştiğini değerlendiriyoruz. Nadiren değişen içerikleri statik olarak üretiyor, yönetim panelinden güncellenen içerikler için yol bazlı yeniden doğrulama kullanıyoruz. Bu yaklaşım, hem hızlı sayfa açılışları hem de güncel içerik sağlar.

Sonuç

App Router ile çalışırken en önemli kazanım, sunucu ve istemci sorumluluklarının net biçimde ayrılmasıdır. Bu ayrımı proje başında netleştirmek, ilerleyen aylarda teknik borcun birikmesini önemli ölçüde yavaşlatır.