Next.js App Router'da veri akışı: Server'dan Client'a
Server Components, layout verisi, params ve searchParams — App Router'da verinin nasıl aktığını anlayan rehber.
App Router, veri akışını Pages Router'dan tamamen farklı ele alıyor. Anlamak için önce zihniyet değişikliği gerekiyor.
Server'da veri çekmek
Artık getServerSideProps yok. Server Component içinde doğrudan async/await ile veri çekebilirsiniz.
export default async function Page() {
const data = await fetch('...');
return <Component data={data} />;
}Client'a veri geçirmek
Server'dan client'a veri geçirmek için props kullanın. Serilebilir olmayan veriler (fonksiyonlar, sınıflar) geçemez.
App Router'da her şey server'da başlar. Client, bir istisnadır, kural değil.
Bu yazıya tepkin ne?
Yorumlar (2)
Deniz Arslan
2 gün önceHarika yazı, özellikle children prop'u ile server bileşeni geçirme kısmı çok aydınlatıcı oldu. Pratik kullanacağım.
Musa Yazlık
1 gün önceÇok sevindim işine yaradığına! Pratikte karşılaştığın soruları yazabilirsin.
Selin Yıldız
5 gün önceState'i aşağı çekme kuralını projeme uyguladım, bundle boyutu ciddi düştü. Teşekkürler!
