# Quick dive into flow-based programming

**Some initial research**

- Excellent introduction to Flow-based Programming by its creator/inventor J. Paul Morrison.
- NoFlo (documentation page). Flow-based programming implementation running on Node.js, and written in CoffeeScript. A lot of documentation available, and a growing amount of libraries hosted on npm. The NoFlo UI is a work in progress, and has been successfully crowdfunded on Kickstarter.
- Blockie.io. Not yet released, currently crowdfunding on indiegogo.com.

*Image Removed*

So, I’m going to create a little module in NoFlo. A discussion about NoFlo on Reddit’s JavaScript subreddit had this rude little comment, from someone demanding that the NoFlo poster demoed some simple applications, such a Fibonacci and FizzBuzz. A Fibonacci application sounded easy enough, so I’m going to try and create that.

I can’t seem to get the NoFlo UI going, so I’ll write the graph in NoFlo’s Domain-Specific Language. This may be because the UI is still in development.

I created two node packages, one to hold the Fibonacci NoFlo component (noflo-fibonacci), and one to hold a graph (noflo-fibonacci-demo) that was using the component. The work to make the graph use the component was huge compared to the time it took to calculate the output, mainly because I was fiddling around with CoffeeScript.

# /noflo-fibonacci-demo/graphs/Fibonacci.fbp # Get the value of the 6th number in the Fibonacci series '6' -> IN Fibonacci(fibonacci/Fibonacci) # Output the value Fibonacci() OUT -> IN Display(core/Output)

The graph above uses two components; Fibonacci and Display. Fibonacci has an IN port, to which I always send ‘6’. Fibonacci’s OUT port is connected to Displays only port, an IN port.

The component itself looks like this:

# Fibonacci component # /noflo-fibonacci/components/Fibonacci.coffee noflo = require "noflo" class Fibonacci extends noflo.Component description: "This component receives data on a single input port and sends the same data out to the output port" constructor: -> # Register ports @inPorts = in: new noflo.Port() @outPorts = out: new noflo.Port() @inPorts.in.on "data", (data) => fibonacciValue = @fibonacci(parseInt(data)) @outPorts.out.send fibonacciValue @inPorts.in.on "disconnect", => @outPorts.out.disconnect() fibonacci: (number) -> if (number <= 1) return number else return @fibonacci(number-1) + @fibonacci(number-2) exports.getComponent = -> new Fibonacci()

Since there’s barely any logic needed in the component, it mostly consists of boilerplate stuff. You can see that the component contains two ports though. When data arrives at the input port, it simply calculates the Fibonacci number and sends it through the output port.

Running it from terminal: *Image Removed*

I’d really like to see how it is to work with NoFlo in a larger project. Will the NoFlo UI increase readability, or make it worse? It’s difficult to tell.

I put the code on GitHub in case someone has difficulties getting a simple component up and running.