Most AI app builders give you a chat box and hand back a wall of code. You can't see how the app is structured until you dig through it.
So I built Devgri AI — you describe an app in plain language and get three panes that stay in sync:
| Pane | What it does |
|---|---|
| Chat | Describe what you want, in plain language |
| Architecture tree | The app's structure as an editable node graph — drag, rename, reconnect |
| Live preview | The generated site renders beside the tree as it changes |
👉 Live demo: https://devgri-ai-olive.vercel.app
👉 Repo: https://github.com/Sumontsc51/Devgri-ai
Devgri is BYOK — your Anthropic, OpenAI or Google key stays in browser memory. PII and token masking runs client-side before anything leaves the tab, and keys are stripped from every payload before a workspace is saved.
One thing I like: rules like the trial window and user cap are enforced in RLS policies, not just the UI, so the API can't be talked around.
It's an early MVP. It works end to end, but it's rough in places — which is exactly why it's public and MIT licensed. Contributions I'd love:
The repo has a CONTRIBUTING.md, and getting it running locally takes a few minutes:
git clone https://github.com/Sumontsc51/Devgri-ai.git
cd Devgri-ai
npm install
cp .env.local.example .env.local # fill in your Supabase values
npm run dev
If you try it, I'd really like to hear what breaks and whether the architecture-tree idea is useful to you. Issues, PRs and ⭐s all welcome!