Introduction - Codeflow Basics

Codeflow is an open source, visual programming platform built on top of Node.js™. Codeflow is built with a vision of simplifying programming without sacrificing the performance or scalability. Codeflow derives its inspiration from many existing programming languages and paradigms, including asynchronous and functional programming.

Visual programming

A Visual programming is a programming paradigm that lets you create programs graphically instead of specifying every action using plain text.

The human-computer interaction mechanisms progressed from time to time due to the evolution of the computing hardware. What started as a command-line interface during the era of thin clients, later expanded into GUIs, and modern touch screens. We are now looking into a future where a speech or even mind controlled interface coupled with an augmented/virtual reality systems could change the way we interact with the computers.

But modern programming is more or less standing still at the command-line era. While the modern programming languages does their job well, they are complicated to learn and understand. Also, it's impossible to memorize hundreds of libraries and APIs, that are inevitable in any modern programming language.

Can't there be any alternatives, which, while preserving the best of the current programming languages, provide a much better way to write and read code?

Enter visual programming. Visual programs, like the ones produced by Codeflow (flows), look and feel more like a set of navigable diagrams rather than a sea of text. A flow can easily convey the bigger picture and can easily drill down to see the details, in just few clicks. Also since the interface for each component is visual, it eliminates the need for additional documentation, reducing the barriers of entry and allowing rapid development.

Visual programming is not a new idea. There are dozens of successful visual programming languages but most of them were targeted towards niche domains. However they were not seen as suitable for general purpose programming which prevented serious research into the topic and lacked widespread adoption. Codeflow attempts to change that by bringing a platform that is easy to use, provides equal or better performance, is scalable and flexible.


The Codeflow platform consists of two major components:

  • A design time editor to design and edit flows.
  • And a runtime engine to execute the flows.


Codeflow designer is an open source, integrated development environment (IDE) made just for creating and debugging Codeflow projects. Since the language is built alongside the designer, they work seamlessly together, providing a rich development environment for developers. Read more about designer here.


Codeflow engine is the runtime component that executes Codeflow programs, a.k.a flows. The engine is built on top of the Node.js platform. The goal of Codeflow engine is to provide an optimum performance that can match any other modern, high-level programming languages. A Just-in-time compiler is being actively developed (available under a preview flag in engine) which will compile flows to native Javascript during runtime. You can read more about the engine here.


Below are few of the features of Codeflow:

  • Modular. Flows are made by composing tiny, loosely coupled modules. It simplifies programming and reduces boilerplate code.

  • Asynchronous. Codeflow derives from the asynchronous nature of Node.js. Every step in a flow is asynchronous, but without the callback hell. Flows look beautiful and more readable.

  • Schema typed. Codeflow makes use of JSON schema as its type system that brings the benefit of statically typed languages into a dynamic core.

  • Tooling. The free and open source Codeflow designer includes all the tools required for a complete development environment including a full-fledged debugger.

  • Extensible. Codeflow comes with a vibrant ecosystem of packages to extend the functionality of the core platform. You can write your own custom packages and publish to the repository in just a few clicks.

Core concepts


Programs in Codeflow are called as flows. A flow takes an input and provides an output. A flow looks like a flow chart with boxes and arrows. The arrows are called as transitions and the boxes are called as steps. Steps are formed by dragging and dropping modules from a repository in the designer. Apart from modules, a step can also call another flow or itself, allowing flows to be composed and build complex business logic. Flows look and remain like flowcharts or whiteboard diagrams forever. That makes their logic much more readable and the interconnected sub flows can be navigated easily by double-click. Read more about flows in the next section.


Modules are the basic building blocks of Codeflow. Flows are made by composing loosely coupled, reusable modules together. A module when placed in the flow becomes a step. A module takes an input does some processing or action and provides the output back. Modules are bundled together as packages. There are standard packages, available built-in as well as general packages.


The connections between two steps are called as transitions. Transitions control business logic flow by routing the control-flow between the steps. Transitions can be of different types including conditional and error type. Conditional type lets you set a boolean expression, which should be evaluated to true in order to let the transition go through during run-time. If the transition type is set to error', the transition will happen only during that time.


Flows are asynchronous by design. Every step is executed asynchronously but without the callback hell. The visual layout makes it easy to represent the sequential and parallel ordering of steps. To execute steps one after the other, wire them in sequence. To execute steps concurrently, just place them in concurrent paths. To join the concurrent paths, just join the steps together using the transitions. Read more about control flow in Codeflow.


Codeflow uses a subset of JSON schema to define its data structures. Every step's input and output data structure is defined as a schema. This allows the designer to perform rich validations while retaining the dynamic characteristics by using the any type as placeholder for unknown data types. It is explained in detail in the schema chapter.


As in most functional programming languages, the state is not mutable in Codeflow. A step once completed will never have its output altered. This can have lots of benefits. It makes it possible to visualize the data flow without worrying about state changes, and makes the debugging easier.


This chapter gave you a brief overview of concepts in Codeflow. Subsequent chapters will cover those topics in detail.

What's next?

Codeflow designer