This New AI SEO Method is Worth MILLIONS
p7qFbbc0sbs — Published on YouTube channel Income stream surfers on October 22, 2024, 9:27 PM
Watch VideoSummary
This summary is generated by AI and may contain inaccuracies.
- This is the second part of the series where we are going to try and build the application website live. - The goal is to have as many possible pages as possible to rank in as many places on Google as possible. - Speaker A wants to get the category pages on the homepage so people can understand a little bit more what they're trying to build here. - They will implement a sitemap and a search bar in phase four. Then they will build the entire website and then it will be ranked on Google.
Video Description
This video will show you how you can take a prompt (which we created in the last video, using my prompt engineering technique, which can be found here: https://www.youtube.com/watch?v=RkSLALcfa6U) and turn it into a fully fledged web app that will rank on Google
Now I’ve already shown that this is theoretically possible by launching my own directory for Irish tradespeople - but now I’m going to show you exactly how I actually built that entire thing, and show you as well how to make sure that you’re getting something from AI website generation that actually works, and not something that doesn’t work
This is part 2 - the building process, we’ll also have a part 3 of this, which is where we actually launch the website
Just for reference the website I made on Sunday night (around 48 hours ago) - is already ranking on Google for some keywords that we could actually make money from
artificial intelligence,learn seo,search engine optimization,seo tutorial,seo for beginners,seo tips,chat gpt,seo,ai,chatgpt seo,ai seo,how to do seo,learn seo online,seo course full,seo content strategy,seo on page optimization tutorial,programmatic seo
Try our SEO tool: https://harborseo.ai/
Work with us: https://incomestreamsurfers.com/
Transcription
This video transcription is generated by AI and may contain inaccuracies.
Welcome to the second part of this series where we're going to actually try and build this application website live. Now for context, we're talking about programmatic SEO and websites like this one, findattradespersonisland.com, which I created less than 24 hours ago and which already has around 300 index pages on Google, which is completely crazy. Following on from last time, we have this roadmap which we built together. I showed you how to build this roadmap in the last video. Then all I've done is take it to perplexity pro and say, look up all the documentation on how to implement each one of these phases one by one, and then output the roadmap again exactly as it is now, but with code snippets which help an AI implement this solution. And then it's given me the exact implementation of everything here. So what we're going to do is we're going to, first we're going to put that at the bottom of this document so the roadmap and then we're just going to go to bolt new and actually we'll download the roadmap here. So we'll download this as a text and then we'll go to bolt new and we'll attach the roadmap. Then we'll say follow the roadmap. The first phase is implementation of this design and then we'll go to v zero, which we have open from last time. We'll copy the code and then we'll copy this as well. The reason I'm copying this as well is so the bolt new knows what's been built and how it's been built. So we'll press enter here. This should implement the first phase of this, which is just to recreate the homepage and should not be particularly difficult for this, for bolt, I should say. Now, one thing I want to say is that making one of these applications and launching one of these applications is two different things. Now you can make one of these applications, but to make it rank on Google you also need to launch it, which is effectively taking your application or your website and putting it on a server so that it can be used by other people. Right? And that's how you start to rank on Google. Of course you can't rank on Google from Localhost. You have to be live, publicly available, whereas localhost is just localhost. So yeah, you can see we already have a problem here. I already know what the problem is and I don't understand why it's so difficult for this AI for bolt to just have a simple implementation of a react component. I don't know why it has to take 20 minutes just to get to this point, but I mean, I guess this is the same app that built findtradespersonisland.com in 25 minutes is now struggling to even put a basic react component together. Very, very frustrating. It looks like they're having problems with their servers now. So it looks like the issue might be the search functionality. I would rather just get rid of search and just not have search, search as an option, but because the original code that I sent to it has search as an option, obviously it's struggling. Okay, looks like it's compiled. Okay, right, there we go. Finally, very, very simply has implemented that. So now I'm going to say implement phase two of the roadmap. But I'm also going to give it the specifics from the API. Just from like the video from yesterday's video when I made this roadmap, I got all of the API responses and information and I'm going to say use as much of the API response as possible to build the system. And then we'll paste that and then I'll give it the API details as well so that we can connect directly to the API. Oops, that's chat GPT. Here are my credentials. Okay, so this should do phase two. If we go onto here, you'll see phase two is API integration. So Walmart API setup, data fetching, implementation data transformation, storage. Yeah, not sure about storage, but that's fine. See what it comes up with. So this should actually build, rebuild what we've built so far, but with actual information instead of mock information. So what it normally does is it makes up information and just stores it. That's what programmers do when they start building an app. They'll just put mock data until they actually connect the data. So now we're actually connecting the data. Now, one issue I already know that this is going to have is that next js needs to have images from external websites set up and that will not be set up yet. So I already know that will be an issue, but that's fine. So now it's doing NPm install axios. Perfect. Okay, I'm going to do NPm run dev now. Like I said, it'll have the issue with the images, so it won't be able to draw the images just yet, but we should have some kind of basic implementation of connecting to the Walmart API. Walmart, by the way, just for context, it has an affiliate scheme and it has an API. So it seemed like a no brainer. There we go. Perfect. We're already at this stage where we're getting these results here. Amazing. And it already has some basic categories as well. So now I'm going to say you want it to work at every stage. Now I'm going to say implement phase three. Yeah. What this does is it sets up. So if I just look for data, it's normally under data. It says that I've run out of credits on the rapid API, but I definitely just paid to upgrade, so I'm not sure why that's the case. Oh yeah, I do have the pro plan. I need rate limiting. I've rate limited. Also, you've got cut off during your last response. Please continue with phase three. So we need a rate limiter just because if we try and generate too much content at one time, Rapida is, or rapid API is going to say no because it's too many requests. So it actually says you have exceeded the rate limit per second for your plan. It doesn't say we've used all of our limit. We do still have limit. It's just, yeah, yeah, we'll work on this in a second. But basically what you want is for you to later be able to add more types of something to generate more pages. So for example, with this website here, what I did was I added more locations and I added more trades to a file which then generated automatically more content because of the way that the website is actually set up, if that makes sense. I keep getting the message didn't complete its response. This is going to be kind of annoying if it keeps doing this because, yeah, I should not be doing that. There's clearly something wrong with bolt today. It's obviously being used by too many people, probably because it's just insane and more and more people are getting into it, I guess. But it looks like it got cut off again inside this file this time. Now we should still have something that's working. Like this, for example. Let's just try click family, I guess this is not going to work. Yeah, no, it's not working. That's okay. We still got somewhere with featured games at the top. Now we'll say you got cut off in your response. Continue with staticgeneration ts. Okay, there we go. So you can fix it like that. That's good to know. If it is broken, I don't know if that's necessary. Revalidate data. I mean, we can make that ten years so that we're not wasting too many, too many calls. On the API, basically, we don't really need new data every hour. Like, that's insane. It's a lot of calls. So we can, we can change that obviously later down the road. Please re implement phase three. There were some issues with implementation with your responses getting cut off. So ideally by this point we would want to have as many possible pages as possible, if that makes sense. So we've got categories, ages, players. That's good. So we have like board games for three year olds, board games for four year olds, five year olds, six year olds, etc, etcetera. And then we have board games for two people, three people, four people, five people, six people, etcetera. This is where the SEO comes from because those individual index pages are the pages that we're actually trying to rank on Google. Now, something else that we could add towards the end of this project is we could add a button that says buy on Walmart. There is an affiliate link to Walmart. Now I'm not going to be setting that up in this video just because I'm not trying to necessarily make this into an actual project. I'm just doing this to show you guys how it's done. This is now done. Let's see NPM run dev. This should actually start to work where we can click games and it should actually show us the information about that game. So like a review. So individual game pages as well. Okay, so we've got this. No, I want to see if the game pages actually work. So we'll press view details here. Now this, as far as I know should work, but it doesn't seem to actually be a link. When I click a game, it doesn't work. Okay, so this is another little bit of gold that I'm going to give you. You should let Bolt decide how to create the SEO. Okay, so what I've said to it there is, I want you to think of as many page types as possible. So like I said before, we have age, number of players, category, and then I want to know what else it can come up with. So, players, duration, complexities. Perfect. That's exactly what I wanted. We have easy to learn games, medium to learn games, complex games, shot by this, that and the other. This is where we start to really build something that has a lot of oomph and a lot of pages behind it. So this is where this comes from. Now, there are going to be problems at times, obviously, like this is now saying, module not found cannot resolve generated pages. JSON. So we'll fix that in a second. So we're trying to build as many pages to rank in as many places on Google as possible. That's kind of the name of the game here. We'll copy these here. It seems to have failed, so we'll copy that and we'll put that here. We'll see if this can fix it. Now just so you know, there is a final stage to this. I mentioned this before, but actually launching this is not as easy as you might think. Now my current best in slot way of doing this is get this to a point where you can use it on preview, on bolt, and it's working as you want it to and it's interesting and it's got a lot of pages and there's a lot of SEO and et cetera, et cetera. Then what you do is you press open in stack blitz and then you put it on a GitHub repository, put it local and then work on it on cursor. And the thing that you have to do is you have to run NPM, run, build. And it has to actually build properly. That's the name of the game for actually launching an application or a website like this. We'll have another video on that probably tomorrow, which my producer will have to sit through and edit me shouting at my computer for several hours, sir. Have fun with that. Okay, so it looks like it's compiled. So yeah, it works. Beautiful. Now if I click one of these games it should load. That's okay, that's okay. We're almost there, we're almost there. Just a couple of errors here. We'll just send it the error. Yeah, we'll just send it the error. It's fine. Okay, so look, it says here, save all the modified files, run NpM, run, build to generate the static pages, right? Okay, so we actually have to generate the pages for it to actually work. Now this is probably not going to work, but let's just see what happens when we run NPM. Oh, we've got 9000 pages. Okay, so wait, we don't want to do that just yet because that's going to take forever. But that's really interesting that you can just do that. Did you see that? It literally just says generated 9015 pages in generatedpages. JSON, that is actually insane. And then that then would become the sitemap as well. Just so people know. Okay, so this probably won't work, this view button, because you actually have to build the pages for this to work. But that's okay. It shouldn't work. Okay. It doesn't work. Okay, so we've exceeded the rate limit again, but that's fine. Basically, once you've generated that page, that page will exist, but it doesn't exist yet because we haven't generated the page. So now we just want to make sure that, please make sure that all of the categories, number of player categories and any other index pages are fully implemented and are on the home page. So we want to get the category pages on the homepage so people can understand a little bit more what we're trying to build here. But you can see we're getting there. This is the process. And then we build the application after hopefully if we can work out the rate limiting issues, which I didn't have those issues yesterday when I did this because I was using data for SEO API, which doesn't really have that problem. Okay, perfect. So we have now we would have board games for kids, board games for two players, board games for a large group, board games, easy medium. And we can add things to this, right, just by finding where these are stored. So I believe they're in here. So keywords JSON and then literally you take this to chat GPT, expand this list, do not change the formatting. So this is how we get scale. Just say no. Okay, so this might not work off the bat, but just so we can kind of understand how this would work theoretically, is you would change that like that and then save it and then that should automatically redeploy. And then if we scroll down, you'll see that it expands on that list automatically. That's where this gold comes from. This is the real kind of gold or juice or source behind this kind of project. It's here. So let's say if I click board games for kids. Now, I'm not sure this page will actually work yet because it hasn't been generated as far as I understand. And it does have another problem as well. But this is kind of. Yeah, you guys understand hopefully what I'm doing here. So I just. But even I'm confused by this. I don't really fully understand how this works. Whether it's better to have dynamically generated or dynamic content on the page or static content. At what point do I build all the static pages, et cetera, et cetera. But yeah, so it says NPM run, build. So at the point of building all of the strategy pages and all of those, that's when they get built. So that's why they've got errors at the moment. That's fine, I understand. I think so. We're not generating those pages yet, but they do need to be static, I think, in order to rank on Google. But again, I don't really know that either. So now we'll say four. Okay, so we'll implement phase four here, which will do the SEO for each of these pages. So implement phase four. This should include a sitemap as well, which focuses on SEO. So meta tags and head elements. Perfect. So it'll be like best board games for all that good stuff. That's where that comes from as well. So we've added structured data markup as well. I mean, why the hell not? We may as well at this point. Now let's create a sitemap URL optimization. Perfect. Sure. Lazy loading. Why not? May as well improve the speed of everything. Not. Oh, that actually worked. Oh, the search works. That's sick. Now I can literally only see a search bar. Let's just press fix problems, actually. So once this part is done, now this is when I would download the application. So we're actually pretty much done. It's literally that simple. I know it doesn't seem that simple, but I've built an mvp for a website that would rank on Google in 25 minutes. So I mean, that was not previously possible, to be honest with you. So it's completely insane. So the next stage of this is we would build the entire website. I believe it would all be static. I still don't really fully understand this myself, guys, so I apologize for that. But I believe we then build the website and then it ranks on google as far as I understand it. So if I press one of these, it won't work because it hasn't been built yet. So this is something I didn't understand yesterday when I was doing this project. So all we need to do now is actually get it to build. So if I do NPM run build and this works, yeah, 1250. That sounds about right. That's not too many. But anyway, at this stage, guys, what I normally do is I'm pretty happy with this app. It would be nice if it looked a little bit better. But the way the app is now it works, it has good potential for SEO. There are a lot of products on there from Walmart. I would probably add a Walmart affiliate link button to each product and I would probably have to fix some kind of rate limit problems here. I doubt this is going to actually work, but now we have 1250 potential category pages, product pages, etcetera, that can all review, pages that could all rank on Google in and of themselves. So that is pretty much the whole process for actually building the mvp of the thing. This is what I did yesterday when I made this website here. Find a tradespersonisland.com. it's working really, really well. I can't wait to see if this actually ranks on Google. Super, super excited to see that it looks like this is actually working. Okay, that's fine. So what normally happens is bolts creates code that is not typescript acceptable. So you can see here type error binding elements. Params implicitly has any type. If you sit and try and fix this on bolts, you will lose all of your code. Okay, so what I recommend you do instead is you press open and stat blitz here and I'm not going to go through the rest of it. This is pretty much the end of the video. Create a repository, make it private so people can't get your API keys and stuff. And then what this does is it allows you to put this on cursor or your preferred way of making code correct. And then keep running npm build. Keep running npm build. Keep sending the error to cursor and cursor is now how we will get this product ready to put on a website and start ranking on Google. I'm going to leave the video there. Guys, thank you so much for watching. This is so exciting, this kind of stuff. I can't wait to see what people do with this. I'm just giving you some ideas. My current idea is this board game website powered by Walmart affiliate and ads and yeah, we'll see what happens. Thanks for watching guys. If you're watching all the way to the end, you're an absolute legend. And yeah, I'll see you very very soon with some more content. Peace out. If you enjoyed watching me build this application in front of you on bolt, then make sure you learn how I build my product by watching the previous video.