Thanks to the magic of AI, all of us are now empowered with the skills to make the products we want to see in this world — and that includes Farcaster Frames.
You absolutely can build a Frame without being a developer, and you can use any AI to make a Frame — you don’t need to be concerned with which model is at the bleeding edge. With sufficient motivation, you can basically copy/paste your way to your dream app.
I made my Astronomy Photo of the Day MVP in a few hours using Replit and ChatGPT, copy and pasting code from ChatGPT into Replit. It was easy and fun; and through the process I gained some tips I hope can help all of you feel confident that you, too, can create Frames — or whatever else you want to make.
Plan the work, and then work the plan
Review the tutorial and come up with a comprehensive plan for your Frame and features before you start. Plan the work, then work the plan — don’t fly blindly into development.
Review the Frames v2 tutorial
Understand how Frames work before you start. For this, I recommend the Frames v2 tutorial. It is a great guide for understanding the basic mechanics of Frames, and can help you understand how your idea could work within one.
There is both video and written instruction you can take advantage of, depending on your style as a learner. It’s got everything you need to be successful with all components of the Frames SDK, including how to integrate with wallets.
Outline how your app will work
Have a basic outline in your head of how you will accomplish what you want to do. Pretend like you’re a project manager by the pool and planning out work for your developers. What needs to be done?
Are you so beginner you don’t even know what needs to be done at all? All you have is the vision? No problem. You can chat with the AI of your choice to accomplish this step, too. Tell the AI your idea and ask it for the steps to make it happen.
To make the Astronomy Photo of the Day Frame, before even touching a line of code, I knew I needed to:
- Fetch the latest entry from an RSS feed
- Parse the content from the feed to display nicely on the front end
- Use the Activity SDK to open an external link (I learned about this requirement from the tutorial!)
- Create a manifest and validate it so that my app would be recognized by Farcaster and “belong” to me (again, I read the tutorial!)
I had some loosely defined steps before starting, and from those steps I was able to create my prompts for my AI assistant.
Taking the time to plan your work also breaks down a big project into manageable steps, turning something that might have felt undoable into something approachable.
Use Replit
Replit is your best friend when making Frames.
With Replit, you get…
- Simple, one-click setup of a boilerplate NextJS app like the tutorial uses, with Replit templates
- No need to set up any sort of development environment, something that’s very useful if you don’t have a lot of experience.
- Automatically included auto-refreshing when you make code changes so you don’t have to constantly restart your server as you might when you are working locally.
- As much or as little complexity as you are comfortable with. There’s a giant RUN button that you can press instead of manually starting up your server in the shell — but you can use the shell, if you want to!
- A built-in Agent that can make whole apps you can adapt for Frames once you’re comfortable with what you’re doing.
- A built-in Assistant that knows your codebase that you can use as your AI helper if you’d like — although be careful with this one, I ultimately found ChatGPT easier.
- Seamless integration with Github for version control.
- Easy one click deployments straight from development. No battling with suicidal thoughts as you attempt to navigate shudder AWS docs or dealing with another service on top like Vercel.
MOST CRITICALLY, MORE IMPORTANT THAN ANY OTHER THING: Replit offers live dev URLs that you can use with the Frames debugger. This completely eliminates all the steps in the tutorial that involve NGROK.
Don’t know what a “tunnel” is? Who cares! You can skip all of that and just drop the URL Replit ALREADY GIVES YOU in and go.
This is a big step to skip for the non-technical. While for other projects I’d say it might be better to develop locally, for Frames — Replit is the way.
Make sure your AI adds logs and comments to your code
This tip isn’t too dissimilar to regular unassisted development, but it becomes critical when you are working with a tech stack you barely know and are flying a little blind.
Don’t let what you see on social media fool you: it’s highly unlikely you are going to one-shot the perfect app with a single prompt. There will be mistakes, hiccups, and bugs. And you’re going to need to fix them. That’s where comments and console logging comes in.
Modifiers to your prompt like...
- Add comments to each step that explain what you’re doing
- Explain to me your thought process in the code comments
- Add robust console logging for debugging
…can really save you a lot of time. When you have logging in place at each step of the way, finding the failure point is much easier. I have left my console logging in my Frame so you can see a live example of what the feedback looks like and what you can expect.
The comments are great because they help you learn what’s going on in the code you didn’t write. It’s like looking at a foreign language side-by-side with the translations. They help you start to learn and internalize what’s going on in your files.
Prompt quality matters
When people complain “AI got me 70% of the way there and then I got stuck!” — especially when they are making simple apps — I suspect this might be a skill issue.
Whether you’re facing a problem the AI can’t seem to crack, or stuck in an endless loop where the AI keeps making the same mistake over and over again: I believe often these problems are a result of prompt quality.
Are you really asking for what you want and need, in the most descriptive and clear way possible? Probably not!
If you’re struggling at a point like this, one thing to try is to ask an AI to write a prompt for you. Pit the models against each other: ask Claude or Gemini to construct a prompt for your ChatGPT window where you’re working on your app (swap out the models for whatever you choose). Talk through your problem with it step by step, and then ask it for the prompt at the end.
These things can really do it all if you remember to just ask.
But model quality, at least for simple stuff, might not matter that much at all
I used ChatGPT 4o to build my Frame. This isn’t even the best coding model by a long shot — and it got everything done I needed it to pretty capably.
If you can’t afford or don’t have a subscription for the omgosh top AI models for coding do not let this stop you.
In all likelihood you aren’t building something that is so complicated that you need the best of the best. Rely on good prompting and smart planning to get you through instead.
Go forth and create!
We all have a great opportunity as creative people to take advantage of Farcaster Frames. With the announcement that Farcaster and Frames will be integrated into Coinbase Wallet, you as a person with ideas have an opportunity to instantly have your app catapulted into a publicly traded company’s product.
There’s a few common refrains that are trite and make my eyes roll — but they do apply here:
We’re so early.
You can just do things.
And now, more than ever, it’s true. There’s nothing stopping you from making something cool, and more than that, if you do a good job, it will instantly have users — and maybe even revenue!