I built an ai app in 33 days with claude code
By Beau Johnson · · 18 min · 1.6K views
About this video
Transcript
Read the full transcript
0:00How exactly did I build a AI app in 33 days? I'm going to walk you through the steps that I took to go from idea to actual product. And going through the steps is going to be a probably a little bit confusing if you've never built anything before, but I just want to give some encouragement, inspiration to the people that are from the outside looking in, wanting to build out their idea, but not knowing how. I'm going to work through my workflow just to kind of show you what I've been doing on how to learn these skills, how to implement these concepts, and how to take action on your idea. So, we're going to get right into it and just walk you through the process of what exactly are we working on? What have we been building? This is a playlist. I'm going to put it in this playlist so you can go through and work look through all the steps that we've taken. This is day 33 and we have made a
0:48major milestone of progress. We have actually officially been able to list items actively on eBay with our AI app. It's called easyflip.ai. It allows people to upload photos and get an AI analysis of those photos, create titles, item specifics, price your item, and publish them to marketplaces like eBay, Poshmark, and Merkari. So, easyflip.ai, what it does is it just saves the end user a lot of time. The manual listing process is very old and outdated. Not a lot of people want to go through doing that. And this just allows you to just upload photos, listings are created, done, and walk away. So, that's kind of our whole vision for it. Day 33, major progress, y'all. We have had major
1:33setbacks. We've had to even restart this project uh one time. So, it wasn't easy. It was the hardest thing that I've done mentally over the last few years, other than building our other business five years ago. It felt like a lot of the same problems and things that would come up, but it's made me a better person. This is the landing page. Of course, we need to tweak it a little bit. But yes, we've restarted this project because initially we started it in bolt new. We built a lot of the framework and then we were adding things like superbase um stripe payments um you know just adding in a lot of features and then what came to be is that we just overengineered the first version of this project and it just created a lot of errors a lot of bugs
2:18when I would go to fix a button or change a color it would do that but then it would break the database or we'd go work on creating a table in Superbase and then it would break the landing page and we just filled up our project with so much bloat in thousands of lines of code that did not matter and we just hit the reset button. And I want to point out what has been super helpful for me is that we just um watched a video from Ross Mike. He's a great uh YouTuber just breaking down a lot of the concepts and easy to understand for me. Anyways, he released a Nex.js JS starter pack that allows us to have authentication, database, payments all built in. Um, and we just started over with this starter
3:04pack and it's been so much better because it lays the foundation for you to build your project and fasttracks it. Like it took us 21 days to build what what this starter pack offers. We were able to rebuild this whole project in one day by using this starter pack. I'll link it down below. But yeah, the key features is it uses better off for authentication, uh Google ooth integration, uh polar for payments, even open AI if you wanted to have a little chatbot. Tailwind for the UI UX and databases storage is Neon and Drizzle. And then we just set up our Cloudflare for uh image storage. So really cool. Um, I'm excited to build future things
3:49with this starter pack as well, but it just made things so much easier because we had to build this out all by oursel when we first started this project. We had to build out the Google authentication by ourselves. We had to implement Stripe payments. You know, all of that is is very difficult when you don't have experience. Um, maybe it's easier for the people that have done built that stuff before, but for me, I had no idea what I was doing and therefore it was much harder than it needed to be. So, um, I guess the learning lesson here is if you're trying to build something, go look for things like a starter pack or something that can at least get you ahead in your project because more than likely someone's already built that out uh, as a repository on GitHub. So, at least you could hit the ground running and get
4:35going on your project. As for the build itself, we used Claude Code for the last three weeks building this project. Of course, we started in Bolt, which is a great platform to build your idea out, but our um project ended up being a little bit bigger and more ambitious than I thought, and we ended up just kind of maxing out Bolt. We were burning through credits, spending a lot of money, and filling up the context window, and it was just getting confused. So, we took our repository and put it into Cloud Code, and it's been beautiful ever since. We use cloud code within cursor and it has been really enjoyable, really nice. You could see uh our files are like not so crazy. In our other project, we had files all the way down to here and it was insane. It was
5:21giving me a headache. But just think Claude needs to go through all those files almost every time you start a new session or a new task. So it's very it's much more efficient now and it's great. and just getting to learn how to use this tool has been insane. Um, side note here, um, if you are starting to use cloud code, make sure you have a proper markdown file, um, for your product. You know what what is a a PRD? It's a product requirements document based around your project. This is going to give a lot of context for the thing that you want to build. This would be the first step that I would take if I was doing a project within cloud code. It's going to allow you to build out a proper claude markdown file. So you have a development strategy, timelines and just
6:06gives it like more of a brain behind your project. So um but yeah, that's the first thing that I would do. Little side note there. I didn't do that when I started the project for the first time and it was much more difficult uh because you had to give much more context to Claude to figure out what you were even trying to do. So that's been amazing. Um the starter pack's been amazing. Another thing, and I'm going to walk through this uh in this video just to show you a demo of the product, but I've been using Claude in conjunction with Claude Code to help me create better prompts since I don't have a ton of experience coding at all or any kind of programming language and the terminology and the concepts. I just don't know. So, I'm able to give bugs and errors to Claude and then say,
6:52"Create me a prompt that I can give to Claude code to fix these issues." And that has been phenomenal because not only am I learning how to use Claude, but also learning how to, you know, build this out. It's um there's no way that I'm going to outprompt Claude to be able to solve these issues because I don't even know what I'm looking at. You know, it's like a Chinese language for me. So using Claude with Claude Code has been super helpful. For anyone that doesn't know a lot about Vibe coding or just coding in general, that's going to be probably the quickest way to learning as fast as possible. You can see here, I'll just go over one of my chats um with Claude for like debugging. Um for example, this has been like the
7:38framework on how I've been able to create um lo proper logging and also fix a lot of the issues. So I use Whisper Flow. So when I'm so I'm able to voice to text all of this stuff. So it's really easy. Um so still noticing on the generate listings page on the item specific size, type and department all those drop-own menus it says select it and then when you click the drop-own menu it says no options available. That's going to be confusing for a lot of users that's going to need to be corrected. So essentially whatever error or bug that I'm trying to solve, I have the development page right in front of me here and I'm just basically speaking into Claude that whatever errors I see,
8:24you know, just straight up this is how I'm seeing it. So we had issues with the the user interface not displaying, you know, proper drop-own menus correctly. And I'm not going to read through all of this, but just kind of giving you context. Um, and here's what I would say. I'm attaching the server side logs, the console logs, and the create button in the network tab. So that way it has the information of all the errors that happen during the workflow. So during the listing generation, during the publishing to eBay, it has all that data on what is going on. Maybe it's a token exchange issue, maybe we're not communicating properly with the eBay API for certain categories, things like that. So I give it the create button uh whether it's uh successfully published
9:09or not. Uh I also get I just have Claude code give me the server side logs like straight up. Um like there is let's see what what am I saying exactly to Claude code. Where are we? Okay. I just say whenever we're going through this and before I'm prompting Claude to give me like a report of what errors are happening, I just say before I do that, I get the server side logs and I make Claude code do it. Um, I could do it myself, but just to help speed things up, I just say report back with the server side logs. I just want to see the logs. So it does it and then it gives me a brief summary on the server side logs as to what exactly happened on the back
9:54end that I can't see on the front end. So then we can then give that to Claude to formulate a good and efficient optimized prompt to fix these issues. So console logs, server side logs as well as any other information that you could give to Claude that could really help. So then it develops a plan and um I do use plan mode whenever I'm prompting claude code. So shift tab and then it goes into plan. So therefore it's able to analyze the data and formulate a plan before just taking action. That way I could take that plan and then give it back to Claude code. So I would just highlight whatever plan it generated, go back into Claude, and then I would copy paste that uh plan from Claude Code into
10:39Claude, and then it can review the the plan and go, "Yeah, this would work. This makes sense." And there's been instances where Claude's been like, "Hey, that's going to work to fix this issue, but it's missing this entirely." So then I can restructure the plan before we just oneshot it into existence. So that's been really cool. Now, I just want to show you kind of how I'm troubleshooting this. Yes, we have technically completed it, but we still have to optimize categories, keywords. There's still bugs, of course. So, we're not ready to launch, but we are ready to launch this thing in about two to four weeks. I want to get it as as perfect as possible before we start beta testing and then we can start making tweaks and
11:24improvements. But as far as the hero pro part of this project is complete and thank Jesus because this has been a struggle guys. If you go back and watch through the pre playlist, it's been a little bit of everywhere and it's been crazy. So really cool that we actually got the main part of this product working. Uh I want to walk you through the process and get you kind of a feel for what I've been dealing with, how I've been solving the problems. Is it going to work on the first attempt? Hopefully it might not. So, I just want to show you how I'm troubleshooting this. So, the dashboard's very basic, very simple. Um, but we got a bulk upload feature. We're going to upload the photos. So, we're going to go and upload photos. Let's just take this STE jacket for example. And, um, we're going
12:11to just upload them. These photos get uploaded to Cloud Flare R2 for the image storage. And once it's done uploading, then we're going to head into the AI analysis part. So, we're also going to be working on things to be a little bit quicker, but for the most part, it's pretty quick. Um, this is the assigned skew page. Very important when you're reselling clothing on eBay or anything on eBay is proper skew numbers. Like, if you list items on eBay and you don't have a skew number, how do you know where it's at? So, skew number is important. So, we have it automatically generate one for you, but most resellers will have a skew number in a photo or somewhere where they are going to be keeping track. So, let's just say this is skew number one. And then after that,
12:56we're going to create the item and then we're going to generate the list. Once we are in this page here, we are going to just simply generate all. The whole idea of this is to batch create. So, someone would upload a batch of 10 items. So, it would probably be over a hundred photos. It would then upload those photos. It would analyze those photos. So, we're just doing one for now, but my whole vision is it for it is to have people have like 10, 20, 30 listings right here and have it just knock it out in minutes. So, we're taking a a um a workflow that used to take beginners that want to resell on eBay, you know, two, three minutes to create a really good listing down to 10 to 30 seconds by just clicking a few buttons. It's going to have an optimized
13:41title, brand, item, gender, size, color, keywords, which is the correct um sequence for eBay, and having an optimized title. Um, you know, we don't want the titles to be out of order. And we also want relevant item specifics. So, you can see here it says brand. What is the item? It's a puffer jacket. We got the size, blue, outdoor, hiking, warm, winter, casual. I think the keywords could still use some work, but we're still working on it here. And then you can see here it just has item specifics that you could quickly look at, but um the next page will show where you can edit them. Steel puffer jacket, perfect for outdoor adventures, casual wear. It just gives you a quick uh AI uh description. And then once you're done with that, you're going to hit ready for publish. And then you are on the
14:27publishing page. It's going to pull all your business policies, your return policy, your payment policy from eBay after you connect your eBay profile. And then you're just going to kind of double check things, make sure everything is correct, fill in any item specifics that um maybe were missed or not correct, and then you're going to list this thing on eBay. So, um yeah, that's kind of how it all works. That's the flow of it. And um let's see. Once it's all set and ready, you're going to just publish. And we'll show you the finished product here in a second. But this has been a lot of trial and error, a lot of going back and forth with fixing getting it in the correct category and getting it to fill out the right item specifics. It's been a more
15:14tedious than I ever thought it would be. But there is nothing of a better feeling than a sense of accomplishment once you see your idea actually work. Last night at 9:00 was the first time when I saw this thing actually publish a listing onto eBay with the correct title, the correct item specifics. It pulled in my business policies and it actually worked which is amazing. So after it's basically done, it's published to eBay and then we're going to just go to eBay and we're going to see the item be pulled up right here. Steel puffer jacket size 2XL. And there it is for sale, ladies and gentlemen. Pretty cool. I love it. And um obviously it's not perfect. There's still a few little things we need to fix because it's still putting in size as regular, which the
16:01size should be 2XL, not um not regular. And also, I'm noticing that it says it's new without tags. It's not. It's like new. It's not brand new without tags. So, that's misleading. Um you got to be really careful with that because you don't want to be misleading any of the customers because then you're going to get an item not as described. So, still a few things to work on here, but like I said, the the main part of the project is done. We're able to successfully list stuff on eBay. And I have to say, you know, reading all the comments, the encouraging comments that come in on the channel really does help because this is by no means an easy thing to do. I never want to portray it as an easy thing to do. You're going to have to have the skill of failure because you're going to
16:48fail so many times. But I do believe the things that you fail in is just going to make you a better developer, a better creator, a better builder. Overall, the best skill that you can have when it comes to building is context engineering and prompt engineering, which is why I'm using Claude to handle that end because I don't know the exact terminology and the exact concepts to be telling cloud code to fix this UI component or to fix this uh SQL database table. I don't know, but I'm learning. And that's what I want to just show to you that use these tools to the best that you can so you can learn and build these skills so for the next project that you build, you know how to build that table or you know how to prompt Claude to get that outcome. It's all a learning process.
17:33I'm going to continue to just show the meat and potatoes on this channel, but I wanted to give you an update because I am fired up, guys. We're going to be launching this in about two to four weeks live. We have 120 email signups and I'm going to be showing you the process all the way through. And we already have our next project planned, but I'm not going to say anything more about that because we're going to continue to build out AI apps on this channel. Leave a comment if you have any input or suggestions because I'm a learner. You're not going to hurt my feelings. And we'll see you in the next one, guys. Have a blessed weekend.
Build this with us, live
Shipping Skool is a free community with 4 live build sessions a week. Bring your idea.
Join Shipping Skool — Free





