My Vibe Coding Workflow: Codex, Claude Code, Supabase, and Vercel

The fastest AI coding workflow is not “let AI build everything.” That sounds nice until the app breaks and you cannot explain your own code.

The better workflow is to give each tool a clear job.

For me, Codex is for exploration. Claude Code is for debugging, refactoring, and hardening. (I break down that split in Claude Code vs Codex.) Supabase is the backend I reach for when I need auth, database, and storage quickly. Vercel is where the app gets shipped.

The stack is simple enough to move fast, but serious enough to build real MVPs.

Quick answer

My AI coding workflow looks like this:

Plan the smallest useful feature -> Build rough version with Codex -> Review and refactor with Claude Code -> Store data in Supabase -> Deploy on Vercel -> Review again before showing clients

The principle is simple:

Codex for speed. Claude Code for discipline. Supabase for backend. Vercel for shipping.

This workflow is not perfect, but it is practical. Practical beats perfect when you are trying to build, sell, and learn at the same time. The main thing is this will get you started and ship fast. You can always sort out the cyber sec and better deployment later on.

Why this stack works

A lot of solo builders overcomplicate the stack.

They want queues, microservices, Kubernetes, analytics pipelines, custom auth, and a landing page that looks like Apple had a baby with a fintech company.

Most MVPs do not need that.

Most MVPs need:

• A clear user flow
• A database
• Authentication
• A few screens
• A way to deploy
• A way to test with real users
• A way to change quickly when the first idea turns out half-wrong

That is why this workflow works.

Codex helps you move from idea to rough product.

Claude Code helps you make that rough product less embarrassing.

Supabase gives you a practical backend.

Vercel makes deployment simple.

Your job is to make decisions and not blindly accept whatever the agents generate.

Step 1: Start with the smallest useful feature

Before touching Codex or Claude Code, reduce the idea.

Do not start with “build a SaaS.”

Start with one user, one job, one workflow.

Examples:

AI works better when the problem is small and concrete.

A strong starting prompt:

We are building only the first useful feature, not the full platform. The user should be able to complete one clear task. Keep the implementation simple and explain assumptions before coding.

This prevents the agent from building a cathedral when you asked for a stool.

Step 2: Use Codex for the rough build

Once the feature is clear, I start with Codex.

Why Codex first?

Because early-stage work is uncertain. I want options, speed, and a willingness to throw away bad attempts.

A good Codex prompt:

Build a rough MVP for this feature. Prioritize functionality over polish. Use simple components and mock data if needed. Do not add new dependencies unless necessary. After finishing, summarize changed files, fragile assumptions, and what needs cleanup before production.

This is important: I do not ask Codex to make it perfect.

I ask Codex to make the idea visible.

If the rough version feels useless, that is valuable. You learned early. If it feels promising, then you can invest more.

Step 3: Ask Codex for alternatives

Before locking in the first implementation, I like asking Codex for alternatives.

Suggest two alternative implementations for this feature. One should be the fastest to ship. One should be cleaner for long-term maintenance. Compare the trade-offs.

This avoids getting trapped by the first working version.

The first working version is seductive. It loads. It clicks. It makes you feel productive. But working is not the same as right.

Sometimes the best move is to throw away the first version and keep only what you learned.

Step 4: Bring in Claude Code for review

Once Codex has produced something worth looking at, I bring in Claude Code.

I do not start by asking it to edit.

I start with review:

Review this Codex-built feature. Do not edit yet. Explain the current flow, identify fragile parts, and list production risks. Focus on auth, database, edge cases, error handling, and maintainability.

This makes Claude Code act like a senior reviewer instead of another fast builder.

I want Claude Code to tell me:

• What is good enough for now
• What is fragile
• What is over-engineered
• What is under-engineered
• What could break in production
• What should be refactored first

That review is where the rough MVP starts becoming a real project.

Step 5: Use Supabase carefully

Supabase is useful because it gives you Postgres, auth, storage, edge functions, and a dashboard without forcing you to build backend plumbing from zero.

But Supabase also gives you enough power to create security problems if you let AI freestyle.

The danger areas are:

• Row Level Security
• User data scoping
• Auth callbacks
• Service role keys
• Public vs private tables
• Client-side database access
• Environment variables

When AI touches Supabase, I use stricter prompts.

Design the Supabase schema for this feature. Do not write RLS policies yet. First explain tables, relationships, user ownership, and security assumptions.

Then:

