Next.js Macerası #27 | API Üzerinden Verileri Alma |
Hepinize merhaba dostlarım :) Ben Muhammed Fatih
Güzel geçen bir hafta sonunun son saatlerinde siz değerli dostlarımla beraber "Next.js Macerası" yolculuğumuza kaldığımız yerden devam ediyoruz :). Bir önceki bölümde de dediğim gibi artık derin konulara yavaştan girmeye başladık. #restapi altyapısını projemiz içerisinde oluşturduğumuza göre artık bu videoyla birlikte #backend olaylarına girişimizi gerçekleştirebiliriz :). Heyecanınızı anlıyorum, sözümü daha fazla uzatmadan sizleri #nextjs teknolojisinden ve kış günlerinin vazgeçilmezi olan vitaminlerden bolca miktarda doz almaya ve ardından can dostumuz bilgisayarlarımızın başına geçmeye davet ediyorum :)
Bu bölümde sizlerle beraber hazırlamış olduğum ufak bir "API" sistemi içerisindeki verileri sayfamızda listeleme işlemlerini gerçekleştiriyoruz. Ve hepsini de bir önceki video içerisindeki oluşturduğumuz "API Ortamı" üzerinden kodlayarak temiz bir yapıyla kodluyoruz
Sizler de "Next.js" uygulamalarınızda veri listeleme yapılarını kurmak ve verileri gönül rahatlığıyla almak istiyorsanız bu video size yardımcı olacaktır dostlarım :)
Bölüm içerisinde yaptıklarımıza genel olarak bakacak olursak:
-- "API Url" dosyasında ayarlamalar gerçekleştirildi
-- Örnek bir tasarım üzerinde işlemlerin nasıl olacağı anlatıldı
-- Veriler çektirildi
-- Verilerin gelme durumuna göre #loading işlemi ayarlandı
-- Yapılan işlemler adım adım anlatıldı
ş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-m...
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: / mfsoftware
Instagram: / mfsoftware.net.tr
Next.js API ile veri çekme teknikleri
Next.js ile API veri alma nasıl yapılır
Next.js ve React API entegrasyonu örneği
Next.js ile dinamik veri alma yöntemleri
API kullanarak Next.js projesi geliştirme
Next.js ile veri çekme ve işleme işlemi
Fetch data from API in React with Next.js
Next.js API connection and data handling
Dynamic data fetching in Next.js with API
Learn API usage in Next.js project
Next.js API tutorial for beginners
Using API with Next.js for data fetching
React ve Next.js API ile backend veri işlemi
Next.js API sorgulama teknikleri ve örnekler
Next.js ile hızlı API veri çekme işlemleri
API ile Next.js projesinde veri gösterme
React Next.js ile API veri işleme örnekleri
Next.js API ile verileri dinamik hale getirme
Next.js with API data fetching techniques
How to connect API to Next.js project
Next.js API data fetching with React example
Next.js API setup and data retrieval
API integration in Next.js applications
Fetching dynamic data from API in Next.js
Next.js API istemcisi kullanımı örnekleri
React ve Next.js ile API veri entegrasyonu
API kullanarak Next.js ile veri getirme
Next.js API ile veriyi JSON formatında çekme
Next.js uygulamasında API bağlantısı yapma
Next.js API ile dinamik veri çekme işlemi