Next.js getStaticProps, Fetch Data form Firebase, Dinamik Url
yukarıdaki kodun dosya adnı [eventId].js . useRouter hook’u yardımıyla url den eventId değişkeni alınır. bu eventId ile local de kayıtlı dummy-data dan veri çekilir ve ekrana basılır. aşağıda bu işlemi Firebase den veri alarak yapacağız. sayfanın arama motorlarında görünürlüğünü artırmak için getStaticProp ile build esnasındaki data ile html sayfasnın static oluşmasını sağlayacağız. Sayfa urlleri dinamik olduğu için getStaticPaths kullanılacak.
max yukarıdaki kodu optimize etti. 1) öncelikle event üzerinde değişiklik yapıldığında bunun sayfaya doğrudan yansıması gerekir. mevcut durumda sayfa build esnasında oluşur ve bir sonraki build edilene kadar değişmez. revalidate değeri 30 verilerek sayfanın otomatik şekilde statik halinin yenilenmesi sağlanır (30sn sonra sayfa çağırılmışsa yeni statik sayfa build edilir.). 2) eventlerin çok fazla olduğu durumlarda bütün sayfa url lerinin build esnasında oluşturulması sistem kaynaklarının boşuna kullanılmasına sebebp olur. o yüzden sadece featured: true olan sayfaları statik halini oluştuturup diğer url’lerin erişilebilir olması için fallback: true yapılır. DİKKAT!!! bu hali ile statik sayfası oluşmamış sayfalar açıldığında veri yüklenene kadar No Event Found görünür. o yuzden bu yazıyı Loading yapabilirz. ama bu seferde yanlış adreslerde Loading yazısı ekranda kalır. fallback: “blocking” olursa sayfa yuklenene kadar hiç birşey göstermez. adres yanlış olursa error verir. sonuncuyu yaptı geçti
