MENU

Fun & Interesting

Next.js Macerası #5 | Catch All Routes Kullanımı | #react #nextjs #web #webdevelopment #routing

MFSoftware Blog 113 lượt xem 1 month ago
Video Not Working? Fix It Now

Hepinize merhaba dostlarım :) Ben Muhammed Fatih

Ufak bir aradan sonra yine karşınızdayım :). Yakın zamanda başlamış olduğumuz "Next.js Macerası" yolculuğumuzda güzel bir konuya değineceğiz. Başlarda biraz #routing olaylarından gitmeyi tercih ettim diyebilirim. Özellikle uygulama geliştirme süreci içerisinde bu temel yapıyı kavramanızı, tanıtım sistemi gibi yapılar yapacaksanız da bunların mantığını hızlı bir şekilde oturtup ortaya bir ürün çıkarmanızı istedim. Heyecanınızı daha fazla artırmadan çenemin düşmesine engel oluyorum ve sizleri #nextjs dozundan ve kış günlerinin vazgeçilmezi olan vitaminlerden bolca miktarda doz almaya, ardından can dostumuz bilgisayarlarımızın başına geçmeye davet ediyorum :)

Bu bölümde sizlerle beraber "Catch All Routes" konusuna giriş yapıyoruz. Özellikle dinamik sayfa içerikleri ve belirli segmentlere göre işlemler yapmak istiyorsak bu işlem bize son derece yardımcı olacaktır.

Önceki bölümde tek bir segment ile bu işlemi yaparken ve harici bir segment geldiğinde #error sayfasına yönlendirilirken bu işlem ile dilediğimiz kadar segment oluşturabilir ve bu segmentleri #array şeklinde yakalayıp az önce de belirttiğim gibi dinamik içerikler oluşturabiliriz

Bütün bunların yanında sistemimize bir #backend bağlayacak olursak belirli ürüne ait #url üzerinden segment bilgisi geldiğinde belirli özelliklere göre (varyant) işlemler yaptırabiliriz

Bütün bu işlemlerin nasıl yapılacağını merak ediyorsanız video içerisinden detaylı bir şekilde öğrenebilirsiniz :)

Bölüm içerisinde yaptıklarımıza genel olarak bakacak olursak:
-- "Catch All Routes" konusuna giriş yapıldı
-- Hangi durumlarda kullanacağımıza değinildi
-- Önceki bölümün kodları üzerinden örnekler verildi
-- Gerçek projelerde nasıl bir şekilde kullanılacağımıza değinildi

şeklinde özetleyebiliriz.

İlk başlarda karmaşık veya zor gelebilir dostlarım anlıyorum. Öğrenme süreci içerisinde bu durumlar son derece doğaldır diyebilirim.

İşte bu aşamada sizlerden istediğim tek şey her videomun sonunda dediğim gibi "İstikrarlı ve azimli olmalısınız, bolca pratik yapmalısınız" şeklinde olacaktır. Bu dediklerimi hayat felsefeniz yaptığınız sürece başarı sizler için kaçınılmaz olacaktır :)

Şimdiden hepinize iyi çalışmalar iyi seyirler dilerim dostlarım :). Videoyu beğenmeyi, kanalıma abone olmayı ve bildirimleri açmayı, takıldığınız yerlerde yorum yapmayı unutmayın.

Ayrıca yakın zamanda "Shopier" üzerinden açtığım mağazamı da ziyaret edebilir, açık kaynak şeklinde satışa koyduğum yazılımlarımdan faydalanabilirsiniz

Projemizin Kodları: https://github.com/turan1302/nextjs-macerasi

React + Laravel Eğitimleri için:
WebRTC Projesi: https://tls.tc/04JnR
Alışveriş Sepeti Projesi: https://tls.tc/rzCkV
Chat Sistemi Projesi: https://tls.tc/7ePsd
Radyo Çalar Projesi: https://tls.tc/5HITg
Fast Typing Projesi: https://tls.tc/ZJkfy
Barkod Okuyucu Projesi: https://tls.tc/z07Ap

React Native Eğitimi için:
https://tls.tc/e5mIM

Next.js Eğitimi İçin:
https://tls.tc/RMdP3

- Sitelerim -
MFSoftware Blog: https://mfsoftware.net/
Seyyar Yazılımcı (Yazılımcı Tartışma Platformu): https://seyyaryazilimci.com/

Shopier Hesabım: https://www.shopier.com/mfsoftware42

- Sosyal Medya Hesaplarım -
Linkedin: https://www.linkedin.com/in/mfsoftware/
Instagram: https://www.instagram.com/mfsoftware.net.tr/

- Next.js dinamik yönlendirme örneği
- Catch all route ile URL yönetimi
- Next.js route yapılandırma rehberi
- Next.js ile SEO dostu sayfalar
- Next.js ile dinamik url yaratmak
- Catch all route nedir ve nasıl kullanılır
- Building dynamic pages with Next.js
- Next.js advanced routing examples
- Next.js dynamic page creation explained
- Next.js fullstack routing setup
- How to create flexible routes in Next.js
- Next.js with dynamic routing techniques
- Next.js catch all route örnekleri
- Next.js ile esnek yönlendirme çözümleri
- Next.js ile web sayfası tasarımı
- Next.js route yöneticisi nasıl çalışır
- Next.js ile hızlı rota çözümü
- Next.js catch all kullanım avantajları
- Next.js catch all route custom implementation
- Next.js dynamic URL handling tips
- Next.js routing and SEO best practices
- Create dynamic content with Next.js
- How to structure Next.js routes effectively
- Optimizing Next.js routing for performance
- Next.js için dinamik yönlendirme örnekleri
- Next.js ile gelişmiş routing yapıları
- Next.js catch all route kullanımı nasıl yapılır
- Next.js ile statik ve dinamik sayfalar
- Next.js ile modern web geliştirme
- Next.js dinamik parametre kullanımı

Comment