#23 - Örnek Proje 1: Movie Detay Sayfası - Sıfırdan İleri Seviye Next.js v13

แชร์
ฝัง
  • เผยแพร่เมื่อ 1 ธ.ค. 2024

ความคิดเห็น • 28

  • @mucahitdev9910
    @mucahitdev9910 ปีที่แล้ว +8

    Hocamızın 4:45 te bahsettiği next js in div koyma olayı 13.1.1 versionunda kaldırılmış.

  • @Rikimkigsck
    @Rikimkigsck ปีที่แล้ว

    Ilk videodan itibaren izledim buraya kadar asiri iyi seri olmus cidden cok tesekkurler.

  • @eneskutulman260
    @eneskutulman260 6 หลายเดือนก่อน

    Hocam ellerinize sağlık çok güzel bir anlatım olmuş yeni başladım next.js ' e . Bu arada loadingi görüntülemek için delay koymak yerine network tabından internet hızınızı yavaşlatabilirsiniz . :)

  • @tolgauzuncom
    @tolgauzuncom 2 ปีที่แล้ว

    Hocam aylardır böyle bir içerik bekliyordum. Dersleriniz çok faydalı çok teşekkür ederim. Çok faydalanıyorum. Sakın bu seriyi bırakmayın :)
    Not: Delay fonksiyonu yerine şunu yapabilirsiniz hocam. Geliştirici Araçları > Network > No throttling kısmından Slow 3G yapabilirsiniz.

    • @pekcanmehmet
      @pekcanmehmet  2 ปีที่แล้ว +1

      Teşekkürler çok sevindim bunu duyduğuma :)

  • @michaelscofield2469
    @michaelscofield2469 2 ปีที่แล้ว +1

    müthis bir seri tesekkürler, videolar daha uzun olursa daha iyi olur yorumlarınızı anlatımınızı dinlemek cok güzel

    • @pekcanmehmet
      @pekcanmehmet  2 ปีที่แล้ว +2

      Teşekkürler değerli yorumların için 🙏🏼
      Videoları olabildiğince modüler tutmaya çalışıyorum ama feedback'ini not aldım teşekkürler

  • @shahinbabayev4456
    @shahinbabayev4456 ปีที่แล้ว +1

    Hocam anlatımınız çok güzel. Şu derse kadar herşeyi anlaya biliyorum diyebilirim. Ama githuba atarken her ders için ayrı ayrı commitler yollarsanız daha iyi olabilir diye düşünüyorum takip etme açısından. Commit isimleride Dersin numarası. Tabiki videolar kısa kısa olduğu için sizin için biraz zor olacaktır biliyorum) Tekrar teşekkürler emeğiniz için

  • @tutkuns
    @tutkuns ปีที่แล้ว

    Merhaba Mehmet, bu güzel içerik için teşekkürler. Ben destek olarak 8:33'te bahsettiğin yüklenme hızını kodda değiştirmek yerine: Tarayıcının konsolundaki "Network" kısmında "No throttling" select menüsünden "Fast 3G"'yi seçip sayfayı refresh edersen sayfa 3G hızında yüklenir. İstersen "custom" kısmından özel yükleme hızı da ekleyebilirsin.

    • @pekcanmehmet
      @pekcanmehmet  ปีที่แล้ว

      Teşekkürler 🙏🏼
      O yöntemi genelde çok sevmiyorum, kullanırken sürekli normal mod ve throttle arasında git-gel yapmak zorunda kalıyoruz.

    • @tutkuns
      @tutkuns ปีที่แล้ว

      @@pekcanmehmet kodlarken kolaylık oluyor aslında. Aksi halde kodla yapmak da biraz uğraştırıyor 😊

    • @pekcanmehmet
      @pekcanmehmet  ปีที่แล้ว

      @@tutkuns Haklısınız, ben alışkanlıktan böyle söylüyorum :)

  • @sahiniz
    @sahiniz 10 หลายเดือนก่อน

    helal olsun çok iyi seri
    tek kötü olan şey içeriklerin önizleme resmi kırmızı ve youtube ta izlenilen resimler de kırmızı çubukla gösterildiği için hangi videoda kaldığımı anlayamıyorum

  • @alperyazirr
    @alperyazirr 4 หลายเดือนก่อน

    Hocam merak ettiğim bir soru var. Her page, her component için bu loading.jsx i neden oluşturuyoruz ? tek bir loading kompanenti oluşturup her yerde çağıramıyormuyuz? MovieLoading, HakkımızdaLoading filan derken kod tekrarına giriyor gibi sanki

  • @muratti32
    @muratti32 ปีที่แล้ว

    Teşekkürler elinize sağlık. 5.46 daki sorun height:'100vh' verilerek çözülebilir

  • @mehmethanifierenler3612
    @mehmethanifierenler3612 7 หลายเดือนก่อน

    Çok teşekkür ederiz. Yeni versiyonları bekliyoruz. Ücretlide olabilir. Hatta ücretli olsun.

  • @azatseyrek4344
    @azatseyrek4344 ปีที่แล้ว

    Hocam selamlar oncelikle emekleriniz icin cok tesekkurler. Loading kismini gorebilmek icin aslinda developer toolsta network kisminda No thorttling kismini slow 3G yaparsaniz internet hizinizi azalttiginzdan loading ekranini gorebiliyoruz. Sizin promise ile yapmanizin baska bir nedeni var mi acaba?

  • @gundogduyakici
    @gundogduyakici ปีที่แล้ว

    3:18 'de ki id.toString() methodu yerine 3 eşittir yerine 2 eşittir yapsaydık çalışır mıydı? Çalışırsa da sağlıksız bir yöntem mi olurdu? fikriniz nedir?

    • @pekcanmehmet
      @pekcanmehmet  ปีที่แล้ว

      2 eşittir yani Loose Equality, genel olarak tavsiye edilmiyor. O yüzden her zaman 3 eşittir kullanmak daha doğru bir alışkanlık olacaktır

  • @Makstosei
    @Makstosei ปีที่แล้ว

    hocam hala buralarda mısınız acaba :) bu not-found.js bir türlü çalıştıramadım. değişen birşeyler mi oldu acaba? next.js 'in kendi 404 sayfasına gidiyor. chatgpt ile çözüme ulaşmaya çalıştığımda router.push(/not-found) ile göndermeye çalışıyor. dökümantasyonda da gezindim çalışması gerekiyor gibi..

    • @Makstosei
      @Makstosei ปีที่แล้ว

      * When used in a React server component, this will set the status code to 404.
      * When used in a custom app route it will just send a 404 status.
      notFound() ctrl+click yaptığızda gittiğimiz .ts dosyası içerisindeki comment satırı sanırım. notFound'un çalışma tarzı ile ilgili bir değişim oldu :)

    • @Makstosei
      @Makstosei ปีที่แล้ว

      sanki nasıl çözdüğümü de yazmıştım ama kaybolmuş belki de göndermeyi unuttum yanıtı :) movie/[id]/not-found.js konumunda çalışmıyordu. movie/not-found.js konumuna taşıdım çalıştı. loading ve error.js ise normal çalışıyor ama not-found çalıştıramamıştım nedense.

    • @mehmetcelmeli9918
      @mehmetcelmeli9918 ปีที่แล้ว

      Mehabalar aynı sorun ile ben de karşılaştım...Ama şunu sizin çözümünüzde anlayamadım movie/[id]/not-found.js dinamik sayfa yapısı yerine movie/not-found.js stabil sayfa yapısını kullanmak ne kadar doğru onu bilemedim:)) Sorun ile hala uğraşıyorum...

    • @tuğçetopçu-d8d
      @tuğçetopçu-d8d 7 หลายเดือนก่อน

      @@mehmetcelmeli9918 bende şuan uğraşıyorum çözümünüz var mı acaba

  • @yigitruzgaruzun7289
    @yigitruzgaruzun7289 ปีที่แล้ว

    Videoların kısa olması, tüketimini kolaylaştırıyor.
    Teşekkür ederim.
    Container yaklaşımının Layout'dan farkı nedir ?

    • @pekcanmehmet
      @pekcanmehmet  ปีที่แล้ว +4

      Ben teşekkür ederim.
      Kısaca açıklamak gerekirse Layout kendisini kullanan bütün alt sayfaların sabit elemenlere sahip olmasını sağlar. Container ise sabit elementlerin dışında kalan her sayfada değişen dinamik kısımda yer alan component'lerin birleşip bir UI haline geldiği alan. Burada ki mantık 'seperation of concerns' ilkesine dayanıyor. Layout, sadece sabit elementler ile ilgileniyor. Page, sayfa seviyesinde ki istekler, redirection vs. gibi logic'lerle ilgileniyor. Container ise o sayfayı oluşturacak olan atomik component'lerin birleşmesi ve varsa business logic dediğimiz işlerle ilgileniyor.
      Örneğin:
      --- Logo ------- Navigation ------
      --- Sidebar --- Dinamik Alan --
      -------------- Footer -------------------
      Container ise yukarıda ki Layout'ın içinde her sayfada değişen 'Dinamik Alan' kısmında ki component'leri bir araya getirip anlam kazandırdığımız yer. Örneğin bir Ödeme sayfası için yukarıda ki 'Dinamik Alan' container'ı şu şekilde olabilir:
      ----- Form Başlık ------------------
      ----- Input 1---- Checkbox ---
      ----- Input 2 ---- Checkbox ---
      ----- Input 3 ---- Checkbox ---
      ----- Options --- Siparis Butonu ---

    • @yigitruzgaruzun7289
      @yigitruzgaruzun7289 ปีที่แล้ว +1

      @@pekcanmehmet Verdiğiniz detaylı bilgi için teşekkür ederim