The Problem I Had (And You Probably Have Too)
I was building apps with AI features. Nothing fancy - a recipe generator here, a study tutor chatbot there. You know, indie dev stuff.
But every tutorial said the same thing:
Get an OpenAI API key
Build a backend to hide it
Pay $0.02 per request
Monitor usage so you don't go broke
I thought: This is overkill for a side project.
I just wanted a simple chatbot on my site. Why do I need:
A Node.js backend?
Environment variables?
Rate limiting logic?
A credit card on file with OpenAI?
So I didn't do any of that. Instead, I built Scaffold.
What Scaffold Actually Does
It's dead simple:
You build a form. Fields like "topic", "tone", "audience" - whatever your AI needs.
You write a prompt template. Using {{field_name}} variables, like:
Write a blog post about {{topic}} in a {{tone}} tone for {{audience}}.
You get an embed code. One line. Paste it anywhere.
Users fill the form. They click "Generate Prompt".
Scaffold creates the perfect ChatGPT prompt. Opens it in ChatGPT for them.
They hit send. AI responds.
Wait, That's It?
Yeah. That's it.
No API keys. I'm not calling OpenAI's API.
No backend. Just a form builder and a prompt generator.
No costs. The user sends the prompt to ChatGPT themselves. I don't pay OpenAI. You don't pay me.
"But Why Would I Use This Instead of the API?"
You probably shouldn't if:
You're building a production app for a real company
You need conversation history and state management
You want responses embedded directly in your site
You have money
You absolutely should if:
You're prototyping and don't want to set up a backend
You're an indie dev building side projects
You're a freelancer who wants to add AI to client sites without recurring costs
You're a student/beginner who just wants to see if AI features are worth it
Think of it like this:
Your SituationUse This"I need AI in my billion-dollar startup"OpenAI API"I want to test if users would use an AI feature"Scaffold"I'm building for a client and have a budget"OpenAI API"I'm building a side project with $0 budget"Scaffold"I need full control and customization"OpenAI API"I just want it to work in 5 minutes"Scaffold
Real Talk: The Limitations
I'm not going to pretend this is perfect. Here's what it CAN'T do:
❌ Conversational AI with memory - Each form submission is a new prompt. No conversation history.
❌ Embedded responses - The AI response opens in ChatGPT, not your site.
❌ Server-side processing - You can't do anything with the AI response programmatically.
❌ Custom models - You're using whatever ChatGPT is using (probably GPT-4 or 4o).
But here's what it CAN do:
✅ Get AI features live in 5 minutes - No coding required.
✅ Zero ongoing costs - Free tier is 5 apps, 5 tasks each, forever.
✅ Works anywhere - Notion, Webflow, React, WordPress, plain HTML.
✅ Customizable - Colors, fonts, themes, field types.
✅ Actually works - I'm using it for my own projects.
Two Types of AI Tools You Can Build
I realized there are two distinct use cases:
Type 1: AI Tools (One-shot generators)
User fills form → Gets AI response → Done.
Examples:
Blog post title generator
Email writer
Product description creator
Code snippet generator
These are for: Quick AI tasks where you just need output once.
Type 2: Smart Agents (Contextual chatbots)
User interacts with AI that has specific knowledge.
Examples:
Restaurant menu chatbot ("What's vegetarian?")
Study tutor ("Explain photosynthesis")
Product finder ("Show me laptops under $800")
FAQ bot (knows your docs)
These are for: Giving users an AI assistant that understands YOUR specific context.
How? You use the "Fixed Field" - hidden data that goes into every prompt. Like your restaurant's full menu, or your product catalog.
The Tech Stack (For the Nerds)
Since this is Dev.to, here's how it works:
Frontend:
Next.js 14 (App Router)
React with TypeScript
TailwindCSS for styling
Backend:
Supabase for auth + PostgreSQL
Next.js API routes for CRUD operations
Deployment:
Vercel (obviously)
Authentication:
Supabase Auth (email/password)
Users need accounts to create forms (prevents spam)
Embedding:
Good old iframes
Generate a URL with query params for customization
Users paste one line of HTML
The Prompt Generation:
Form data → Template string replacement
{{field_name}} → user input
Fixed fields → hidden context
Output → Formatted markdown prompt
Open ChatGPT with prefilled prompt (if supported) or copy-to-clipboard
Why I Built It This Way
Why not call OpenAI API directly?
Because then I'd have to:
Pay for every user's requests
Rate limit to prevent abuse
Monitor usage
Eventually charge users
I'm 17. I don't have OpenAI money. I want this to stay free.
Why make users go to ChatGPT?
Because:
They're already familiar with it
I don't handle their data
No API costs = actually free forever
They can see the full AI conversation
Why Supabase?
Free tier is generous
Auth is handled for me
PostgreSQL is perfect for this
Scales well
Why Vercel?
Free tier is amazing
Next.js plays nicely
Fast deploys
Edge functions when I need them
The Features I'm Proud Of
- Tutorial System I know this concept is weird. So I built an onboarding tutorial that:
Walks you through creating your first AI tool
Explains what each field does
Shows you the embed code
Gets you to "aha moment" fast
- Built-in Help Bot There's a (i) icon next to confusing terms. Click it → Get an explanation from an AI helper. It's meta: An AI tool that explains how to build AI tools.
- Template Improver Write a basic prompt → Click "Improve Template" → AI suggests a better version. It's like GitHub Copilot but for prompts.
- Live Preview See your form update in real-time as you customize it. Change the color → See it instantly.
- Fixed Fields This is the secret sauce for Smart Agents. You can add hidden context that users never see but AI uses:
Restaurant menu
Product catalog
FAQ documents
Company info
Your chatbot becomes specific to YOUR use case, not generic ChatGPT.
What I Learned Building This
- Nobody understands your product on first try. I showed this to 10 developer friends. All 10 said "I don't get it." So I added:
A tutorial
A help bot
Better copy
A demo that actually shows the value
- "No-code" doesn't mean "no learning curve." Even though users don't write code, they still need to understand:
What a prompt template is
How {{variables}} work
The difference between AI Tools and Smart Agents
I assumed this was obvious. It's not.
- Free is a powerful hook. When I say "free forever", people's eyes light up. When I say "API alternative", they tune out. Lesson: Lead with benefits, not features.
- Side projects attract side project builders. The people most excited about this are other indie devs. Because they GET the pain of:
Not wanting to manage API keys
Not having budget for per-request costs
Just wanting to ship fast
What's Next
Short term:
Better messaging (people still find it confusing)
More demos (show don't tell)
Security improvements (rate limiting, abuse prevention)
Mobile-friendly form builder
Long term:
Pro tier with analytics, A/B testing, unlimited apps
Zapier integration
Custom domains for embeds
Team collaboration features
But the free tier stays free. Always.
Try It (If You Want)
I'm not going to hard-sell you. If this sounds useful, try it: scaffoldtool.vercel.app
If it's not for you, that's cool too. I built this for myself and figured others might find it useful.
I'm looking for:
Honest feedback (roast me if you want)
Feature requests (what would make this a no-brainer?)
Bug reports (it's probably broken somewhere)
Use cases I haven't thought of
I'm 17, this is my first real product launch, and I'm learning as I go. All feedback is gold.
The Bottom Line
Adding AI to your project shouldn't require:
A computer science degree
A credit card
Three hours of setup
It should take 5 minutes and cost $0.
That's what I built. Hope it helps someone.
Comments are open. Tell me why this is dumb or what I should build next. 👇
Top comments (0)