choojs/choo

★ 6,767JavaScriptAudience · developerComplexity · 2/5Setup · easy

Mindmap

mindmap
  root((Choo))
    Design goals
      4KB bundle size
      6-method API
      Easy to discard
    Data flow
      State object
      Named events
      Stores update state
      Views re-render
    Features
      Client-side routing
      Server-side rendering
      HTML templates
    Distribution
      npm package
      Browserify

mindmap root((Choo)) Design goals 4KB bundle size 6-method API Easy to discard Data flow State object Named events Stores update state Views re-render Features Client-side routing Server-side rendering HTML templates Distribution npm package Browserify

Click or tap to explore — scroll the page freely

Things people build with this

USE CASE 1

Build a small single-page web app without the overhead of React or Vue.

USE CASE 2

Render the same JavaScript views on both the server and in the browser without extra configuration.

USE CASE 3

Prototype a web UI quickly with a minimal framework that has no large proprietary abstractions to learn.

Tech stack

JavaScriptNode.jsnpmBrowserify

Getting it running

Difficulty · easy Time to first run · 30min

Install via npm and bundle with Browserify to use in a browser.

License not explicitly stated in the explanation, available on npm under standard open-source terms.

In plain English

Choo is a small JavaScript framework for building web interfaces. It weighs about 4 kilobytes when delivered to a browser, which is very light compared to most frameworks. The goal is to give developers a simple, consistent way to build web apps without adding a lot of complexity or a large number of things to learn. The entire API has only six methods. The framework is built around a one-way data flow pattern. Your application has a state object that holds all the data your interface depends on. When something happens, such as a button click, the code emits a named event. Stores listen for those events, update the state, and then trigger a re-render. Views are functions that take the current state and return HTML. This keeps things predictable: you always know where your data lives and how it changes. Choo handles routing, meaning you can define different views for different URL paths, and it can render on both the server and in a browser using the same code. It uses a small HTML template helper rather than a separate template language, so you write HTML directly inside your JavaScript using a familiar syntax. The project's stated philosophy is that frameworks should be easy to discard. By keeping close to plain browser APIs and avoiding a large proprietary abstraction layer, the idea is that switching away from Choo later should not require a complete rewrite. The authors wanted something approachable and low-stakes, particularly for people who find larger frameworks intimidating. Choo is available on npm and works with the Browserify build tool. A handbook, an ecosystem of community plugins, and a Reddit community are linked from the repository for those who want to go deeper. The full README is longer than what was shown.

Copy-paste prompts

Prompt 1

Build me a simple to-do list app using the Choo framework with a state object, an event that adds items, and a view function that renders the list.

Prompt 2

Show me how to set up client-side routing in Choo so that different URL paths render different view functions.

Prompt 3

I'm using Choo and want to add a store that listens for a form-submit event and updates the app state. Write the code with comments explaining each part.

Open on GitHub → Explain another repo

← choojs on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.