Integrations
Framework Integrations
Frontman installs as framework middleware inside your dev server. Each integration gives the AI direct access to the component tree, computed styles, and server-side context for your specific framework.
Next.js
$ npx @frontman-ai/nextjs install App Router and Pages Router. Frontman sees the React component tree, server components, API routes, and middleware. One command to install.
View integration →Astro
$ astro add @frontman-ai/astro Islands architecture, SSR, and SSG. Frontman is the only browser-based AI coding tool with native Astro support. Listed on the official Astro integration registry.
View integration →Vite
$ npx @frontman-ai/vite install One integration for React, Vue, and Svelte. Frontman hooks into Vite's dev server and HMR pipeline for instant feedback on every edit.
View integration →Why Framework Middleware?
Most AI coding tools are "code-first." They read your source files but never see the running application. Browser-based tools like CLI overlays inject a toolbar on top of your app and only see the DOM surface.
Frontman takes a different approach. It installs as framework middleware and runs inside your dev server, which gives the AI access to information that's invisible from the outside:
- The component tree: React fiber nodes, Vue reactivity graph, Svelte component hierarchy. The actual components that rendered each element, not just the DOM output.
- The props and state each component received, how state flows through the tree, and what data drives the current render.
- Server-side context including routes, server logs, query timing, and middleware chains. The AI sees both the client and the server.
- Computed styles with the full cascade resolved, including specificity and inherited values.
When you click an element and describe a change, the AI has the full picture. It targets the right component file, adjusts the right props, and understands how the edit affects the rest of the UI.