/whatsup

A frontend framework for chillout-mode development 🥤 JSX components on generators*, fast mobx-like state management and exclusive cssx style system

Primary LanguageTypeScriptMIT LicenseMIT

What is it?

Whatsup is a modern frontend framework with own reactivity system and JSX components based on pure functions and generators.

Features

  • 🎉 easy to use: simple api, just write code
  • 🚀 own reactivity system with high performance
  • 🌈 cool styling system based on css modules
  • 🚦 built-in router with intuitive api
  • ⛓ glitch free, autotracking and updating of dependencies
  • 🥗 written in typescript, type support out of the box
  • 🗜 small size: ~7kB gzipped (state + jsx + cssx)

Example

import { observable } from 'whatsup'
import { render } from 'whatsup/jsx'

function* App() {
    const counter = observable(0)
    const increment = () => counter(counter() + 1)

    while (true) {
        yield (
            <div>
                <p>You click {counter()} times</p>
                <button onClick={increment}>Click me</button>
            </div>
        )
    }
}

render(<App />)

Documentation

You can find the Whatsup documentation on the website.

Check out the Intro page for a quick overview.

The documentation is divided into several sections:

Examples

License

MIT (c) 2020-present, @iminside