Making Claude Code 10X Smarter Building My AI App
By Beau Johnson · · 29 min · 512 views
About this video
Transcript
Read the full transcript
0:00Well, we did it all. In about 47 days, we completed our first AI app build. And I'm so excited because I'm going to be sharing you where we are at now and the new project that we're going to be working on. And I'm going to be taking you through the whole process and showing you for people that are just getting started with using Cloud Code, wanting to build an AI app and figuring out how to go about doing it. Well, on this channel, we document the process. We build out AI apps. We work through all the frustration and the struggles to really help you provide some value that you could do this as well. So, let's show you where we're at in the process and kind of what we're going to be working on here next. So, we finished our easy flip.ai app. If you go back, I'll put this in the playlist so you can go back and watch where we started and
0:46where we're at now. Really cool. We are finished. It is done. It is complete. Um, easyflip.ai all finished. Amazing. Let's see what we got going on here. Um, so this is the app. It's really simple. It crosslists and does AI analysis to market places like eBay, Poshmark, Merkari. Right now, we're just connected to eBay, but you're able to snap a photo and get items listed automatically. And this is kind of the the process. And I just launched this on our YouTube video um today on our other channel. and I sent out emails and we're going to start updating you the progress um as signups come in. And even though that this pro uh project is pretty much done, there's a few things I'd like to add into it. Um
1:33but I am going to be keeping you updated and we're going to be jumping into our next project that's been on our mind for a while. A lot of times when I come up with these projects, I also want to validate them, but they're also things that I would use in my daily life. Like I'm using EasyFlip.ai AI every day because I'm listing 20 to 30 items on eBay every day. So, it's something I use. This isn't something I'm just trying to create and then just sell it and then don't use it. I want to be um using it, right? So, um there we go. Easyflip.ai. I will Let's log in here and then I can just show you the dashboard. All right. So, after you connect your eBay account, you're then able to upload photos and list stuff on eBay. It's pretty basic, pretty simple, but this process is so old and
2:19old-fashioned, it takes forever to do. So, yeah, you're able to bulk upload, upload the photos onto the website, assign the skew number, generate the listings, publish to eBay. Very simple. We're going to be adding in the crosslisting functionality later down the road where you can connect your eBay account, pull those listings from eBay, and then push them out to other marketplaces. Right now, the hero feature is finished and done. Cool thing is is I added in a Lindy chat support bot. So I can go into support and chat with it and you know just ask about like what features it has. Um so we have 247 support. This is based on a knowledge base that I had Claude create basically throughout our whole creation process. Answers a lot of the common questions. If it doesn't have that answer in the
3:05knowledge base, it's then going to send me a Slack message where I can respond personally. So, that was a cool integration we did recently. I don't know if I've talked about that. And then also another thing, too. Um, so yeah, it gives you like a good little breakdown of of what we offer and how it works. Um, another cool feature was the report bug feature. So, I really wanted to make an emphasis on um, you know, it's not a finished product. And if a user comes across a bug, they can report it. And what that does is it uh copies their console logs and the server side logs, sends me a Discord message, and then I could take all that information, feed it back into cloud code, and correct a lot of these issues right on the fly. So, that's really cool. Um, those are the two things that I just recently did. Um,
3:51but yeah, it's really cool. It's kind of sad because it's, you know, this was like our baby. This is our first app we've ever made and I'm just so excited. It's done. It's working. It obviously could be better. Um, but at least the hero feature is working. I'm able to upload photos and get it analyzed and just launch those listings on the eBay within seconds rather than hours. The next project we've been working on, I don't know if I want to show you, but I am. It's the name is still working on it, but I got pray about it. Pray about it is basically after you pray, you get actionable steps on what to do based on your prayer. So essentially, you're praying into your phone. God, my aunt Susie, she's got a terrible fever. Please keep her safe. Keep her keep her
4:37helpful. Help her get through this sickness and fever. Jesus's name. Amen. And boom. After that prayer is done, that's just an example. Um, you're going to get actual steps on helping Aunt Susie out. What are some things that you could do to help reduce a fever? Or what are some things that you could do to help cheer her up? Creating a plan and actionable steps right after prayer. We don't want your prayers to go unanswered. Not saying that they do, but I do feel like prayer without deeds, right, is useless. Like, we need to be taking action on the things we pray about and working in unity with God to have those come to pass. This is just my belief. You don't need to believe what I believe, but I do want to show you how we build this out, the knowledge bases that we connect, the APIs that we
5:23connect, and everything from there on. The cool thing that's different about this app is that we're actually going to be starting um this is our first mobile app. This is going to be a web app second and a mobile app first. So, we're going to be using React Native um and downloading Expo to be able to build this app out. We're going to be using Whisper Flow API to be able to talk um you know, do our prayer in the in the app and then have analysis and outlines and plans and visions drawn out based around our prayers. So, I hope that makes sense, but I just I'm so excited to share it with you. We actually got some really nice uh features on the the website. I love how it kind of just all, you know, flows together. We're using a Tailwind Shad CN. We're using Neon
6:11Drizzle for the database. We're using Better Off for authentication uh that has Google OOTH built in. And yeah, pretty cool, pretty basic, uh pretty simple, but everything just works. we're going to host on Versell. Um, but so it's going to be a mobile app first and then a web app second. Um, so really simple. My whole goal was actually go going B2B, offering it at my own church first. Um, you know, giving it away for free. It's kind of like, hey, test this out, see how you like it, and um, go from there. So is more of like a B2B play for me rather than B to C. But we're going to be doing a little bit of both. And yeah, I'm excited to share with you. This is This is definitely going to be a lot easier to build than the easy flip. Because that was insane.
6:58The eBay API documentation is crazy. And um I definitely age 10 years in 5 days building that. So this is going to be more of a fun passion project that's going to be really not saying it's easy, but it's going to be probably easier than building easy flip. So um first thing I want to mention is that the idea was validated in idea browser. I am a paid user of idea browser. I think it's really helpful for people that want to cook ideas, incubate ideas and be able to get some feedback. Um, so the idea was validated. Um, there is demand. Let's see. Prayer app. You know, you could see, you know, there is demand, right? And nothing worse than building something that doesn't have demand. So, probably let's see. So, let's see. Um,
7:45this just gives you a brief overview. The reason why I like using this as a launching pad to start is because it has all of the build tools that you need. So, the product requirements document, the MVP, the brand coloring, the the road map, the marketing material, everything. It has it all and you could tweak it um how you want it, but it has the brand packaging, the landing page, everything. So, it's really cool. Um I love it. I mean, I have so many ideas. I want to build them all, but it's just one at a time, right? So you're able to get these prompts that are already pre-made and drop them into cloud or whatever you want or whatever you use bolt lovable and um so it's really cool. It gives you a lot of clarity on the idea that you want to build. Nothing more important than validating the idea
8:31before you even start working on it because if you think it's a good idea but no one else does, it's not going to be worth building. Distribution is probably the most important thing when it comes to building apps because you can have an amazing app but if no one wants it then unless you're using it um unless you're using it personally right I mean maybe it serves a big uh purpose for you so not saying you know you build an app for yourself definitely if you want uh go ahead so the first thing I did I want to show you this for new people watching I always build out a project within Claude I think that's super important to do because it gives you guidance. It it allows you to figure out what to do, how to do it. This is like your your business consultant, your your mastermind where you go to advice
9:18as you're building this project. And I started a project here, really simple. Um the first thing I did is I created the project and then I had it build some instructions. So I basically said, hey, you know, I'm trying to build this app. gives it give it an idea of what it's about, what it does, and then it gives and then it provides the instructions um for that. So, you basically just want to brain dump whatever ideas you have for it into Claude and then uh have it say create me a prompt for instructions for this project. It did that and then um I just gave it um we're using the next.js starter pack. I just went into GitHub and downloaded Rasmike um on YouTube had a great Nex.js starter kit and I just
10:04went to Git ingest and I just copied that um GitHub link put it into Git ingest and then I just put it in here. So it knows the frameworks of what we're trying to use. Tailwind, Shad, CNN, Neon, Drizzle, Better Off, everything that we're trying to do in this app and knows the framework and the structure of the um tools we're trying to use to build this product requirements document. The most important thing is your product requirements document. And unfortunately, I already started working on this project because I couldn't wait. Um otherwise, I would have showed you. Um I already started kind of uh go going about it. Um, but I will walk you through how I went and uh started it is the first thing I did um after I got Claude set up with a lot of the basic stuff was the next thing is I had it do
10:50a project requirements document and that's why I go into idea browser and it gives you a product requirements document right here or product requirement document build. It's going to get give you a prompt that you could then take into bolt, lovable, replet, claude, cursor, whatever you want to do. And then you basically copy this and then you give it to Claude and um and then once it's done analyzing it, you then save it as a file within your project. So you can see here um it just outlines it all. And you may want to change things here and there, but that's how I did it. Really cool, really easy. This is super important to do because if you don't, you're not going to have any direction. You want, if you're using Claude code and you're vibe coding, you
11:35want direction. You want rules. You want parameters set up. You don't want Claude just making up code and going, "Yeah, I think this is right. Yeah, this is what you want." You want it to follow direction. And having a PRD builds out the Claude markdown file that gives it the project directions. So, um, this is super important. And I learned the hardware. I I didn't do this and my projects were all messed up. I would think that they would be going well and then Claude's off writing code for things that I didn't even ask for. So, um yeah, I think that that is super important. The PRD um and then also to core features. Uh going over core features. Um you just click on product and you see feature specs. So feature specs also gives you a prompt. You give
12:21that back to Claude. Um it comes up with the core features and then you click on it, you copy paste that as a file uh in the project and there you go. Look at that. Oh, where'd I go? Um so that was cool too. So this is really important to set up before you even write a single line of code. Um it's so important. If you don't do this, it's just you not saying you can't do it without it. It's just so much easier for people like me that have no idea what I'm doing. Uh still it's super important because I'm learning. I'm learning. I'm learning. Um, so it's got a little about me. I actually do need to change this. Can I change it? No, I don't think I can. Um, it's $19.99 a month. Well, we can go figure that out later. But this is super important to do and I highly recommend
13:06it whenever you're building something. So, we got that all set up. We are then going to be um and then maybe I'll just show it in this video is our next step is um downloading um Expo and getting it um set up as an app because we're going to be launching this on the app store right before your eyes. Um trying to figure out what was this doing again. Um I'm just going to accept it. But um another thing too which I learned was that you know work working from a I don't know what I was doing from working from a local development um and then tunneling that work um to a live site without buying a domain quite yet because I'm not 100% sure on the name um is that I tunnel to enro allows your uh
13:52work to be live. So, if I wanted to send that Enro link to a a person that I'm working on it with or someone that I want to show, um they can see it as well rather than working locally from my computer. It's like they got to be here in person um looking at the project. So, um come on Whisper F. Okay. So, um so like for example, it's a N. So, I have local host, but then I have it um I don't even know is it still tunneling to that? It could be uh but I have it set up as a nrock link and then we got this far before I decided to start with it as a web a mobile app because a web app who's going to log into the computer and pray nobody. So um web app will be second priority. Mobile app will be first going
14:38be very basic layout. Um like I said we're using the whisper flow API. They'll be able to just hit a button pray put it on their desk and pray. And we're just trying to help people take action on the things that they're praying for. We're not exactly like trying to manifest their prayer. Like we're just want to help people that are in prayer that um can get some useful guidance on the things they're praying about. This is something that I need help with. So um I'm basically building it for me, but I know a lot of other people can use help with this. Um so it's really cool. So the dashboard is just giving you kind of a basic layout like prey, actions, progress. Also too, there's going to be a feature where hey, prayers are answered. You're going to be able to check that off and um you know track your progress. So that is the
15:25basic layout. I know we were kind of everywhere with that, but I wanted to actually build this out and take the next steps. So let's go into Claude and I can just This was um Okay. All right. Boom. Okay. Let's see. Ah, it's good. All right. So, first thing I need to do is download Expo Go and then start development servers. Test on your phone. No iOS simulator needed. Okay, cool. While Cloud's doing its thing, I honestly can't remember what we were doing, but I just trust that it's going good and doing its thing. All right, so I'm going to download Expo Go and we will go from there. While that is downloading, I'm going to go back into Claude and just be straight up with Claude and ask it what in the heck is the next step. Hey Claude, I'm downloading Expo Go. What exactly is the
16:12next step again? Can you give me a prompt to give to Cloud Code to start this process if you're not using Whisper Flow? Boom. Biggest hack of 2025 for me. Not that I don't type stuff anymore. It's just so much easier when you're communicating with AI cloud code or whatever. Um, it's just nice. It's nice. All right. So, oh my god, maybe we're already doing this. Let's see. Perfect. Let me start building the React Native mobile app. I'll create a comprehensive to-do list and begin implementation. So, okay, cool. And all this goes back to building the proper PRD, which we have in here. Very cool. So, it has direction. Once you build that PRD and drop it into your folder that you're going to be working out of, you're going to want to do forward slashinit. And
16:58that's going to initialize cla to then build the claude markdown file. The cloud markdown file is like basically the instructions. So this file provides guidance to cloud code when working with code in this repository. This is pray about it, a prayer to action transformation app built on top of the Nex.js SAS starter kit. The app aims to convert prayer intentions into personalized biblical action plans for spiritual growth. You can also as you're innovating your app, you can just tell Claude, hey, update update the cloud markdown file because things change, you know. Um, we're using React Native to build this mobile app out app out now and um, Nex.js would be for the web app. Um, so yeah, I hope that makes sense. Super important and I learned that the
17:44hard way. So that's working. That's cooking. That's doing its thing. Um, this Expo Go has been downloaded and I think we have already been working on this. Let's see. Uh, so what we had to do since we started it in Nex.js, JS we actually had to build a lot of the React components within this repository because since we started as a web app first you know that's not going to transfer over into building a mobile app. So we have to build out like the whole framework on how would it how it would be to build a mobile app. So that's where the React Native comes in and how we're kind of hooking everything up. At least as far as what I know, the back end as far as like Polar, Better Off, Neon for the database, that should
18:31all work with React. I'm not sure. Um hopefully um otherwise that would suck if it didn't, but let's see. So, and then we're going to use the Open AI API to um have like the knowledge base. Um, we'll probably put some extra things in there within um, Neon um, to build out some tables for more knowledge base and to just help people, like I said, with their prayers, like actually take action on the things they're praying about. Um, I think it can be really helpful. Comment down below what you think of this idea in general. Like, you know, I I just know that a lot of people struggle um especially um believers that, you know, they they pray about things and it's like my belief that God
19:17gives you an idea. You know, you pray for things, God gives you an idea and ideas need to be taken action on. If not, then you're going to die with them in the grave and that's not good. So, ideas, ideas. So, um let's see. It's doing its thing. It's cooking. I'm going to probably just copy paste this prompt since I was working on this a few days ago and I don't really know what part we were at. So, I'm just going to copy paste this um into Claude when it's done and just say did we did we do this already? And uh you know, don't don't be in fear when you're when you're building your project. That's why I'm documenting this whole thing. That's why it's called build in public because you're going to see me make mistakes. We're going to learn together. And I just think it's super cool and going through a lot of
20:03the frustration and errors with easy flip. That that was really um challenging. That was really difficult. It was not easy. There was three times in particular where I wanted to absolutely quit and be done and move on to the other next item. But it is super fulfilling to see it alive and it works and I use it every day. And actually we've had six signups today. I just mentioned it uh in an email. Um, but they haven't paid. So, that means they created an account, but they didn't pay. So, whatever. At least there's six signups. And I'm happy. Hey, if one person pays, I'm happy. Doesn't really matter because I didn't. The reason why I built it was not to make millions of dollars. Was actually just to help me list stuff on eBay quicker. And if it does end up making a couple thousand
20:48dollar a month, amazing. Amen. That's great. Um, so yeah, I'm looking forward to like tracking that progress. Um, you know, I'd love to run ads on Facebook. Um, for now, we're just going to stick with organic since we have a lot of reach already with the school community, the email list, um, the following, and then maybe in the future, maybe by the end of the year, we have some optimized ads as well as getting better at SEO for um, people. You know, if people look up AI listister, you know, I want to be the first one in Google search. So, I think that could be worked on as well. Let's see where we at. still doing its thing. So, Claude is doing its thing. Installing dependencies. Now, let's create the progress screen and profile screen to complete the basic navigation.
21:33All right, so we're getting close. It's starting the development server for Expo. And I'd love to be able to show you guys what this looks like on my phone. All right, let me install Enro for Expo and start the server terminal server without tunnel first. All right, that took a long time. That took like probably 15 minutes of just straight work. But we did have to like go back and connect everything because we started as a web app first and we were like, "Yeah, now we're going to do a mobile app." So, I had to install a lot of dependencies and connect a lot of things. So, we'll see if it works. Great. The Expo development server is running successfully. Um, mobile app successfully created. I've successfully built a comprehensive React Native
22:18mobile app for pray about it that complements your existing Nex.js web application. Here's what we have accomplished. Um, all right. Prayer. Okay. Core features. Prayer screen. Voice recording capability. Prayer input with character counter. AI powered action plan generation. Action screen. Swipe to complete functionality. Reflection notes. Filtering by today week all. Progress screen. Streak T track tracking weekly activity charts achievement milestones. Man, I actually can't wait to use this profile screen. Um, okay, cool. Connected to existing Nex.js API. Cool. Cool. Reuses all existing endpoints. Shares the same user
23:03accounts and database. So, it's cool that people could pray within the app and then go on the web app and track progress and monitor things as well. And that can be, you know, helpful. um mobile features everything testing the app. So the Expo development server is now running on localhost 8001. So it says scan the QR code shown in the terminal. Um okay. Okay. It just says to manually enter the link. All right. Well, we got this. Pray about it. Um but I we built out features. So let me see what's going on. I see it on Expo Go, but all it says is pray about it. Is that all we built or should I be seeing more? All right,
23:48so it just said that it compiled and it bundled successfully. Maybe I need to like close the app and refresh. Try that. All right, now I get this error. Well, let's see what it's going to do. Uh, in your Expo Go, shake your device and look for any red screens. Shake my device. What? Okay. Uh, reload maybe. Um, I shook it and something happened. Um, I'm seeing a red error. It says runtime not ready. Type error. Cannot read properly. Use state of null stack anonymous at 1716441. Use autodiscocovery o service anonymous. Should I just screenshot that or is that enough information for you? I love it.
24:34This is so fun. This is so fun. I can't wait to keep building stuff and showing you that you can do this, too. That's enough information. Great, Claude. All right. So, the error is related to authentication service trying to use auto discovery incorrectly. This issue is in our off service file where we're trying to use React hook outside of a React component. Let me fix this. All right. And of course, it's compacting conversation. While it's doing its thing, I just want to let you know we have some amazing news. We just got our first paying customer with easyflip.ai. Thank you, Carrie. You're our first customer. I hope you enjoy. So, that's awesome. I just wanted to keep you up to date and I'll I'll make updates um in it in as we more, you know, market it to the masses. But, um like I said, I just
25:20sent out an email to our email list of 3,000 people, other resellers that, you know, list on eBay. And um so that video came out uh 4 hours ago and then the email went out 2 hours ago. So, we got our first customer. That's cool. I like it. and um just want to keep you up to date. So, what the heck is Claude doing? Is Claude taking a break? Sometimes lately, this last week, you you had to keep on track with Claude cuz um I just noticed the the the degradation in the code. And not that I'm super experienced is that it was working really good up until like a week or two ago. Maybe you've noticed um sometimes Claude would like go off and start writing code on some things that I never even asked for or it would completely forget the
26:05context of what we were trying to do and I'm like wow this is insane Claude what is going on are you okay? Um, so sometimes you got to check up on old Claude. Today it's been working really well. But boy, during that last stretch of building out easy flip, um, it was getting really confused easily, which was really annoying because I don't have a ton of experience, so it's hard for me to keep on track. And then I saw other people on X were posting that, you know, it just wasn't working as as it should or as it had been um, the last few weeks. Maybe you've noticed something similar. Um, so yeah, it's doing its thing. It's restarting the the server and clearing the cache and we'll see how that goes. There's another thing that I want to mention that overcoming these
26:50problems that you may face when building out these projects is having good logging. So when things, you know, break, you have good logging so you could debug errors properly and um also feeding that um the the console logs, the server side logs back into cloud, not claude code, so you can actually like understand what's going on. So you can make sure cloud code's doing the right thing uh to fix the issue. But having good logging is going to help um overcome a lot of the issues that break and things you know mess up. Um having good logging to figure out you know um API routes and token exchanges not working and um you know things like that. So that's been really helpful um building out that uh this project. So um
27:37restarted the server, rebuilding the cache. Oh my goodness. Let's see. Fixed. The React hook in the mobile app has been resolved. The issue was mobile app services off where use auto discovery was being called outside of the React component context. All right. So, let me reload this. Oh my goodness, y'all. We got it. I Let me screen record this. All right. Just going through the app, seeing if it works. Wh Oh my goodness. I just messed everything up. Okay, cool. um progress profile. Okay, obviously some buttons need to be fixed, but um guide me in career decisions. I don't know if we even have uh open AI uh API connected
28:23yet, but at least we got some good um framework on what it looks like. It looks like the buttons are a little bit messed up. Um but pretty cool. Pretty cool. At least we have something to start with. And this is what we're going to be working on over the next few days. um showing you the progress and I'm hoping that this would be completed within a week or less and then we'll jump into the next project. That's all we're going to be doing is building apps, come coming up with the idea, validating the idea with our idea browser and building it. And I hope that that provides you some value because I know you got an idea right now and you're just wondering how do I build this thing? Well, reach out if you have questions. I'll try to help my best. But that's what this is going to be all on this channel is building apps with AI. I
29:10hope you guys have a blessed rest of the day and we'll see you in the next one.
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





