VisualFlowReal-World Tutorials
End-to-end builds: an automation builder, an AI agent canvas and a schema designer.
Intermediate · 15 min read · Updated Oct 31, 2026
Workflow automation builder
Combine a sidebar of draggable node templates, onDrop with screenToFlowPosition, and a run button that walks the graph in topological order.
AI agent canvas
Model each tool call as a node and stream execution status into node data so users watch the agent reason in real time.
Database schema designer
Render tables as custom nodes with a handle per column, and use smoothstep edges to draw foreign-key relationships.