Now propose RLS policies. Explain what each policy allows, what it blocks, and how it prevents one user from accessing another user's data. Do not apply until approved.

This is not paranoia. This is basic hygiene.

Database security is not where you want “probably fine.”

Step 6: Use Claude Code for Supabase review

For Supabase work, I trust Claude Code more as a reviewer than as a blind builder.

Useful prompt:

Review this Supabase schema and RLS design. Do not edit yet. Check for user data leaks, overly broad policies, missing ownership fields, unsafe client access, and environment variable risks.

If the project has real users or client data, do not rely only on AI. Get human review too.

AI can help you catch risks. It should not be the final legal or security authority. It does not go to court for you. Convenient for it, less convenient for you.

Step 7: Deploy on Vercel only after checks

Vercel makes deployment simple, which is good. It also makes it easy to deploy broken things quickly, which is less good.

Before deployment, I ask Claude Code:

Review this app for deployment readiness on Vercel. Check environment variables, build risks, server/client boundaries, API routes, auth callbacks, and any code that may work locally but fail in production.

Then I run:

npm run lint
npm run typecheck
npm run build

If tests exist, I run them too.

If tests do not exist, I ask:

Suggest the smallest useful test coverage for the riskiest logic in this app. Do not chase full coverage. Focus on what could break the business flow.

The goal is not to become a testing monk. The goal is to avoid shipping obvious breakage.

Step 8: Use Git like your safety net

This workflow only works if Git is involved.

At minimum:

• Start from a clean state
• Use branches or worktrees
• Commit before major AI changes
• Review diffs
• Do not merge blindly
• Keep changes small enough to revert

AI coding without Git is not bravery. It is just gambling with syntax highlighting.

A good habit:

One feature, one branch, one review before merge.

If Codex is experimenting, keep it isolated.

If Claude Code is refactoring, keep the diff small.

If either tool changes too much, stop and review before continuing.

Step 9: Create AGENTS.md and CLAUDE.md

For any serious project, I create both files.

AGENTS.md for Codex.

CLAUDE.md for Claude Code.

They should include:

• Stack
• Commands
• Folder rules
• Security boundaries
• Testing expectations
• Deployment notes
• Files not to touch without approval

Simple example:

# Project Rules

## Stack
- Next.js
- Supabase
- Tailwind
- Vercel

## Rules
- Keep changes small.
- Do not add dependencies without explaining why.
- Do not touch auth, RLS, billing, or env files without approval.
- Run lint and type checks after meaningful changes.
- Explain root cause before fixing bugs.

## Review focus
- Auth safety
- Database safety
- Error states
- Loading states
- Mobile responsiveness
- Deployment risk

This saves time because the agents stop asking the same questions and making the same mistakes.

Mostly. They are still agents, not saints.

Example workflow: AI content tool

Imagine building a small AI content tool for LinkedIn posts.

The first useful feature:

User pastes a draft. The app returns three hooks, one shorter version, and one stronger CTA.

Codex prompt:

Build a rough MVP for this feature using mock AI output. Include a text input, output cards, and save-to-history button. Keep design simple.

Codex second prompt:

Add a local history table. Do not add auth yet. Keep it simple.

Claude Code review:

Review this MVP. Do not edit yet. Tell me what should be cleaned before adding Supabase auth and database storage.

Supabase prompt:

Design a simple Supabase schema for saved drafts and generated outputs. Explain user ownership and security assumptions before writing code.

Claude Code hardening:

Refactor the app for maintainability. Keep behavior the same. Add loading, error, and empty states. Do not introduce new dependencies.

Vercel readiness:

Check deployment readiness. Focus on env variables, build errors, API routes, client/server boundaries, and production risks.

That is enough for a demo or first client conversation.

Not perfect. Useful.

Final verdict

The best AI coding workflow is not about choosing one magical tool.

It is about sequencing.

Use Codex to move fast when the idea is still uncertain.

Use Claude Code to investigate, refactor, and harden once the idea has shape.

Use Supabase when you need a practical backend quickly.

Use Vercel when you need to ship and test with real users.

And use your own judgment before merging anything.

The real workflow is:

Move fast with Codex. Clean up with Claude Code. Store with Supabase. Ship with Vercel. Review like your name is on it, because it is.

References

• Codex CLI
• Codex cloud
• Codex sandboxing
• Codex AGENTS.md
• Claude Code overview
• Claude Code common workflows
• Claude Code memory and CLAUDE.md