Skip to content

Instantly share code, notes, and snippets.

@milankinen
Created November 4, 2015 13:44
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save milankinen/26fe2de3d8a0684c52a6 to your computer and use it in GitHub Desktop.
React reactive swiss army knife
import React from "react"
import Bacon from "baconjs"
import {render} from "react-dom"
function Counter(initial) {
const incBus = new Bacon.Bus()
const value = incBus.map(1).scan(initial, (state, inc) => state + inc)
value.inc = () => incBus.push()
return value
}
const a = Counter(10)
const b = Counter(5)
const c = Bacon.combineWith(a, b, (a, b) => a + b)
const renderCounter = counter => Bacon.combineTemplate(
<div>
Value: {counter}
<button onClick={counter.inc}>+</button>
</div>
)
const app = Bacon.combineTemplate(
<div>
<h1>Counterz!</h1>
Counter A: {renderCounter(a)}
Counter B: {renderCounter(b)}
<hr />
{a} + {b} = {c}
</div>
)
app.onValue(appEl => render(appEl, document.getElementById("todoapp")))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment