# deku

> Render interfaces using pure functions and virtual DOM

Latest version **2.0.0-rc16** (published 2016-01-26) · MIT license · 0 weekly downloads

## Install

```sh
npm install deku
pnpm add deku
yarn add deku
bun add deku
```

## Health

**Score 23/100 (F)** — status: abandoned.

Positive: has types package; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.0.0-rc16 |
| Published | 2016-01-26 |
| First published | 2015-01-13 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | separate (@types/deku) |
| Module format | CommonJS |
| Dependencies | 7 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3386 |
| Maintainers | anthonyshort, dominicbarnes, stevenmiller888 |
| Keywords | deku, functional, react, virtual, dom, elm, redux |

## Links

- npm: https://www.npmjs.com/package/deku
- Repository: https://github.com/dekujs/deku
- Homepage: https://github.com/dekujs/deku#readme
- Issues: https://github.com/dekujs/deku/issues
- npm.io page: https://npm.io/package/deku

## Dependencies (7)

- [uid](https://npm.io/package/uid.md) 0.0.2
- [dift](https://npm.io/package/dift.md) 0.1.12
- [setify](https://npm.io/package/setify.md) 1.0.3
- [index-of](https://npm.io/package/index-of.md) 0.2.0
- [union-type](https://npm.io/package/union-type.md) 0.1.6
- [is-svg-element](https://npm.io/package/is-svg-element.md) 1.0.1
- [svg-attribute-namespace](https://npm.io/package/svg-attribute-namespace.md) 2.1.0

## Alternatives

- [babylon](https://npm.io/package/babylon.md) — 5.1M weekly downloads
- [csscolorparser](https://npm.io/package/csscolorparser.md) — 3.7M weekly downloads
- [expr-eval-fork](https://npm.io/package/expr-eval-fork.md) — 1.5M weekly downloads
- [@leeoniya/ufuzzy](https://npm.io/package/@leeoniya/ufuzzy.md) — 247.7K weekly downloads
- [xml-parser](https://npm.io/package/xml-parser.md) — 78.4K weekly downloads

## Recent versions

- 2.0.0-rc16 (latest) — 2016-01-26
- 2.0.0-rc15 — 2016-01-19
- 2.0.0-rc14 — 2016-01-18
- 2.0.0-rc13 — 2016-01-14
- 2.0.0-rc12 — 2016-01-09
- 2.0.0-rc11 — 2016-01-09
- 2.0.0-rc10 — 2016-01-09
- 2.0.0-rc9 — 2016-01-06
- 2.0.0-rc8 — 2016-01-04
- 2.0.0-rc7 — 2015-12-31
- 2.0.0-rc6 — 2015-12-29
- 2.0.0-rc5 — 2015-12-29
- 2.0.0-rc4 — 2015-12-28
- 2.0.0-rc3 — 2015-12-28
- 2.0.0-rc2 — 2015-12-28
- … 72 more at https://npm.io/package/deku/versions

## README

# Deku

[![version](https://img.shields.io/travis/dekujs/deku.svg?style=flat-square)](https://travis-ci.org/dekujs/deku)
[![version](https://img.shields.io/npm/v/deku.svg?style=flat-square)](https://www.npmjs.com/package/deku)
[![js-standard-style](https://img.shields.io/badge/code%20style-standard-brightgreen.svg?style=flat-square)](https://github.com/feross/standard)
[![npm downloads](https://img.shields.io/npm/dm/deku.svg?style=flat-square)](https://www.npmjs.com/package/deku)
[![discord](https://img.shields.io/badge/Discord-Join%20Chat%20→-738BD7.svg?style=flat-square)](https://discord.gg/0gNkyCAVkDYsBaFe)

Deku is a library for rendering interfaces using pure functions and virtual DOM.

Instead of using classes and local state, Deku just uses functions and pushes the responsibility of all state management and side-effects onto tools like [Redux](http://redux.js.org/). It also aims to support only modern browsers to keep things simple.

It can be used in place of libraries like React and works well with Redux and other libraries in the React ecosystem.

Deku consists of 5 modules packaged together for convenience:

* `element`: Create virtual elements.
* `diff`: Compute the difference between two virtual elements. You can use this if you're creating a custom renderer.
* `dom`: Create DOM elements from virtual elements and update them using the result of a diff. You'll only use this directly if you're building your own app creator.
* `string`: Render a HTML string from virtual elements.
* `createApp`: Kickstart an app for the browser.

### Installation

```
npm install --save deku
```

We support the latest two versions of each browser. This means we only support IE10+.

[![Sauce Test Status](https://saucelabs.com/browser-matrix/deku.svg)](https://saucelabs.com/u/deku)

### Example

```js
/** @jsx element */
import {element, createApp} from 'deku'
import {createStore} from 'redux'
import reducer from './reducer'

// Dispatch an action when the button is clicked
let log = dispatch => event => {
  dispatch({
    type: 'CLICKED'
  })
}

// Define a state-less component
let MyButton = {
  render: ({ props, children, dispatch }) => {
    return <button onClick={log(dispatch)}>{children}</button>
  }
}

// Create a Redux store to handle all UI actions and side-effects
let store = createStore(reducer)

// Create an app that can turn vnodes into real DOM elements
let render = createApp(document.body, store.dispatch)

// Update the page and add redux state to the context
render(
  <MyButton>Hello World!</MyButton>,
  store.getState()
)
```

### Documentation

You can [read the documentation online](https://dekujs.github.io/deku).

### License

The MIT License (MIT) Copyright (c) 2015 Anthony Short

---
_Source: https://npm.io/package/deku · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
