Getting started with ScriptGraph

ScriptGraph is a visual node-graph editor for workflows that need real code: web endpoints, bots, agents, data pipelines. You draw the graph, the runner executes it in a container, and the console shows what happened.

What ScriptGraph is

The public site (n4g5.dev) is where you read about the product and browse public projects, graphs and store assets. The application (app.n4g5.dev) is the editor: it owns login, projects, the canvas and runs. They are separate origins, so the site never knows whether the editor has a session — use the "Open the editor" buttons to cross over.

Canvas — draw the graph: nodes, ports and connections in the pixi.js editor.
API — save and run: the API stores the structure and starts a container.
Runner — execute the nodes: each node becomes an asyncio task wired by queues.
Console — read the result: stdout and node events stream back in real time.

Core concepts

Six terms cover almost everything you will see in the editor and on this site.

Nodes

A node is one reusable Python unit of work. It has a manifest that declares its label, parameters and ports, and a run method that reads inputs and writes outputs.

Ports

Ports are the typed endpoints of a node. Data ports carry values such as strings, numbers and dictionaries; exec ports carry control flow and decide what runs next.

Connections

A connection wires one output port to one input port. The editor checks the port types, so a string port cannot be plugged into a number input by accident.

Groups

A group collapses part of a graph into a single block with its own ports. Groups keep large graphs readable, and a closed group from the store hides its implementation.

Graphs

A graph is the canvas: nodes and connections plus its container settings, repositories and generated nodes. A run executes one graph from start to finish.

Projects

A project holds related graphs and their members. It has an owner, a visibility flag and collaborators, and it is the unit you share, fork or snapshot into the store.

Your first graph in five steps

You can place and wire nodes without an account. Running and saving ask you to sign in with a verified email address.

Open the editor. Go to app.n4g5.dev and start on the blank canvas at the workspace root. No account is needed to draw: the draft is kept in your browser.
Drop your first node. Open the node catalog and drag a node onto the canvas. The editor stamps the catalog version onto the node so the runner can fetch exactly that version later.
Wire a second node. Add a Print node from the Output category and drag from the first node's output port to the Print input. Start by connecting the exec ports, then the data port.
Run and read the console. Press Run. The console shows stdout and node events; nodes turn green while they execute. Fix inputs and rerun — runs are cheap and repeatable.
Save it. Save asks you to sign in with a verified email. Once saved, the graph belongs to a project and others can open it at its public URL or fork a copy.

Running a graph

A run is an ordinary HTTP request from the editor, not a browser preview. The graph is sent to the API and executed server-side.

Start a run

Run sends the graph structure to the API. The API finds or creates a Docker container for the graph and posts the run to the orchestrator inside it.

Watch the console

The orchestrator starts one task per node and reports stdout plus per-node events. The API re-emits them over Socket.IO and the editor prints them live.

Read a failure

A failed run leaves its error in the console. A pinned node that cannot be fetched fails the run rather than silently cloning another version, so the version in the graph is the version that ran.

Saving, forking and sharing

Nothing is lost while you try the editor, and nothing is overwritten when you open someone else's work.

Your anonymous draft

At the workspace root an unsigned-in visitor draws a draft. It is stored in this browser under the draft keys until the first Save, so a reload does not lose it.

Saving

Save sends the whole structure: nodes, connections, container, container configuration and generated nodes. It requires a signed-in account with a verified email address.

Forking

If a graph belongs to someone else, the editor offers Fork instead of Save. You get your own copy; the original keeps its owner, version and visibility.

The store

The store is how graphs, projects and nodes travel between people. Every product is a set of variants, and a variant decides access and price.

Free and open

Free assets are open: you can import them, read every node and keep the source. The Uppercase Filter and the Internet Shop Starter are free examples.

Open assets are importable into a project.
The source is part of what you receive.
Free graphs, projects and nodes all appear in the store.

Paid and closed

A closed asset is encrypted at rest and never reaches the browser. You see its manifest and its ports; the implementation is decrypted only inside the API when an entitled run starts.

Closed graphs are inserted as locked groups.
Closed nodes appear as store templates with a public manifest.
The runner still executes ordinary node code.

Rentals

A rental grants an entitlement with an expiry date. In the seeded store, rental variants run for 30 days; when the entitlement expires, the asset can no longer be run.

A rental has an expiresAt date.
The rent variant usually exposes a closed asset.
The same asset can also offer a buyout variant.

Buying and the library

A one-time purchase creates a perpetual entitlement. Paid assets are bought with SGC test coins from the wallet, and checkout is idempotent, so retrying a payment does not create a second order.

Checkout creates an entitlement for each line.
Owned assets appear in the editor's Library.
A buyout variant may include the source download.

Collaboration

Graphs live in projects, and a project owner can invite other people to work on them.

Members

An owner invites users to a project as an editor or a viewer. The project stays the unit of ownership while each graph records who created it.

Editors and viewers

Editors can change graphs and run them. Viewers can read the project but cannot start a run or change its graphs.

Entitlements

A run is allowed when the person starting it or the project owner holds the entitlement to the assets the graph uses. That is what keeps a shared closed asset runnable without handing its source to every member.

Going further

Do I need an account to build a graph?

No. The editor opens a draft at the workspace root and keeps it in localStorage until you save. Save and Run need a signed-in account with a verified email address; the draft survives the login round trip.

What happens when I open someone else's graph?

A public graph is read-only. Saving it would change an asset you do not own, so the editor offers Fork instead. A fork is a copy in your own project, and the original is untouched.

Why do node versions matter?

A node's identity in a graph is its source, catalog name and version. The editor pins the catalog version when you drop a node, and the runner downloads that exact version. A node with no version resolves to the newest published one, which is what older graphs rely on.

Can I use a node from another repository?

Yes. A node reference carries a source URL. Published ScriptGraph nodes come from the package registry at the pinned version; a third-party source is cloned instead. The manifest still defines the ports the editor shows.

Snapshot it into the store as a closed asset. The store encrypts the payload with AES-256-GCM, exposes only the interface, and decrypts it in memory when a buyer or renter runs it. The browser never receives the closed source.

Where to go next

Follow the tutorial to build and run an HTTP graph, open a public example, or check the answers to the questions people ask most.