Build your front end with Gemini (Google)
Use Gemini (or the Gemini CLI) to rewrite the template's copy and styling.
Best for: Google-ecosystem users; the Gemini CLI is a strong code-first option too.
Open Gemini (Google) ↗The prompt
Copy this, fill in the [bracketed] parts, and paste it into Gemini (Google).
I'm customizing the BringTheFront Next.js 15 template. It connects to the Orgalized backend only through lib/api (a secure server-side proxy) — do not modify that or add any browser-side backend calls. Rewrite presentation and copy only. Business: [YOUR BUSINESS] — [what you do]. Brand color [color]. Mobile-first, accessible (AA contrast). Use semantic color tokens (content-*, surface-*, action-*), not hardcoded hex. Give me: (1) a complete site.config.ts for my business, and (2) rewritten marketing + services copy for lib/content/*. Return complete, paste-ready files.
How to do it
Fork the template
Fork BringTheFront (Setup Guide).
Prompt Gemini
In the Gemini app, paste the prompt and work through the files. If you use the Gemini CLI, run it inside the forked repo so it can edit files directly like a code tool.
Apply the output
Paste the returned files into the template (chat), or review the CLI's edits (CLI). Keep lib/api and middleware untouched.
Verify + deploy
Run pnpm verify, fix flags, deploy on Vercel.
Watch out for
- The Gemini CLI behaves like Cursor/Claude Code (edits files in the repo); the Gemini app behaves like ChatGPT (paste files back and forth). Pick the workflow that matches.
- As with any chat tool, insist on complete files and no invented backend calls.
Ready to bring your front?
Create your backend first, then use Gemini (Google) to build the front that connects to it.