SEO with Next.js 13 - Dynamic Sitemaps, OG Images and Metadata API

แชร์
ฝัง
  • เผยแพร่เมื่อ 28 ม.ค. 2025

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

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

    The most important video for any developer working as a Next JS dev in any company

  • @SanchitArora-my6re
    @SanchitArora-my6re 9 หลายเดือนก่อน +1

    The best and most helpful video related to meta tags😍❣

  • @javadrip
    @javadrip ปีที่แล้ว +9

    One of the few videos that ACTUALLY tackles the important yet often overlooked stuff! Thank you! And I've subscribed!

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

      Same here!

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

      Thank you guys! I'm really glad you liked it 🫶

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

      i feel the same

  • @heroiulacio2345
    @heroiulacio2345 ปีที่แล้ว +7

    Thank you for speaking so slowly, I speak very little English and I understand you perfectly with the help of the subtitles, greetings from Venezuela

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

      I’m glad you find it helpful!

  • @nikolayt.5054
    @nikolayt.5054 ปีที่แล้ว

    Wow! Went through this video in January 2024! Your presentation is excellent! Thank you!

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

      Glad it was helpful!

  • @yauul
    @yauul ปีที่แล้ว +5

    Thank you for the video! I have been struggling with the dynamic opengraph part for a while now. This video definitely solve that part for me. You got a subscriber friend. Keep it going!

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

      I’m glad it solved your problem 🤞 Thanks!

  • @doguarunbayraktar
    @doguarunbayraktar 9 หลายเดือนก่อน +1

    Ya cok tesekkurler boyle guzel bilgilendirmen icin. Amerikadan selamlar, sevgiler.

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

    What a gem bro, you are a life saver. Keep up your good work!

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

    Thank you for speaking fluently ❤
    This video is very helpful

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

    THANK YOU, YOU ARE AWESOME. I deployed my website and wasn't getting indexed by Google. I tried reading nextJS document on SEO but damn, it's so confusing... so many examples, I just want to deploy my site and make it searchable lol such a simple thing and they have so much explanation. They should feature your video, you explained it all so well and in simple terms. Thanks again!

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

    You're trully great man! keep it up and thank you so much!

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

    31:11 after build, the sitemap getting freeze and not populating new data at sitemap. It is getting freeze with the data till the yarn build. Please raise this issue with nextjs. It is not a good practice that I have to access my server and need to run yarn build after every new post.... Please🙏🙏🙏🙏🙏🙏🙏🙏

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

    nice work makrdev! Greetings from Venezuela!!

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

      Thanks bro 🫶🏼

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

    Exactly what I was looking for. Thank you. Instant follow 👍

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

      Glad it helped!

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

    DAMN bro such a great and informative video you saved my time. keep it up

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

    Hello my friend. This is an amazing video, please continue to teach online :) Of course I subscribed :)

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

      Hey there! Thank you 🙏 I’m working on a project at the moment I’ll be posting new videos soon ✌️ I subscribed your channel as well!

  • @kamrant8915
    @kamrant8915 8 หลายเดือนก่อน

    Really useful tutorial. Thanks a lot

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

    30:50 Thanks a lot for showing how to generate sitemaps dynamically. It's so badly documented in Next.js

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

    Great video thank you as I was struggling with SEO in Next13 👍 *Subscribed*

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

      Glad it was helpful!

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

    That was really good thanks, *Subscribed*

  • @cristec1695
    @cristec1695 5 หลายเดือนก่อน

    This video is excelent

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

    Very helpfull thanks ! i recommend !!

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

      You're welcome!

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

    Loved your Content. Subscribed :)
    It would be great if you create a tutorial on creating this nextjs blog!

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

    Thanks for clean explanation. In the dynamic sitemap generation, we generate a new ```lastModified``` parameter each time, isn't this problematic? I mean, I think we should write the actual last modified timestamp for each URL.

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

    Love the video. Really deep and visual

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

      Thank you so much!

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

    Hi, thanks for your tutorial. Can you explain how can I generateMetadata on my [slug] page, if it's a client page? In this page I use useEffect and useState...

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

      I think you can return legacy Head component with related metadata however I do not recommend making the whole page client component. You should divide interactive parts into separate client components and put it in a server component.

  • @funterban6536
    @funterban6536 3 หลายเดือนก่อน

    nice sir nice content

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

    Thank you for this amazing tutorial. My question is how do we set up fallback og images when we use this method

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

    I still don't understand about sitemap. So I have to rebuild every time I want to update sitemap, even though I use a dynamic sitemap?

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

    Hi Batuhan I reach you from Turkiye. Firstly "Nasılsın?", is there any way to keep our site map up to date, when I add a new product or category. I need to redeploy my project to update sitemap. Like revalidate = 0 ;

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

    It will be great if you make a e-commerce course with this practice!

  • @exploit.6848
    @exploit.6848 ปีที่แล้ว

    Amazingg video very helpful

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

      Thank you 🙏

  • @EliasEmon-e2x
    @EliasEmon-e2x ปีที่แล้ว

    hello sir,
    what about the new post after building the nextjs app.
    If I add new blog post after building the nextjs app with static genaration.
    Can you please give me this ans.

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

    Is it possible to generate a sitemap index and sub-sitemaps?

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

    hello my friend from Viet Nam. Your video help me a lots for my project. But i'm just a newbie and i have a question.
    For example, if i add a new post, will the sitemap automatically update or i must rebuild the project
    Thank you very much 😍

  • @ThiLe-j2h
    @ThiLe-j2h ปีที่แล้ว

    it's seem dynamic sitemap was generated at build time, if we create new post/category sitemap will not update then next build right?

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

      When you create dynamic sitemap it will fetch the latest data every time you refresh the sitemap. So, when you add new page it will be displayed in the list.

  • @Sam-wp2zh
    @Sam-wp2zh ปีที่แล้ว +1

    Nice job, Sitemap: How do you deal with sitemap limitations: 50Mb and less than 50,000 URLs? We have over 300,000 pages.

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

      You can create different sitemaps.

  • @EliandroViana-ty3hl
    @EliandroViana-ty3hl ปีที่แล้ว +1

    Thank you for your awesome video! whats you think about Drizzle ORM? Can u create a tutorial with supabase + Drizzle integration?

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

      Thank you! Yeah, I’ll create a video about Drizzle soon 🤞

  • @Nextjs13-kq5cm
    @Nextjs13-kq5cm ปีที่แล้ว +1

    Dope! :)

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

      Thanks 🙏

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

    What's the name of that tool where you can see the web perfomance and SEO score?

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

    What is that application to check your website at 0:50?

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

      Pagespeed Insgights from Google

  • @NiravThakkar-p6x
    @NiravThakkar-p6x 5 หลายเดือนก่อน

    i generate meta from server side and get , it is cool but i want to remove from my source page , please share suggestion

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

    How can i use priority and changefreq in dynamic sitemap?

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

    nice

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

      Thanks!

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

    HI Sir, Can I use the same sitemap with the páges directory?

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

      Yeah as far as I remember they were same. Even if they are not, the idea is same.

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

    hey man how do I go about making a dynamic sitemap that updates everytime new content from sanity cms is added ?

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

      Just create a server-side sitemap. It will fetch new posts on every visit you or Google make.

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

    You are just too Awesome,,Sir..
    I learned a lot from this Video..I appreciate your hard work..Thank you so much again..
    Take love from Bangladesh..🤍🤍..

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

      Thank you Farhad! I’m glad you liked ❤️

  • @SajaAhamed-v4d
    @SajaAhamed-v4d ปีที่แล้ว

    Amazing video☺☺. Can you upload next 13 crash course video?

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

      I’ll be doing for Supabase first but I’ll definitely create for Next.js 13 too. Do you have anything specific in your mind that you want to learn?

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

    thank u

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

    Hi, Thanks for the tutorial video this is very helpful. I'm still struggle with implementing opengraph-image.tsx file with searchParams. since it's a server component I'm struggle to find ways to directly access searchParams. Any suggestion?

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

      Can you join our discord? I can help you over there 👍

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

    Hey bro Make a video about Atomic Structure in Next Js

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

    Great work my guy. I have noticed some change on the opengraph-image.tsx file from the documentation. Can you please leave a comment here to reflect the changes. Thanks!

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

      Thanks 🙏 I’ll check it out 🤞

  • @RajeshSingh-nu1iz
    @RajeshSingh-nu1iz ปีที่แล้ว

    How can we use google fonts in og image creation with tailwindcss, pls share the info

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

      You just need to import the font you need. Check the docs and you will find an example.

  • @PiotrKownacki-f3w
    @PiotrKownacki-f3w ปีที่แล้ว

    section about sitemap makes no sense, to geerate sitemap i need your blogs?

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

    How can i change image in metadata please

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

      You need to create OG image. You can see the details in the related part.

  • @KiloSierra1
    @KiloSierra1 11 หลายเดือนก่อน

    Only useful if you're using the app folder

  • @topnatop
    @topnatop 11 หลายเดือนก่อน

    ngo