Web Builder

Node type: web_builder · Version: 1 · Category: System Combine HTML, JavaScript, and CSS into a localhost site. sndbox classifies this node as side-effecting, so tests or automatic runs can require additional confirmation and permission review.

When to use this node

Preview a small local interface assembled from separate HTML, JavaScript, and CSS nodes.
Build a localhost dashboard for workflow output without deploying a public site.

Example: Serve a local status dashboard

Map source from three Code nodes and let sndbox choose an available loopback port.

Example settings

{
  "html": "{{nodes.html.output.code}}",
  "javascript": "{{nodes.javascript.output.code}}",
  "css": "{{nodes.css.output.code}}",
  "port": 0,
  "openBrowser": true
}

This shows the important settings, not a complete exported node.

Create HTML, JavaScript, and CSS Code nodes in source mode.
Connect and map each code output to the matching Web Builder input.
Run locally and use the returned URL while sndbox remains open.

Configuration

Field	Type	Default	What it controls
`html`	string	`""`	HTML source, normally mapped from the `code` output of an HTML Code node.
`javascript`	string	`""`	Browser-side JavaScript source, normally mapped from the `code` output of a JavaScript Code node.
`css`	string	`""`	CSS source, normally mapped from the `code` output of a CSS Code node.
`port`	number	`0`	Loopback port from 0 to 65535. Use 0 to choose an available port automatically.
`openBrowser`	boolean	`true`	Open the generated localhost URL in the default browser after the server starts.

The node card exposes separate HTML, JS, and CSS connectors. Connecting a matching Code node creates both the dependency edge and its code output binding.

The server binds only to 127.0.0.1. Port 0 selects an available port, /health reports server status, and rerunning this node replaces its previous server for the same workflow.

The combined source is limited to 4 MB. The local site remains available while the desktop app is running.

Workflow JSON

The editor stores this node with the following implemented default configuration:

Default node configuration

{
  "type": "web_builder",
  "version": 1,
  "configuration": {
    "html": "",
    "javascript": "",
    "css": "",
    "port": 0,
    "openBrowser": true
  }
}

Values may be entered literally or mapped from an earlier compatible output when the inspector exposes a mapping control. See Variables and data mapping.

Inputs

Port	Type	Required	Description
`html`	`string`	Yes	HTML
`javascript`	`string`	Yes	JavaScript
`css`	`string`	Yes	CSS

Outputs

Port	Type	Required	Description
`url`	`string`	No	Localhost URL
`port`	`number`	No	Port
`status`	`string`	No	Server status

Execution behavior

The server binds to 127.0.0.1 only; port 0 selects an available port.
Rerunning the same Web Builder node replaces its previous server, and combined source is limited to 4 MB.
The editor catalogue declares url (string), port (number), status (string) for mapping. The execution inspector can contain additional evidence fields; inspect a real result before selecting nested paths from object or any outputs.

Common issues

All three source inputs are required even when JavaScript or CSS is intentionally empty.
The returned URL is local to the runner and is not a deployment or remotely reachable preview.

Where it can run

Desktop local runner

Test and inspect

Use Test node in the editor to preview this step with the current configuration. A full run records resolved inputs, outputs, logs, duration, and any artifacts in the execution inspector. Side-effecting or destructive nodes can require an additional confirmation or approved workflow permission.

Node reference

Triggers

Logic

Data

Network

Browser

Communication

System

When to use this node

Example: Serve a local status dashboard

Configuration

Workflow JSON

Inputs

Outputs

Execution behavior

Common issues

Where it can run

Test and inspect

​When to use this node

​Example: Serve a local status dashboard

​Configuration

​Workflow JSON

​Inputs

​Outputs

​Execution behavior

​Common issues

​Where it can run

​Test and inspect

​Related guides

When to use this node

Example: Serve a local status dashboard

Configuration

Workflow JSON

Inputs

Outputs

Execution behavior

Common issues

Where it can run

Test and inspect

Related guides