How I Built My First App Using Replit Agent

Hey, what's up? What's up? My name is Shamsadine Hakeem, and this video is my first video for the repl.it buildathon that's going on now. And what I'm gonna do is just introduce to you the app I'm building, the reason why I'm building it, what it's called, and a little bit of what it's done. Now, I did record a previous video, but I didn't. And I didn't have the sound with it because I used the wrong program to record the sound. So that was a mistake on my part. So I'm going to play that video, but I'm also explaining to you what's going on in the video and go through that video a little bit faster than I would playing the whole thing with the sound. But what I mainly want to do, like I said, show you where I came from, the tools I'm using, and show you the initial build, the foundation that I built, and then after this, in videos 2 through 11, because I'm my goal is to post one each day, taking you along the journey of building this app that I'm building. I'm going to show you, starting with the bug fixes that I need, improving features, and adding new features that I need inside of the app before it's ready for launch. So it's going to be from February 1st all the way to February 11th. Just take you along this journey so you could get the idea of exactly how it works when you're building an app inside of Replit. So let's just get to it now. The reason why I built this app and the app that I built is called Roxy. And Roxy is a coaching app that coaches you through dating. So to keep it real simple, the way that I'm promoting the app right now is calling it, is promoting it as a dating app, and I'll show you exactly what it does in a second. And the reason why I built this app is because I've done over 25 years of relationship coaching, and I realized something about people is that they keep making the same mistakes and they get stuck in the pattern to where they can't break out of this pattern. And I call this a pattern loop. For an example, you can have somebody who's a chaser, who's always pursuing unavailable people, or somebody that's a fortress who pushes everyone away, or somebody who's a fixer who dates projects instead of partners. And there are seven pattern loops that the app is going to coach you through is going to identify and then coach you through. And with these pattern loops, it's always the same cycle, but different faces. And the reason why I call them pattern loops is pretty much because of what it says. You get stuck in a loop where you keep doing this, you keep dating the same people and you never break out of it. So the Hill app helps you to break out of that by first showing you how to know exactly who you are, then providing coaching based on who you are, then identifying the needs of what you need first and then what you want in a partner, and then letting you know if you're able to actually provide those needs for them while maintaining your own needs and your own identity. So like I said, I did over 25 years of coaching and this is some of the things that I recognize. But with AI, it diagnoses your pattern loops in 15 minutes and then coaches you through breaking it. And it doesn't give you generic advice like a lot of these coaching apps that I've used do. It gives you very specific advice based on your pattern and your specific healing path that you would have to take based on who you are. So with that being said, what I have up here is like my actual website. Now I built this with Replit as well. It's called Intact Life and I'm just using that as a placeholder right now. But I'll get back to that. But let me just give you just a preview of how I actually put things together and how I come up with things and where I actually start at. So I first want to start with the user flow inside of Roxy. And as you can see right here we have the user opens the app, then they're going to sign up and to sign up and login is going to be stored inside the Supabase and that's going to provide the authentication as well. And then they're going to take the 12 question intact assessment. Then we're going to take them to the results screen where they're going to see their life mode and get a badge, a pattern loop with the explanation and then their five pillar score and then in a visual format. Then after that they can have the option to talk to Roxy, which is the AI chat portion of it, and the user can ask any question at once and Roxy is going to respond with personalized coaching and it's going to be very context aware and it's going to know exactly what your results are from this 12 question assessment that you took and these results right here. And that's what it's going to coach you based on what you need to break, what you need to keep doing did. I also wanted to have the profile set up for photos and prompts and then I want them to be able to see their matches, the compatibility base matches and able to connect and message with them because it's not a dating app unless you have matches you can see photos you can see and get able to message with them. So one of the things I do before I get started, after I know my user flow is I want to start creating the prompt that I want. But before I create the prompt, I want to know exactly what REPLIT is going to be able to do. So right here I put, you know, I need to understand what's possible before we build. I'm entering the Replit mobile buildathon deadline February 13th and want to add an AI chat feature to my dating app. So I'm being very specific in what I want to build and asking and stating I need to know what's possible because I don't want to build something that or build features into it and Repl is not able to do it. So I said, I give the problem constructor. I'm saying, look, what I have is a 12 question assessment and that calculates all of these things right here. And it's a user assessment results stored in Supabase. So once they take the assessment that's going to be stored in Supabase. So this is going to let Replit know is that with this user I need to pull from your Supabase you know, database in order to identify exactly what the results are and match it to that user. And then it's also going to pull from the Claude API key that's ready to use. So now I get a little bit more specific about what I want to build an AI chat feature called Talk to Roxy where users can have a conversation with an AI coach after completing their assessment. The AI should know the user's assessment results, respond as Roxy, give personalized advice based on their specific pattern and have a chat interface and I give context a little bit more, letting it know what's it similar to. And I put Delphi, Brenda AI and Character AI. The reason why I use all three of those because each one of these have different components I want Deli has the AI clone platform for coaches. Brendan Brashard's AI coach is a little bit different. And then Character AI has that conversational AI one my AI voice to have. And here's more specific questions that I want to ask replit like can Replit build this type of conversational AI chat using Clause API. How would we pass the user's assessment data to Claude for context? And. And how long would this take to build? And what's the simplest MVP version we could ship in one to two weeks, which. It takes less time than that. And I'm going to show you how much time it actually takes. And then I say, please assess feasibility before we start building. So I don't want it to build anything until I know exactly what we can do. And that brings me over here, where this is what I recorded first for my initial build. Now, before I play this and just walk you through what's going on, I'm gonna point out a couple things. One, I use Claude and I use replit. Now, with Claude, I don't use the free plan or the $20 plan, but I actually use their max plan. Now, I don't know if they give you extra. Now they do give you extra perks as far as having more agent usage. And that's very valuable when you're building apps like this, especially with the complexity of the app that I'm building right here is that you want to have the maximum amount of agent usage so that you can complete the task, not worry about running out of agent usage. And I'm going to show you why in a moment. And then the second thing is, is that I use Opus 4.5 because it's a lot better at code and a lot better at understanding more tasks. I don't use Sonnet 4.5 that much. It's really good, Trust me, it's really, really good. When I first started, you know, building out, because the whole thing with this and the 25 years of coaching, it came. A lot of what's here came from the books that I've written about my framework. And I use Chat GPT at first to really help me break down my book, but it wasn't giving me the depth and the understanding that I would get, like, with actual coaching clients. So I switched to Claude when I met an individual and they told me, like, look, you should try Claude out. It built my whole website in a matter of, you know, five minutes. I was like, I don't want to do that. But I ended up doing it and I loved it ever since. And I plugged some of my book into it and it started breaking it down even more than the research I had already did in Chat gbt. It added it to that and say, no, we could do this better, we could keep that, we could scrap this. We could do that. And, and then after like probably about three days, I had the whole thing refined and that's what's inside of the app now. So over here in Replit, I want to point out a couple of things. Up here it says Claude MCP and all of these tabs that's in the yellow, that's what Claude can actually pull up in this three tab group and search these and actually do things like Claude actually pasted this prompt right here and inside of Replica. I didn't have to do that. So the prompt is build rocks and AI powered dating coach iOS app. This is not a swipe app. It's a psychology based dating coach that helps users break their relationship patterns. And it goes through the core features, the onboarding assessment, yada, yada, yada. We just went through that. So let me push play and show you some of what Claude does and exactly what Replit does. And I'm gonna just fast forward a little bit because right here all it's doing is Claude is just monitoring exactly what Replit does. Like you see the three prompts you could, I know you've read by now. And then now it's typing out, is progressing. Look at the build log one. I'll build Roxy and AI powered Dating Coach. So it's pretty much monitoring it. And this is a very powerful feature. For one, you can have multiple eyes on it, your eyes and claws eyes. So if Claude misses something, which it normally doesn't, but it'll point out things that you may have missed and it'll help you to identify things. So normally what I'm doing is I'm down here in the reply or I have like my little notepad pulled up and I'm taking notes of the things that I'm seeing. Or sometimes I work on a whole completely different task and come and review the notes afterwards. But let me fast forward a little bit, show y' all some more what it's doing. Still working. I can see it says press, publish. Keep going. And look at that right there, it says still building. Five minutes in creating multiple files. And one of the things right here that I like is that it works on all of these actions at one time. So keep going. Build and publish Mobile app. Mobile app. Six minutes in, still building. Seven minutes. I count 10 file icons and then right there it says massive progress. Look at what's happening. I'll build Roxy now. Generate all visual assets now I'll build all the screens, components, navigation, and that's what we have right here. That Ripple has built all of these things that it built. Break the pattern, build real connection. Now this is what it looked like with the initial build. I just got all of the core features and Replit actually gave me an assessment with 12 questions that was actually pretty decent. I didn't use that assessment. But after I got all the core features, all of the matching, you know, and stuff like that, and let Replit build the core, that's when I went back in and started adding the features that I had on my website. And I will show you two things real quick. Let me first show you my website. I have two websites I built with Replit that are just awesome. This is the dating website, not just to match a real connection. What makes Roxy different Pattern loop discovery, life mode matching, personalized insights. 5 Pillar Balance your journey to real connection. Take the assessment, get matched, build something real. And that's exactly what I had showed you that we want the user on flow to be. So let's sign in real quick and let me show you how the actual web app looks just to give you a little bit of idea of what I'm shooting for compared to what they gave me. So this right here, let me see that view profile. Not that that's where the settings are view. So this is kind of like how I want the home of the app to look. Of course it's going to have to tweak it so it could look better on the on the app. But different things like music, love, language, values, future goals, journey, where it gives you your life mode and your pattern, Life, balance, compatibility and moments. All right, and you edit my profile. Take you back to that. Go back there. I like this right here. But one of the bugs, I'm not going to go into it now. Is it showing me men and women when I'm just looking for men. Now the messaging, this is what I kind of like to click on, the messaging. And that's how it is on the web version. Now go over here. One of the things that's the key for this is matches. Go to the matches and this is kind of like what I want some of the data of the matches to have and where it has a highly compatible match. 90 plus match score, great matches at 80 to 89 match score and some that are worth exploring. These are ones that are a lot lower. That's not really there where you really wanted to be. It's normally in the 70s and 60s. But I don't think I'm gonna explore anybody in the 60 you got. Hey, they might have a little bit too many Issues I don't want to deal with. Yeah, see, somebody in 60 that's healing, I'm not even going to holla at them. They, they, they, I' ma ghost them. But somebody that's ready, somebody that's healing right here, but they're 88. That means they're doing a lot of work in other areas. I won't go too much into that, but that's kind of like some of the stuff that I want on the app. And I may keep some of that color scheme. I don't know yet. But here's my results. This is how the assessment should look on the app. Once we do it, it should give me my full report with all of this right here, telling me my life, my dating mode, my pattern loop, my dating mode is ready. My pillar, the visual pillar right there. And then the snapshot, and then who I need the intact journey. And then also, this is very important. I want to be able to have people to purchase the assessment and go to Stripe. And that feature right there, that strike feature inside of Replit, man, that is a beautiful feature. When I set that up, I didn't even have to do nothing next to nothing and set it up in, like, probably like five minutes by itself. But that's an awesome feature. Then also the option to download their report. You see, bam, hit download and go to files. It'll pull it up. You can pull up the report. And there you go. There's the report. Now I'm showing y' all this. Pull up the report. Right? Well, I already had that report saved, so I could probably find it for you real quick. Let me see if I can. Yeah, I know where it's saved at. Right? Here's the report. Full page, six pages, your results. I ain't get too fancy. Just kept the same color scheme. So these are all the things that I'm wanting inside of the app. And like, where is that? Continue to dashboard. So we click that and it continues to dashboard. All right. Now, an example of the assessment I'm wanting, that replit already built is right here. I want the assessment to kind of flow like this. And then I'm not going to go through this because I don't been through this assessment probably like 500 times. And quite frankly, I just don't want to take it anymore. So that's like really what the foundation is. But what I'm trying, what I want to take the foundation and use for my websites to implement into here. And that's what the goal is next is to go from here to those things I showed you on my website. Now, I've already recorded this one video right here where this is how the app now looks and this is what I'm going to take you through in the next video. Let me just show you a little bit of what it does. Right here is the assessment and the flow and stuff. But these are the results right here. Like this don't look nothing like the other results. It's really good results, but it's very brief and it's not what I want the user to actually have. So I'mma test this out but also I'mma test out the over delivering with the full PDF results as well. I want them to be able to have a download, leak or link to re to get back and do their results as well. Let me show you some more things. Matching right there. Get it to a good place. There's one of the matches. Love language, all of that stuff. Compatibility, score, another match. And those are other features. I'm gonna go over setting up your profile. Yeah, all of this is going to be in the next video. Okay, here's what I want right here. These are how all of the matches look. But if you see how those matches look and you compare it to the matches. Let me pull this up again. Over here. Hit the matches. I like the way these matches look a lot better. I don't necessarily want the dark mode, but I could do a dark mode and the light mode. But I want kind of like to see if we could get more of this on there and really push Replic to his limits and see how we can actually do that. All right, so we have a lot of things that we're going to be working on over these next few days to fix out the bugs and really get this product ready for the final shipment and enter it into the buildathon. And I hope you continue to join join me on this journey and become one of the testers of the app and give me your honest feedback on things as we update features as we go through things so that I can know what to implement. I also have other testers that I've invited as well. I have a couple ambassadors that I've. Real quick before I ended, I've been doing Tick Tock live, showing up on different people's channels and the assessment that you see, I take them through an actual live coaching assessment and it gives them the results and it's been transforming people's lives. I've been doing that since September and people have really gained a lot from it, which is another reason why I'm pushing to have the have a dating app, because people are actually asking me for that. They're like, look, can I get a dating app for this? So I could use this inside of a dating app? Do you think you could create that? I was like, you know, I like the challenge, so let me go ahead and do that and see if I can actually do it. And I did. And now Facebook has their AI Assistant inside of their Facebook dating. And it's okay. I'm not going to say too much about it, but it is a concept that is out there in the market now that Facebook is, like, really pushing a little bit, but not as much. So that's really all for now. And y', all, like I said, join me for this adventure. Over the next 11 days, I'm gonna have different videos and showing y' all just the journey of fixing some of these features. In video number two, I'm gonna go through all of the bug fixes that we have right now. And in video number three, we're gonna start building out some more of the features to bring everything together and really polish the app. This is your boy, Shamsadine Hakeem, signing off. Y' all have a wonderful day.