Loading summary
Transcript1 lines
- [00:00]
A
I saw that Codex launch sites and when I first saw the news, I was like, is this is just a worse version of replit or lovable that's just inside Codex. But the more I dug into it, the more I realized it's actually worth understanding how to use it and how to get the most out of it. So today is a full tutorial on basically what the big announcement is around Codex Sites. How does it compare to the competition? We're actually going to go and live build using Codex Sites. And through that, I'm actually going to teach you basically the best practices for using Codex sites. So by the end of this episode, if you stick around, I'm going to teach you how to build, how to build a shell using Codex Sites, how to add memory using Codex Sites, how to add what's called safe actions using Codex site sites. And I'll explain what that means in the episode. How to create skills with Codex Sites, how to save gate using Codex sites, and how to prove the loop using Codex Sites, which makes it work autonomously. Let's get into it. So what is the difference between codec sites and replit and lovable and stuff like that? So I will say replit and lovable. And those products are really good if you want to like one prompt something. And it has an editor, it has a database, it has server, it has hosting. A lot of them have connections to domains as well too. Like you can just register a domain within it. So that's really amazing. But Codex sites, if you live in Codex and, and I'm starting to live in Codex, I mean, I think it was about a month ago I had Riley Brown on the podcast and I basically said like, hey, convince me to use Codex. I'm in the anthropic ecosystem. Convince me to use Codex. And now I will say it's a part of my daily driver. Yes, I still live in the anthropic ecosystem, but I'm also using Codex. And I think that if you are in Codex and you are putting just all your context there, what's really cool about Codex Sites is you can actually use that to go and build your ideas, your apps and stuff like that. And what's the coolest part about Codex Sites is it updates your, your app autonomously. So what does that mean? It means that you can have it basically create a personal website, say, and, you know, and let's like, for example, go to my personal website. This is a static. This is a static website. So I actually have to go in and. And basically, you know, 100, 158,000 people enjoy reading my newsletter. But like when it becomes 160,000 I have to go and update it. But with Codex sites you can actually have it. So it automatically updates these things. It automatically creates, for example, guides based on my content. It automatically, you know, adds the different companies I work on. So it basically is this whole idea around autonomous product building. I've talked about this on the podcast before, but the idea around you're going to have in the future and the future is now the present. Basically agents going and updating products autonomously. But the thing is, it is missing auth, it's missing databases, it's missing payments, it's missing email sending, it's missing analytics and it's missing a vault for secrets. So a lot, you know, if you want something more simple, everything is in there. You're going to want to use something like rapid or lovable. But if you understand a little bit about auth, if you understand a little bit about database, payments, stuff like that, and you live in the Codex ecosystem and you are really interested in this whole idea around autonomous apps. Codex sites are really, really, really cool. And I also say one thing today you can't publish these websites, at least not to my knowledge. You can't publish these websites on your own domain and go and deploy it publicly. These are internal apps that you can share with your team right now. But obviously that's going to change very, very, very, very, very soon. So let's get right into it. So I, I was thinking that we can create a startup ideas os. So basically a live board with columns, inbox, researching, validating, building and killed startup ideas. And each card can have an idea buyer, pain proof, next step and score. So this is something that you know, could be an internal, internal tool that I would use and we're going to basically try to build it in six prompts and like I said, as I build it I'm going to share sort of the big takeaway. So the first, first thing we're going to do, let's go open Codex. So I created a new project here, I opened a new chat and you know, the first thing is, you know, if you want to actually use Sites, you have to invoke it at sites. So it works basically as a plugin. So I said build a startup os, I'm going to go ahead and send it. And yeah, it works as a plugin. You invoke it there and like I said, not everyone has access to it, but I would imagine that access is probably coming really soon for Plus People. And by the way, I have no affiliation with OpenAI. I just think this is a really interesting product and I wouldn't be making this episode if I didn't think that you can get a lot of value from it too. So what is the insight I have for you about this particular prompt is that, you know. Well, there's a few things. Yeah, invoke. The way to get it going is you want to invoke sites. You want to actually ask it to use realistic sample data. You also want to save it for review. So I noticed that sometimes when I prompt it an idea, it'll just try to deploy it. So a really good tip is to save for review, do not deploy. And this basically unlocks building a real product service, not a homepage. So basically what I'm trying to do by building this is to build that whole idea around autonomously, being able to edit it and work on it, because that's sort of, sort of the dream state for me. So let's go ahead and go back to Codex. Okay. While that is being worked on, I just wanted to say that if you, if you go to the plugin section over here, so you click plugins, there's a bunch of plugins that are going to help you make your sites a lot better. Right? So, you know, a lot of people aren't using these plugins, but think about, like Figma, think about canva, think about hey Gen for Avatar videos, think about Remotion. These are a bunch of plugins that could make your ideas for your sites a lot more interactive, a lot more. A lot more interesting. Another really interesting one that's underrated, I think, is Game Studio. So, you know, one of the biggest problems that people have with vibe coding and agentic engineering is they build something and no one, no one's, no one's going to it. Well, you know, if you build games, for example, that actually generate buzz around what you're. The bigger, you know, the product you're building, that's a way to get attention and then you bring those people into your core, your core product. Now, of course, that needs to make sense for whatever it is you're building. And this works better with consumer apps, right? So you go and create a, you know, a paperboy competitor that's fun to play, that you can kind of like newsjack based on a particular news topic and then you bring those people into, you know, whatever your core experience is. Maybe it's an email newsletter or who knows? But the point is, like, I think a Lot of people are sleeping on this idea that you can go and create little apps that could bring them into the core experience. All right, so it's built the board, I think it looks pretty, pretty clean. Get the inbox over here. Researching validated building kill. Definitely not the most beautiful, but clean, minimalistic, good enough for a first version. So let's go back and keep going. So how do we add memory? Right, because on Codex sites it's not going to add memory without us basically getting it to prompt it. So let's go ahead and go back into Codex. I'm copying this prompt. So I say add persistent storage. So ideas, save between visits, stay saved between visits. Before coding, show me the data model and which records action the app needs. And this is by the way, these prompts are similar prompts that you can use for when you're using Codex sites. So it says I'll use the site's building guidance here because this is a hosted app with storage. Since you asked for the model first, I'm going to inspect the existing schema and then lay out the proposed records and mutations before touching code. So it says it's actually going to use Cloudflare. Right. I'll use Cloudflare D1 as the durable store with one main record type ideas. This already matches the project's current direction and OpenAI has D1DB data model. So then it goes. And if you, if you see here it says the record the apps need. So it says it needs an idea 1 one card on the board. It's, it stores the full card content, the current column, it needs the owner email and then these are the actions that the app needs. List ideas, add idea, update idea, move idea, scoring the idea, archive the idea ensure seeded. And then it says I'll wait for your go ahead before coding the persistent pass. So this is the whole idea of safe actions, which are, you know. Well, before I get into that, why add memory? Well, because we need for this to be a productive piece of software. We needed to remember things, right? So we want to make sure that we've got that in there. But the whole idea around safe actions is going to be, it's an unlock because we can be in other chats and because we live in Codex, we can basically say, hey, maybe I'm ping ponging with Codex. And then it hits me back with a, an idea startup idea and I'm like, oh, this is really good. Let me just, let me just add. So let me just at add idea and it'll directly add it to the application which is so cool. So you're going to want to create safe actions because you know in order to get the most in order to get the most out of it. So I'm just going to go ahead and copy that prompt. Create safe actions for add idea, update idea and the reason it's important to that I, you know I said show me the data model in which record and actions the app needs is you might not know what safe actions to create so you might as well ask Codex and it'll give it to you right there. So for people, non technical people especially like that you might not know your safe actions are you just ask Codex what they should be. So it says I'll use the site's building workflow again since this is a worker D1 surface I'm going to inspect the current action routing and tighten into an explicit safe action boundary. So the agent can only call named mutations rather than the arbitrary SQL. So you're starting to see that codecs it does feel a little more technical than your lovable or your replit or your bolt but if you can stay with it the output I think is super, super valuable. Like the idea that you can have it self self update the the idea that you're in Codex and you can bring in all this stuff from Codex the idea that you can go into the plugins and just use all this stuff from the get go. Like these are some of the, I mean fal, AI and image generation like so much stuff hugging face. These are all open source models. Like it's all built in from the get go. It's pretty sweet. So that's completed. So the next thing we're going to want to do is create a skill. So we're going to copy this here so that the chats, our future chats are going to know how to use this app. So create a codec skill called Startup Ideas Admin. It should explain how to read the board, how to add ideas, how to move cards, how to score ideas and include five example commands. This is something that I think that is, you know I started seeing people use Codex sites and they're not using skills. And I'm like this is one of the greatest parts of Codex Sites is the ability to create these skills. So you might as well, might as well start adding some skills to get the most out of your application. So it says I'll use the skill creator guidance for this. Since you're asking for a new Codex skill, I'm going to read the skill instructions and create startup ideas admin in your local skill directories with the board action workflow and example commands. The skill name is already valid and the scope is clear operational guidance for this board and its safe actions. So it's gone ahead and created the codec skill. It's done everything we've asked for. Reading the board, adding ideas, updating cards, moving cards, scoring ideas, archiving ideas, five example commands and it says validation pass. The skill is valid. It's going to be helpful for you to actually save gates. What do I mean by that? I mean, you know, the way I think about it is like a video game, right? Like you have like checkpoints as you go through a video game and sometimes it'll auto save and you're happy it auto saved. But the thing with Codex is it doesn't autosave. So it's helpful to go in there and just say like hey, just do a checkpoint here before a live URL. So let's go ahead and go back into Codex and I'll say save this as v1 review, do not deploy, confirm build status, storage choice, access setting and the exact version I should review. And I'll include, by the way, all these prompts I'll include in this show notes in the description for people to download so that they can go ahead and and as they're building codec sites they can go and use some of this stuff. So it says I'll use the site's hosting workflow for the save only review session. I'm going to validate the current build, confirm the storage access config, commit the latest safe action changes and then save a site's version without deploying. There you go. So prompt is done, it's saved for review, it isn't deployed, the build status is passed, the storage Choice is still D1. The Access setting is custom. One thing to note here is at the top right, you can see like your whole environment here. So you can see all the different changes you made. You can see if you're working on locally or you're connected to Codex web here I'm connected to the main branch and so it's just all up here on your top right. The last prompt I want to do is the whole proving the loop process. So what I'm going to do is I'm going to grab this prompt right here and I'm going to say in a new chat important, important that it's in a new chat. Use startup ideas admin to add. Here's a startup idea AI agent SEO grader for local businesses. Put it in an inbox with a first pass score and the next step and let's see if it actually can do that. Does it open up a new chat or do we actually have to go and open up a new chat? Let's see. It says I'll treat this as two pieces, use the new startup ideas admin skill instructions and create a fresh chat thread to do the actual board update. There. Yes, I'm loading the skill and finding the thread creation tool. Now the skill says to only use. Oh look, it's gone and opened. It's gone and created the chat. I can open it right here. So it says I'm using the skill. I'm going to find out how the local app is meant to run. I'm going to read the board, I'm going to add the inbox card and the safe action and verify by reading again exactly what I wanted to do. The project is clean and looks like a next style app with a worker and a verifiable script. I'm checking the API implementation now so I can call the same local service the app expects. The app Expo exposes exactly the safe route the skill expects. Yeah, so this is doing exactly what I want it to be doing. And let's see if it works. All right, so the prompt is done. It says done using only the Safe Board API, which is what we wanted in the action layer. There's no raw SQL SQL, no generic database rights and no deployment. It's gone and did it. It went really, really fast. So now I'm going to say can you publish Now I'm going to say can you publish website and see what happens. So it's gone ahead and deployed it. You'll notice that it's this crazy URL and that's a downside of Codex sites at the moment. I think this is going to change. That's my prediction. It's going to change hopefully soon, whether you're going to be able to have custom domains. But I can go and open it in Codex browser on the right here. It's got auth built in here. I do have to sign up, so let me go ahead and sign up. So as you can see, this is exactly what we wanted. We've got the inbox, the researching, the validated. If I make it bigger here, I can see more the building, the killed and it's got everything I've asked for right now if I want a new idea, I can go and actually create a new idea. Or again, I can use a safe action to go and do it. Or I can have it run an automation every week to automatically add to this board. So we've seen that you can actually do that. I can go more in depth in a future video if people are interested in how to do automations and cron jobs and stuff like that. But you can basically just, you know, ask codec sites, go and do that for you. And I think what's really cool is that like, you know, if you listen to this channel, a lot of us are interested in creating startups that, you know, we don't need big teams to manage. Right. And this whole. What's so cool about this is we're getting to this. With codec sites, we're getting to this. If you can create agents that go and automatically update based on, you know, different criterias than and at work, and these are products that work and are valuable to people, then that's sort of, sort of the dream. So this, you know, is it the most beautiful website on the planet? No. Does it work? Yes. Does it look decent? Yes. Could I get it to a point where it looks beautiful? I can. And. And that's pretty cool. So to tldr it, what are the main concepts to understand within codec sites? Is number one, you're going to want to ask it to have memory, right? The app saves data, but without this it's just a demo. So you're going to have to ask it to save memory, you're going to have to ask it to have a database. A lot of people are starting to use convex with Codex sites, so it's something to look into. I imagine that over time it's just going to be easier and easier to use Codex sites, but now you do need to prompt it to do a lot of these things. The second thing is this concept called safe action. So this whole idea that you can have approved buttons and through that you can have it automate, adding, removing, editing your apps so that you as the human being aren't doing everything and you don't have to actually edit every website or app you create. I used to run a web design agency was one of my first jobs. And you know, one of the things I used to say was a website is a living and breathing entity. It isn't something that you hit publish and you can just like walk away forever. And you know, we're now in this era 2026, where the agents are actually doing the updating, the editing they're removing. And that's through things like safe actions and skills, like use skills. With Codex, we saw how it could be valuable in this episode. But a skill is basically this reusable instruction manual. So Codex knows how to operate the app later. So you're gonna need to create skills so you can use the safe action, safe actions and so that. And obviously you're gonna wanna store that in the memory so that it, you know, it does it safely and is giving the right information. So all this to say, the wow moment for me is building apps where I could do like, you know, in this example, I could open a new chat and say, add this idea to my Startup Ideas os. It shows it in the live site updating, right? So once it's published, I could just be like, do this and it's going to add it, or I can have an agent do it and it's going to add it and it's going to be all on my live website, which is really cool. I think that a lot of people are going to use Codex Sites to make personal web pages, to make little apps and stuff like that. But I actually think that the real unlock here is to make products that Codex can keep operating for you. That is what's exciting to me about Codex Sites is that if we can create ideas and apps and websites that are automatically updated, automatically get better, our autonomous. I just find that so, so interesting. And I think this is a trend that's only going to get bigger, better. And it was interesting to see that Codex Sites is leading the charge. So, yeah, this has been a inside look as to how to use Codex Sites. What I think is interesting about it, some best practices. I hope it's been helpful. I'm just trying to share the most the new tools that I think are going to make increase. I'm just trying to share the new tools that are going to increase the probability of success for you, whatever it is you're building, and just share the best way to use these tools and give you ideas along the way. If this gave you an ounce of value, please like comment and subscribe. I'll see you in the comment section. I read every single comment and I'm rooting for you. Whatever it is you're building, I'm rooting for you and I can't wait to see what you build. I'll see you on the next one. And thank you for joining in the Startup Ideas podcast.