From the course: Replit 101: From Prompt to Product

Testing and iterating - Replit Tutorial

From the course: Replit 101: From Prompt to Product

Testing and iterating

What we have now is a functioning, high-fidelity prototype. And I point this out because when Repl.it and other vibe-coding platforms build apps like this, it feels to us as if the apps are done because they look done, but this is just the beginning of the process. We've saved a ton of time by not having to wire everything together and just get it to work, but Repl.it has also made a bunch of decisions by applying standard templates, and we have no guarantee that things are actually working the way we intended. So the next step is to test and iterate to make sure everything is working properly. In the app window, I can see the preview of the app on the right and the chat on the left. And in the chat, it actually shows me some next steps I can take to make sure everything is working properly. It says, try the app. The default admin password is admin123. And then it suggests I try to create a new talk and do some other stuff. So let's do this in reverse. First, let's just see how the actual application works. So go in to the talk. Here we have a talk. There's a question down here. There's an answered question. So these buttons work. I can probably vote. Oh, I already voted on this one. I can vote on this one, I guess. Yes. And under answered, I can't vote for that one. The recent ones I've already voted on. Let's see if I can ask a question. So I'll say, my name is Morten, can I ask a question? And click Post Question. There it is. If I switch to Recent, it appears at the top. I can vote on it. And once I have, I can't re-vote on the question. OK, good. Next up, I want to go into the Admin panel. So let's see. I need to use this password here, admin123. So I'll click on Admin up here in the corner, put in the password, click Access Dashboard. Now I get a new button, Create New Talk down here. And up here, oh, interesting. See here, I can't log out again. This is a typical omission that you see a lot of when you do these things, and that's why it's important to test everything. So let's see if I can get the agent to quickly fix that issue. Instead of using the full-blown agent to do this, which is very expensive for a very small fix, I'm going to switch the mode here. If you look closely, you'll see there's this Fast button. If you click on that button and activate the Fast mode, you get lightweight changes. If you want to see what that actually means, you can click on the Settings button, and you get a breakdown that says Fast is lightweight, changes quickly. Autonomous, which is the default setting, allows the agent to work autonomously. And here you can change the levels of work. So you have low, where it's just generating and executing on a task list. Medium, where it also reviews the code changes and fixes issues. High, which expands review scope to the entire app. And if you want to, you can activate max. This turns the entire thing into a completely automated system that just does everything on its own. I wouldn't recommend doing that. But you'll also notice I activated app testing down here. so that it always checks to make sure it's doing things correctly. That's not relevant here though, because I want to use the fast option. Then I'll simply say, when logged in as admin, I don't have a log out button. It just says admin mode active. Send off that request, the agent goes back to work, looks at the code, looks at my prompt, and tries to fix the problem. And as before, if you wanna see what it's actually doing, you can open here and take a look at how it's working through the different things. So it's opening the different routes, it's opening files and trying to run scripts to see what happens when it does those things. And eventually it'll come up with a solution and we'll see that solution take place in the preview. Okay, the agent says it's done. I've added a logout button for admins on both the homepage and individual talk pages. Does admin logout work as expected? Let's take a look. We'll click on admin, put in the password again, access dashboard. Now there's a logout button here. So if I click on that, I'm logged out. Let's go into a single page. There's no log in button here, but maybe if I go to admin, log back in again, and then go to the talk page. I don't have, oh, there it is, log out admin. So the user experience isn't the same. And if I wanted to, I can now go in and tell the agent, hey, you also have to fix this user experience, but for our purposes, I'll just leave it the way it is.

Contents