SEO in Next.js - The Ultimate Guide (Metadata, Sitemap, Robots, Google Search Console, Caching)

Поделиться
HTML-код
  • Опубликовано: 11 янв 2025

Комментарии • 242

  • @JosephOpio
    @JosephOpio 9 месяцев назад +36

    One of the best SEO videos you can ever watch. Don't skip any steps. I have watched this over and over and over and still can't get enough of it.

    • @codinginflow
      @codinginflow  9 месяцев назад +5

      Glad you liked it!

    • @JosephOpio
      @JosephOpio 8 месяцев назад +1

      @@codinginflow Can you please make a video on the Opengraph image generator?

  • @benb1987
    @benb1987 Год назад +35

    Brilliant guide, probably the most informative and clearly explained youtube video I have watched. Great work!

  • @HousseynBelhadja
    @HousseynBelhadja 9 месяцев назад +3

    This video on SEO is truly exceptional - a must-watch! Each step is crucial, so make sure not to miss any. I've revisited it countless times and still find it incredibly valuable.

  • @alpha7s708
    @alpha7s708 4 месяца назад +5

    Such a clear and concise course. Worth every second. Just love it ❤

  • @raves_r3177
    @raves_r3177 5 месяцев назад +1

    I just want to say I really appreciate you for making these types of content. Thank you for your hard work

  • @londelidess
    @londelidess 2 месяца назад

    You are the only one who talk about these setting, my savior.

  • @sirbacharach1
    @sirbacharach1 9 месяцев назад +3

    What a fantastic video, I've been struggling with SEO with React and Next.js as I'm new to web development, but this video has been such a great help, even the icon and the opengraph image has been helpful

  • @RamaGuptaOfficial
    @RamaGuptaOfficial Месяц назад

    THANK YOU, THIS HELPED ME 43:36 to create a Dynamic Sitemap very easily. Please continue making more helpful videos. Loved it❤

  • @asappi1
    @asappi1 Год назад +5

    Awesome guide! I'm a big fan of the way you show examples of everything. Thanks a lot!

  • @riscode
    @riscode 9 месяцев назад +2

    I was hooked like I was watching a blockbuster 😂 Learning many things without getting overwhelmed. Really great video!

  • @Anushkai1
    @Anushkai1 6 месяцев назад +1

    One of the best SEO videos for Next JS

  • @tareksellami7346
    @tareksellami7346 8 месяцев назад

    The best mentor ever. I followed you when you were doing Android and you helped me get my first job. Now I am learning Next.js and you making it easy for me again. I cant thank you enough for your wonderful videos ❤. You are better than GPT 😂. You are literally answering all the questions that cross my mind. Gooold

  • @Kim-by5uy
    @Kim-by5uy 3 месяца назад

    Amazing video. At first I assumed the video would be slow and drawn out because of the length. But no, every second was valuable.
    Thanks

    • @codinginflow
      @codinginflow  3 месяца назад

      Thank you for the kind words!

  • @manavatshyam
    @manavatshyam 5 месяцев назад

    Your explanation is simply amazing. This is the best video I have watched to improve SEO in a Next.JS application.

  • @pamphilemkp
    @pamphilemkp 11 месяцев назад +1

    Thank you for this amazing tutorial, you deserve my subscription I hope many more people find this channel, I have been trying to understand how to add the metadata in nextjs, I have read the official doc and watch a couple of videos on some channels I could not find any relevant content like, thank you for the hard work for the dev community I am so happy because I have been able to solve many issues after watching this tutorial and also understand may SEO concepts. keep up the good work.

    • @codinginflow
      @codinginflow  11 месяцев назад

      Thank you for the kind words 😊 Glad you liked it

  • @李泽洋
    @李泽洋 Месяц назад

    The best SEO video I've ever watched. Keep it up!

  • @sammy3362
    @sammy3362 Год назад +2

    Absolutely loved this! Very insightful

    • @codinginflow
      @codinginflow  Год назад +1

      Thanks a lot! Very happy to hear that!

  • @dreamsachiever212
    @dreamsachiever212 2 месяца назад

    23 sec in and i already like it. Let's go. Thank you for such a comprehensive content

  • @nadeking1530
    @nadeking1530 6 месяцев назад

    Best and short tutorial with tremendous knowledge

  • @z.sayari
    @z.sayari 3 месяца назад

    Thank you for this simple and fantastic tutorial .

  • @AbdullahBaig-o2z
    @AbdullahBaig-o2z 3 месяца назад

    Best SEO video that I ever watched !!

  • @WebDevelopmentHamilton
    @WebDevelopmentHamilton 10 месяцев назад

    Thank you for such easy to follow and in depth tutorial

  • @yhr4052
    @yhr4052 4 месяца назад

    Thank you for your video, it helped me refactor my metadata with things I didn't know could be so concisely improved (like prefix/suffix default template)

  • @RafiulHasan-ki5ez
    @RafiulHasan-ki5ez 2 месяца назад

    Best video for SEO In Next Js 🔥🔥

  • @LearnAlongFaizan
    @LearnAlongFaizan 2 месяца назад

    This video is a gem💎,
    Loved it, ♥
    Video suggestion, if you can create a part 2 explaining other aspects of SEO as a nextjs dev and covering tools and techniques that have help you to rank, would be appreciated.

  • @raphaelmesquita4483
    @raphaelmesquita4483 2 месяца назад

    What amazing tutorial, keep up the good job

  • @Leesdjo
    @Leesdjo 11 месяцев назад

    Thank you so much for the detailed video. This video deserves more than just a like and a subscription.

  • @aminahb4307
    @aminahb4307 9 месяцев назад

    Absolutely fantastic walk through! Thank you!

  • @soniclasses7841
    @soniclasses7841 7 месяцев назад

    First time i saw ur channel with this video.
    And i can say amazing knowledge on seo u have
    Want some more tutorials based on nextjs with typescript seo advance 😊

  • @musipto
    @musipto 5 месяцев назад +1

    Thank you I didn't know about that google search console thing. 👍🏽

  • @alvin3171997
    @alvin3171997 Год назад +1

    Supern tutorial!
    All things SEO related are answered.

    • @codinginflow
      @codinginflow  Год назад

      Glad you liked it 👌

    • @alvin3171997
      @alvin3171997 Год назад

      @@codinginflow I think one thing that is not covered is scheme markup for each dynamic product pages

  • @pitsonborellio7463
    @pitsonborellio7463 8 месяцев назад

    Awesome video, very detailed with lot of useful tips. Thank you very much !

  • @CharlesAE
    @CharlesAE 11 месяцев назад +1

    Very in depth vid , could you do one on integrating Google AdSense into Next14?

  • @TheLarynx
    @TheLarynx 9 месяцев назад

    Amazing work, very well delivered. Thank you!

  • @timmytimeo
    @timmytimeo 5 месяцев назад

    Quality content. this really is helping me a lot! I will come back here with results in few months :)

  • @mahammedsarfaraznawazpagal5018
    @mahammedsarfaraznawazpagal5018 11 месяцев назад +1

    Thank you so much for uploading 🎉 Subscribed right away.

  • @codingwithlucy
    @codingwithlucy 8 месяцев назад

    Your explanation is so clear, thank you!

  • @panwar9848
    @panwar9848 8 месяцев назад

    Really well made video. Thanks keep making such videos

  • @tijanimiracle90
    @tijanimiracle90 3 месяца назад

    this is aweasome brother i learnt alot

  • @ayonbit
    @ayonbit Месяц назад

    Thank you So much for this video tutorials. It saved a lot . :)

  • @RFbcc
    @RFbcc Год назад

    Wow a new t-shirt and a wireless earpiece 😀,
    Great video as always , Arigato my sensei !

  • @kamrant8915
    @kamrant8915 7 месяцев назад

    Great tutorial. Thank you very much. Really appreciate it.

  • @mohammadDeveloper2431
    @mohammadDeveloper2431 Год назад

    This knowledge every developer needed thank you so much for this tutorial please more video like this new features in next js

  • @Niamudeen
    @Niamudeen Месяц назад

    I just loved it. It's so helpful. 😄

  • @rameshrajendran3006
    @rameshrajendran3006 7 месяцев назад

    This was really helpful, thank you!

  • @binh1298ify
    @binh1298ify 2 месяца назад

    Hey man, thank you so much for this video, I learned a lot

  • @ElijahScott10x
    @ElijahScott10x 11 месяцев назад

    This video is a Godsend. The docs sucks compare to your video. I appreciate it.

  • @kousseilameniche6246
    @kousseilameniche6246 Год назад

    Thank you! you really helped me a lot! keep up the good work

  • @duypkthg592
    @duypkthg592 2 месяца назад

    Awesome very simple and easy to understand, hope that when NextJS 15 is more stable and has official React 19 Compiler you can make a video about the new features🥰

  • @issa.garcia
    @issa.garcia 9 месяцев назад

    just amazing content, new subscriber and will keep watching your videos!

  • @MuhammadOwais-ue4jb
    @MuhammadOwais-ue4jb 6 месяцев назад

    Thank you very informative and help at the same time.

  • @kjedsbhfsjhgxfkhgfs
    @kjedsbhfsjhgxfkhgfs 6 месяцев назад

    I vatched this on my potato machine. Excellent stuff.

  • @asifkhan-rb8tl
    @asifkhan-rb8tl 11 месяцев назад

    good explained in less time thank bro

  • @Marc-fj3kd
    @Marc-fj3kd 10 месяцев назад

    Excellent video, thank you!

  • @Ethan_404
    @Ethan_404 Год назад

    Thank you so much for the new advanced knowledge and resources. 😍😍

  • @ivandamyanov
    @ivandamyanov 8 месяцев назад

    All I needed thank you!

  • @MichaelShingo
    @MichaelShingo 9 месяцев назад

    thank you this is a goldmine of info

  • @parvineyvazov
    @parvineyvazov 3 месяца назад

    great video! Thank you so much!

  • @maxilkiv
    @maxilkiv Год назад

    15:11 - I think there's a feature in VS Code which allows you to forward localhost, it's called port forwarding

    • @codinginflow
      @codinginflow  Год назад +2

      Right, I forgot about this. I think it's new.

  • @matheusgwg
    @matheusgwg 9 месяцев назад

    youre incredible, thank you so much!

  • @leopolddelassence5224
    @leopolddelassence5224 7 месяцев назад

    thanks man, great video

  • @usamecoban2582
    @usamecoban2582 8 месяцев назад

    Thanks for the guide !!

  • @juanspada4852
    @juanspada4852 7 месяцев назад

    Thanks for your content!

  • @ChusenOne
    @ChusenOne 8 месяцев назад

    Great video! Helped me a lot improving the SEO for a project I was working on.
    One quesion though: I found that vercel's analytics tool gets blocked by most adblockers and on their documentation doesn't mention much or anything about it. Do you know a work around this?

  • @interceptorghost1149
    @interceptorghost1149 4 месяца назад

    "konichiwa" and his face starts acting like a robot even the way of he speaking🤣. Nice video btw

  • @davidlintin
    @davidlintin 9 месяцев назад

    Great tutorial!! So much info. One question. How would we create a site map with internationalization also how to generate the seo metadata based on the lang param ? ✌🏻

  • @realstoman
    @realstoman 10 месяцев назад

    Super useful tutorial 👍

  • @tiavina-mika
    @tiavina-mika 10 месяцев назад

    Very useful video, thanks

  • @lmlTimolml
    @lmlTimolml 8 месяцев назад

    Hey! Great stuff! One question though, I have a project that uses next-intl to serve different locales, how can I pass the locale variable to the dynamically generated sitemap so it will take into account which locale to map?

  • @Fopfidk
    @Fopfidk 2 месяца назад

    awesome video, where is the tutorial for the dynamic OG image with code?

  • @EmanuelCovelli
    @EmanuelCovelli 8 месяцев назад

    Hello do you know why con cloudflare pages on dynamic routes I have to use export const runtime = 'edge'; so even if I use generateStaticParams the pages will be note served with SSG but dynamically ? Thanks very much for this video!

  • @barackobama4552
    @barackobama4552 2 месяца назад

    thanks! but i have a question, i need to add the principal "public_base_url" to the sitemap?
    or just the subpages?

  • @apitelrgramapitry7609
    @apitelrgramapitry7609 8 месяцев назад

    Thanks for this awesome guide. and how to make sitelink on google search?

  • @albertoenriquez2440
    @albertoenriquez2440 11 месяцев назад

    This is what I was looking for. Thanks. I still have an error in GSC that says "page with redirect", but I think its a google thing more than my code...

  • @sohrabkhan101
    @sohrabkhan101 Год назад +1

    I have encountered an issue where my Open Graph images are no longer appearing when I share my page. Interestingly when I view source in chrome, the images are present in the HTML code. After spending few hours I realize that open graph image is not public. Do you know how do i fix this

  • @Crowned1608
    @Crowned1608 Месяц назад

    Could you please make a video about using google ads to promote the webside and show up on the first entries in google?

  • @SMarGwanS
    @SMarGwanS 8 месяцев назад

    Hey, thank you for anamazing video.
    I wanted to ask in case I have [locale] folder, where should my sitemap file go and how should it look to support different locales?

  • @UpMarket_kerala
    @UpMarket_kerala 2 дня назад

    which tool use seo performance checking other plugin. how to connecte please say

  • @КириллАмиров-ц2ф
    @КириллАмиров-ц2ф Месяц назад

    very informative thank you very much

  • @lightoflifegames7227
    @lightoflifegames7227 10 месяцев назад

    thank you very muchm very useful and enjoyed watching

  • @radshodam
    @radshodam Год назад

    great tutorial 🍻

  • @younesessaadani9303
    @younesessaadani9303 8 месяцев назад

    Great video, I have one question if i'm using vercel with the free domain that vercel provide.
    How can i verify the domain when using google search

    • @codinginflow
      @codinginflow  8 месяцев назад

      I think you can't because you don't have access to the DNS settings

    • @younesessaadani9303
      @younesessaadani9303 8 месяцев назад

      @@codinginflow Yeah that's one, thank you ❤️

  • @TikTokTrendsCompilation
    @TikTokTrendsCompilation Год назад +1

    Just what i needed to learn, great tutorial! thank you

  • @maker._
    @maker._ 8 месяцев назад

    I liked this video so much I clicked on its ads

  • @nvbkdowb
    @nvbkdowb 4 месяца назад

    Do you have any particular recommandation when working with Next.js internalization ? My web app is using 4 languages (EN, DE, FR, IT).

  • @tejasyoutuber
    @tejasyoutuber Год назад

    Do you know how to resolve the data dump in the content type of text/x-component on the UI. I am using aws cloud front as cdn

  • @ste9890
    @ste9890 11 месяцев назад

    Excellent run-through, thanks for this! The tip to convert the blog post to SSG is great, but my blog index is also dynamic at the moment - I think because I'm using search params for pagination. Is there a way I can make the index (or at least the first page) static as well?

    • @codinginflow
      @codinginflow  11 месяцев назад

      I think it's fine for this section to be dynamic because it doesn't show up much in Google.
      However, you can move your page number into a URL path param ("/blog/1") and this way cache them too.

    • @ste9890
      @ste9890 11 месяцев назад

      @@codinginflow Thanks for the quick response, appreciate it!

  • @Radiotiq
    @Radiotiq 4 месяца назад

    quick question, is it possible for a protected route that fetches data from an API with authorization to be static instead of dynamic?

    • @codinginflow
      @codinginflow  4 месяца назад +1

      The parts that don't depend on the authorized content can be static. Or you can do the authorization in the middleware.

  • @asifuzzamanbappy1297
    @asifuzzamanbappy1297 11 месяцев назад

    another question, if i may.... can i use disallow props in robots.ts file with some wild cards in them?(i.e. disallow: ["/author/*/list", "/groups/name/*"])
    thanks and happy coding :)

  • @MaryamEbrahimi-l8o
    @MaryamEbrahimi-l8o 18 дней назад

    this was very usefull thank u

  • @yusuftezel9273
    @yusuftezel9273 8 месяцев назад

    Nice video, thanks a lot. Is keyword not important, i am just newbie for SEO and want to know if there is anything that is not mentioned in this video (the first thing that comes in my mind is keywords). Again thanks for this video.

  • @RAJUSARKAR-zo7om
    @RAJUSARKAR-zo7om Год назад

    That's great!! Thank you

  • @knuseski
    @knuseski 11 месяцев назад

    About caching: What if the content changes? Will 31st know that there is new content and invalidate the cache, or it will render outdated data ?

    • @codinginflow
      @codinginflow  11 месяцев назад +1

      Either build the project again or look into incremental static regeneration

  •  Год назад

    Thanks so much for that video. It has clarified me a bunch of things. 🙂
    May I ask one question? If I fetch data from a server component and I need to render it in a deep nested component how I would do that?
    If I place the data in the Context API (use client) I lose all the server features but I also do not want to drill it down so many levels.
    Thanks in advance. 🙏🏻

    • @codinginflow
      @codinginflow  Год назад +1

      I would fetch it in the lowest server component and then just pass it as a prop

    •  Год назад +1

      @@codinginflow I really appreciate your insight. 🏆So as I suspected either or another, not a third choice then.
      Your approach makes sense since passing props down is better than losing the SSR feature. 🥇🔥

    • @codinginflow
      @codinginflow  Год назад +1

      ​@ Yea I think that's the right way

  • @hymerrathebarbarian
    @hymerrathebarbarian 4 месяца назад

    Thank you very much, you are awesome

  • @ashfaquemamdu4582
    @ashfaquemamdu4582 8 месяцев назад

    This has helped me a lot. i have one doubt regarding sitemap generation. for one of our project we are using next js 14 app router and currently our site is completely static we are using export to build to static site. I am not able to generate dynamic sitemaps can any one help me with this or provide some resources which will help me . that will be a great help thanks

  • @davidvasseur-ng1yw
    @davidvasseur-ng1yw 24 дня назад

    Great video thanks !!! Why don’t you talk about canonical url in metadata ?

    • @codinginflow
      @codinginflow  24 дня назад

      Because this video is about the technical parts of Next.js

  • @harveyezihe
    @harveyezihe 11 месяцев назад

    i'm not sure if it's just me, but the form to subscribe to the newsletter doesn't show up on chrome, but it did on edge. Maybe it's one of my numerous addons mistakenly blocking it perhaps.

    • @codinginflow
      @codinginflow  11 месяцев назад

      Thanks for letting me know. The form is loaded from a third-party provider so I guess something in your browser is blocking it.

  • @nihalnclt
    @nihalnclt 4 месяца назад

    Awesome 💫

  • @thedoctorunofficial
    @thedoctorunofficial 2 месяца назад

    "it takes time to build and depends on what kind of potato machine you are running on..." i choked on my laugh 🤣🤣🤣🤣🤣🤣