Building an app on cursor with my voice with da...
TIKTOK

Building an app on cursor with my voice with database, authentication (google sign in), and the abiltily to add posts. Using my nextjs template

6:58 Jun 08, 2025 346,200 17,800
@rileybrown.ai
1265 words
This right here is the best AI-powered coding tool in the world. And you, without any coding experience, can build basically any app that you want. So, Cursor is right here. Let's go over these five steps. We're going to build an app right now. First thing that you're going to do on a new Cursor window, you're just going to press Clone Repo. And this is going to pop up. You're going to type exactly this. Trust me, bro, it works. Press Enter, Enter, Enter. Now we have a new template set up, ready to build. You're going to press Command-I. And then make sure that you use Agent Mode. So, this right here is Composer, the most powerful AI coding tool in the world, within the best AI coding platform in the world. And you're going to be using Agent Mode. One of the key steps here is to use voice-to-text. I use this voice-to-text app. It's called Whisper Flow. It allows me to just use my voice to talk to Cursor Composer, which is why people are calling it Vibe Coding. And all we do is we're going to hold this button right here. I want you to create an app that looks exactly like Twitter. And don't worry about the database and authentication right now. What I want you to do is recreate the interface perfectly. Use little icons or little profile pictures somehow for each character. I want my account to be Riley Brown. And then make other billionaires the other accounts, please. So, we're just creating the foundation to our app, the design, and we're just going to press Enter. And now, the agent is going to build this app. Now, the agent is writing code, modifying the code base. Here are all the files in the code base. And you can think of any software out there has a set of files that do things. And this AI model is just basically writing all the code for all those files right now. See, it's creating, removing things. It's automatically installing packages. If we want to see more about it, we can pop out the terminal. But you don't need to worry about that. You just let it do its thing. All right, so now it's done generating the code. But I actually want to see it. Please run this locally. This basically is just going to run it locally on your computer so you can actually see the interface. And one thing that you need to do is you need to make sure that you're using YOLO mode. And that means it's not going to ask for your input. It's just going to automatically run your terminal commands. If you don't know what that means, don't worry. All we've done is run two prompts. One said we want Twitter. The second one is to run it locally, which is going to do this right here. And now it says it's running on localhost. And when it says that, it's going to display this little link right here. You're going to press Command, click. Now, this is going to open up our app. If we have any errors, do not worry. See? All we're going to do is we're going to copy the error, copy this, go back to cursor. And we are going to paste it in. And we're going to say, I want you to fix this error right now, young man. And we're going to run it. And it ran it again. And so anytime you get one of these links, now just hit Command, click on localhost 3001. And let's see. Boom. There is our Twitter app. As you can see here, it's me, Elon Musk, and Mark Zuckerberg. I am going to simply, what I'm going to do is screenshot this. So we're going to take a screenshot. We're going to go back to cursor. And we're going to drag this in here. And then we're going to talk to our AI agent. Young man, you forgot to add the, you see how there's errors right now for the profile pictures? Also, where's Jeff Bezos and Warren Buffett? Okay. It's now done. Let's go ahead and hit Command, click. And it's going to open this back up. Ooh, look at that. So here we are with Jeff Bezos, Warren Buffett, Elon Musk, and Mark Zuckerberg. But what if we actually want to make it a real app? All we have to do is go to Google Firebase and create a project. And we just need to copy these keys. Don't show anyone these keys. I'm going to delete this project after this video. Keep these private. Now we're going to go back to cursor. And we are going to just paste these keys in here. All right. I created a new project on Google Firebase. And I want this data to be stored. And so remove all of the placeholder people you have, like my comments and stuff. And I want to actually be able to sign in and add posts and sign in with Google. And this template is pre-built to have sign in easily set up. So please do that properly. And so that's what we do. We're just going to press Enter. Within Google Firebase, all you need to do is basically just enable authentication and enable Google. And so you want to make sure that this is enabled. And then whatever email you set up the account with, you can just save that. And boom, we're good to go. All right. Here it says it is done. Let's go ahead and press Accept. So we actually just need to refresh our local host. So we'll refresh it. And there we go. We have the app right here. And so it says no one's tweeted yet. Sign in with Google to post. Okay. So I'll click on this. All right. Let's sign in with my email. We'll hit Continue. And we get an error. All right. Copy this error. Copy. Go back to Cursor. And we'll just paste in the error. After signing in with Google, I got this error. Please fix. Okay. It looks like it's done. And would you look at that? It now has my profile picture that is connected to Google as the main thing. So I can say, hello. And we can post it. Boom. It shows up right here. But, like, where is this being stored? Let's go see. If we go to our Google Firebase and we go to Storage and we go to Firestore Database, we can see that we have one tweet in here from Riley Brown that says, hello. Unfortunately, if we click Profile, nothing happens. All good. Let's go to Cursor. When I go to the Profile page, right now, there's nothing there. Please allow me to edit my bio, the link for my account, and then have a new field there for goals and aspirations. We'll maybe make this a productive Twitter. All right. Let's try this. Do-do-do-do-do. All right. It's done. Let's hit Accept. We'll go back to our app. Let's hit Profile. And boom. We can now edit this. Tell us about yourself. I'm a Senior Vibe Coder, which means I can create whatever app that I want. Now we can press Save. Nice. And I can put the link to my community that has about 10,000 members. And my goal, obviously, is to build the best community. And if you want to learn more, press Comment.

No AI insights yet

Save videos. Search everything.

Build your personal library of inspiration. Find any quote, hook, or idea in seconds.

Create Free Account No credit card required
Original