choo

A framework for creating sturdy web applications. Built on years of industry experience and distills the essence of functional architectures into a productive package.

Features

• minimal size: weighing under 8kb, choo is a tiny little framework
• single state: immutable single state helps reason about changes
• minimal tooling: built for the cutting edge browserify compiler
• transparent side effects: using "effects" and "subscriptions" brings clarity to IO
• omakase: composed out of a balanced selection of open source packages
• idempotent: renders seemlessly in both Node and browsers
• very cute: choo choo!

Usage

const choo = require('choo')

const app = choo()
app.model('title', {
  state: { title: 'my-demo-app' },
  reducers: {
    'update': (action, state) => ({ title: action.payload })
  },
  effects: {
    'update': (action, state, send) => (document.title = action.payload)
  }
})

const mainView = (params, state, send) => choo.view`
  <main class="app">
    <h1>${state.title}</h1>
    <label>Set the title</label>
    <input
      type="text"
      placeholder=${state.title}
      oninput=${(e) => send('title:update', { payload: e.target.value })}>
  </main>
`

app.router((route) => [
  route('/', mainView)
])

const tree = app.start()
document.body.appendChild(tree)

Concepts

• state:
• reducers:
• effects:
• subscriptions:

API

choo

Packages used

• views: yo-yo
• models: send-action, xtend
• routes: sheet-router

Installation

$ npm install choo

License

MIT