Astro Blog Course #16 - SEO basics

In this video, I'll show you how to set up some basic SEO metadata using Astro. We’ll try to focus less on SEO in particular and use it more as an excuse to practice what we’ve learned about passing props in Astro and working with routes.

🔗 Key Links 🔗

---------------------------------------

⏲️ Timestamps ⏲️
0:00 Introduction
0:45 Explaining copied files
5:28 Adding SEO to head tag
9:08 Walkthrough
13:23 set:html

---------------------------------------
🎨 VSCode Theming

---------------------------------------

🌐 Connect With Me 🌐

[KostasWasHere]

Thank you so much for this free course. It is unbelievably valuable to a beginner like me!

[CharlesSurge]

Wow! This is a great wealth of resources you've made available here.

Came across your channel few days ago and I've learnt a lot within a short period.

Although I am still going through the entire astro playlist, I would really love to see you breakdown SEO for astro further as there is currently no resource on it here on youtube.

I feel it would be appreciated by your community of subscribers as there is hardly an indepth SEO course made for developers.

Astro SEO please 😊😊

[_the_one_]

Gold content! Can't believe I have 6+ years of experience and didn't know those SEO things! Imposter Syndome hit hard on this one!
Thanks for the video and the awesome content you are providing! Would definitely LOVE to see more SEO content

[briankgarland]

Nice. I've been avoiding learning SEO but this provides a ton of good info. May need to watch it again though. Or three or four times. LOL

[felipegutierrez]

Great Content! I think astro has an integration with seo called astro-seo

[marekbee]

What are the best resources/channels to learn more about SEO? What would you recommend? Especially connected to json-ld?

[DanteMishima]

Aah, that's how you get the preview image.... Thank you

[photoshopping]

The og image URL is a relative URL, so it doesn't display correctly; instead, it must be a full URL to display correctly when the corresponding page is shared on social networks.

[alimbolar]

Thanks for the awesome content.. really appreciate it..:-).. When you do add this part "url={Astro.url}" to the Seo component, are you not adding the object Astro.url instead of 'Astro.url.href'? I was confused with this.. although it seems to work when I tried it.. but the reason I am asking this is in one of my site (where it's not working) the canonical url is showing as 'localhost:3000' even when the site is in production on netlify.. and I am trying to debug this issue and can't seem to figure out why the canonical url is not displaying the actual site url.. any ideas?

[JimKernix]

Holy cow - totally clueless for this video - looks like I have a lot of research to do

[JimKernix]

By the way, I just tried to view the home page index.html in the dist folder with Live Server and it has no styling. Why is that? I can see the stylesheet link from the assets folder but no styling. I thought the files in the dist folder were the ones you would use to load for the live site. What am I missing?

[DanteMishima]

Hey Chris, could you help me.... On the URL part.... I did everything the same way you did, but my deployed version says the url is localhost 3000

Might there be something I missed?

[JimKernix]

Can you only go live on specific hosting sites like Kinsta or sites like Netlify? WTF? Can you not use Astro for a client who already has a hosting company? What's the point?