What NodeGX does for you
NodeGX is a free app builder that shows your app as a picture: boxes joined by lines. When Claude builds your app in NodeGX, you can open that picture, see what Claude built, and change it yourself.
What NodeGX is
NodeGX is a free, open-source visual app builder. Open-source means its code is public and anyone can use it for free. It runs on Mac, Windows and Linux, and you can download it from nodegx.io.
In NodeGX, an app is made of nodes and wires. A node is a box that does one job, like showing some text, being a button, or making a decision. A wire is a line that carries information from one node to the next.
Everything in your app is made this way: the pages, the components (reusable pieces, like a card you use on several pages), the logic and the data. Your app is saved as ordinary files in a project folder on your computer.
Why a picture of your app matters
When Claude writes an app as code, it is fast. But you end up with thousands of lines of code that only Claude can read. When something goes wrong, you can't see where.
In NodeGX, what Claude builds is the picture. Each page is a set of nodes and wires you can open and look at. To find out where something on the screen comes from, follow its wire back.
| Claude writes code | Claude builds in NodeGX | |
|---|---|---|
| What you get | Files full of code | Pages of nodes and wires |
| Can you read it? | Only if you can read code | Yes. Open a page and look. |
| How do you find out how it works? | Ask Claude | Follow the wires, or ask Claude |
| Can you change it yourself? | Not without learning to code | Yes, in NodeGX |
| Can the picture go out of date? | Yes. A diagram is drawn once and then forgotten. | No. The picture is the app. |
What NodeGX does when Claude builds
It keeps the plan. Before Claude creates a new app, it asks you what the app is, who uses it, what it stores, which pages it has, and what it will not do. NodeGX writes your answers into the project as its brief and its build plan. They stay in the project after the conversation ends.
It checks every change. NodeGX checks (validates) each change before saving it. If a change is wrong, NodeGX refuses it, explains why and suggests a fix. Nothing is written until the change is right.
It uses style names. Colours, spacing and fonts each get a name, like "primary colour" or "small gap". These are called design tokens. Claude uses the names instead of raw values, so the look stays the same across the app, and you can change a colour everywhere by changing it in one place. See Describing how it should look.
It lets Claude see what it built. NodeGX can draw your app without opening a window and hand Claude screenshots of it. Claude looks at them to check its own work.
It sets up somewhere to keep data. If your app needs to save records or have user log-ins, Claude can set up a local backend: a place on your computer that stores the data and the user accounts.
It lets you see and change everything. Open your project in NodeGX at any time. You can change anything yourself. Afterwards, tell Claude before it carries on:
I've changed some things in NodeGX myself. Please look at the project again before you change anything else.More in Changing things yourself.
It tells Claude who you are. NodeGX has a profile in Editor Settings where you say what you know and what you don't. It passes that to Claude, so Claude explains things at your level. See Tell Claude who you are.
How Claude gets into NodeGX
On the NodeGX start screen, click Connect Claude Code. You do this once. Then start a new conversation in the Code tab of the Claude desktop app, and Claude can use NodeGX. The full steps are in Install Claude and NodeGX.
Each conversation works on one project. For a different app, start a new conversation.
Advanced
How the connection works. Connect Claude Code registers NodeGX's MCP server with Claude Code. An MCP server is a connector that gives Claude extra tools: here, tools to list, open and create projects, read and write components, validate changes, render screenshots and set up the backend. Details in Claude Code in depth and How NodeGX stores an app.
Where NodeGX came from. NodeGX grew out of Noodl, a visual app builder whose company closed in 2024. The Low Code Foundation, a French non-profit, kept a copy of its code alive, and NodeGX is that copy, rebuilt so that AI can build in it. Richard Osborne is the main developer. The code is on GitHub at The-Low-Code-Foundation/NodeGX.
Quick reference
- NodeGX is free, and runs on Mac, Windows and Linux.
- Your app is nodes (boxes) and wires (lines), saved as files on your computer.
- Claude's plan for your app is saved in the project as its brief and build plan.
- Every change Claude makes is checked before it is saved.
- You can open and change anything yourself. Then tell Claude to look again.
- One project per conversation.