See More

A very common reason is a wrong site baseUrl configuration.\n

Current configured baseUrl = / (default value)\n

We suggest trying baseUrl = \n\n';var e=document.getElementById("__docusaurus-base-url-issue-banner-suggestion-container"),s=window.location.pathname,r="/"===s.substr(-1)?s:s+"/";e.innerHTML=r}}window.__DOCUSAURUS_INSERT_BASEURL_BANNER=!0,document.addEventListener("DOMContentLoaded",maybeInsertBanner)

Skip to main content

Open-Source Workflow Components for JavaScript Applications

Build visual workflow builders, editors and execution engines using modular JavaScript components.

NoCode JS is a collection of framework-agnostic libraries for building workflow tools, automation platforms and no-code products. The ecosystem includes a visual workflow designer, a declarative editor generator and a workflow execution engine.

Works with React, Angular, Svelte and vanilla JavaScript.

Explore Components
DocsGitHubExamples
npm install sequential-workflow-designer

Three Components. One Workflow System.

NoCode JS provides three independent workflow components that can be used separately or combined into a complete workflow platform.

Workflow Designer

Visual workflow builder.

Sequential Workflow Designer GitHub Repo stars

Workflow Editor

Declarative configuration editor.

Sequential Workflow Editor GitHub Repo stars

Workflow Machine

Workflow execution engine.

Sequential Workflow Machine GitHub Repo stars

All components share the same workflow definition model, which makes it easier to design, configure and execute workflows consistently.

Workflow Builder Components

NoCode JS provides modular workflow components for building visual workflow tools.

Instead of implementing a workflow system from scratch, you can combine three independent JavaScript components: Workflow Designer, Workflow Editor and Workflow Machine.

All components share the same workflow definition model and can be used together or independently.

Sequential Workflow Designer

Visual workflow builder for web applications.

The Designer is a framework-agnostic JavaScript component that allows users to create workflows using a visual canvas.

It provides a drag-and-drop interface where processes are defined as sequential steps and stored as JSON workflow definitions.

Developers can fully customize the UI, step types and behavior to match their own product.

Typical use cases include automation builders, AI workflow editors and internal workflow tools.

Key capabilities

  • visual workflow canvas
  • drag-and-drop step editing
  • customizable step types
  • JSON workflow definitions
  • framework-agnostic architecture
DocumentationGitHubExamples

Sequential Workflow Editor

Declarative configuration editor for workflow steps.

The Editor generates UI editors and validation logic from a workflow definition model.

Instead of manually implementing configuration forms for each step, developers define a schema which is used to automatically generate the editing interface and validation rules.

The same model can be used both in the frontend and backend, ensuring that workflow definitions remain consistent and valid across the entire system.

Key capabilities

  • automatic editor generation
  • workflow definition validation
  • shared configuration model
  • dynamic field constraints
  • strongly typed definitions
DocumentationGitHub

Sequential Workflow Machine

Workflow execution engine.

The Machine executes workflow definitions created with the Designer and validated by the Editor.

It processes workflow steps sequentially and can run in both frontend and backend environments.

Developers implement step handlers that define how each step behaves during execution, allowing workflows to integrate with external APIs, services or business logic.

Key capabilities

  • workflow runtime engine
  • sequential step execution
  • pluggable step handlers
  • frontend and backend execution
  • compatible with JSON workflow definitions
DocumentationGitHub

How the Components Work Together

Design workflows

Users create workflows visually using the Workflow Designer.

Configure steps

Each workflow step is configured using editors generated by the Workflow Editor.

Execute workflows

The Workflow Machine executes the workflow definition step by step.

What You Can Build

Automation platforms

Create configurable flows that connect business logic with APIs and internal systems.

AI workflow builders

Build visual orchestration tools for prompts, AI tasks and post-processing steps.

Internal workflow tools

Ship custom workflow tooling for ops, support and product teams.

No-code products

Enable end users to create and manage workflows without writing code.

Visual programming interfaces

Use workflow blocks to model domain-specific logic in a clear graphical way.

Built for Developers

  • TypeScript-first
  • framework-agnostic
  • JSON-based workflow definitions
  • modular architecture
  • open source
  • customizable UI and behavior

Start Building with NoCode JS

Explore examples, read the docs, or jump directly to the repositories.

ExamplesDocsGitHub