cycleFizz

main.js

import xs from 'xstream';
import { run } from '@cycle/xstream-run';
import { makeDOMDriver, div, button, h1 } from '@cycle/dom';

const fizzBuzz = (n, result='') => {
  if (n === 0) return result;
  if (n % 3 === 0) result += 'Fizz';
  if (n % 5 === 0) result += 'Buzz';
  if (!result.length) return n;
  return result;
};

const main = ({ DOM }) => ({
  DOM: DOM.select('button').events('click')
    .map(ev => parseInt(ev.target.value, 10))
    .startWith(0)
    .map(value =>
      div([
        button({ attrs: { value: value + 1 } }, 'Click me!'),
        h1(fizzBuzz(value))
      ])
    )
});

const drivers = {
  DOM: makeDOMDriver('#app')
};

run(main, drivers);