Skip to content

Commit 44362fe

Browse files
authored
Spruce up the readme 🌲
1 parent bf03623 commit 44362fe

File tree

1 file changed

+36
-27
lines changed

1 file changed

+36
-27
lines changed

README.md

Lines changed: 36 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,46 @@
1-
# `mitt`
1+
<p align="center">
2+
<img src="https://i.imgur.com/BqsX9NT.png" width="256" height="256" alt="mitt">
3+
<br>
4+
<b>Mitt</b>: tiny 200b functional event emitter / pubsub.
5+
<br>
6+
<a href="https://www.npmjs.org/package/mitt"><img src="https://img.shields.io/npm/v/mitt.svg?style=flat" alt="npm"></a> <a href="https://travis-ci.org/developit/mitt"><img src="https://travis-ci.org/developit/mitt.svg?branch=master" alt="travis"></a>
7+
</p>
28

3-
[![NPM](https://img.shields.io/npm/v/mitt.svg?style=flat)](https://www.npmjs.org/package/mitt)
4-
[![travis-ci](https://travis-ci.org/developit/mitt.svg?branch=master)](https://travis-ci.org/developit/mitt)
59

6-
**Tiny (~200b) functional event emitter / pubsub.**
10+
## Why Mitt?
11+
12+
- **Microscopic:** weighs less than 200 bytes gzipped
13+
- **Useful:** a wildcard `"*"` event type listens to all events
14+
- **Famliar:** same names & ideas as [Node's EventEmitter](https://nodejs.org/api/events.html#events_class_eventemitter)
15+
- **Functional:** methods don't rely on `this`
16+
- **Great Name:** somehow [mitt](https://npm.im/mitt) wasn't taken
717

8-
**It's tiny:** no dependencies and only **190 bytes** when gzipped _(250b without)_.
918

1019
* * *
1120

12-
## Installation
1321

14-
```sh
15-
npm install --save mitt
22+
## Usage
23+
24+
After installing via `npm install --save mitt`:
25+
26+
```js
27+
import mitt from 'mitt'
28+
29+
let emitter = mitt()
30+
31+
// listen to an event
32+
emitter.on('foo', e => console.log('foo', e) )
33+
34+
// listen to all events
35+
emitter.on('*', (type, e) => console.log(type, e) )
36+
37+
// fire an event
38+
emitter.emit('foo', { a: 'b' })
39+
40+
// working with handler references:
41+
function onFoo() {}
42+
emitter.on('foo', onFoo) // listen
43+
emitter.off('foo', onFoo) // unlisten
1644
```
1745

1846
* * *
@@ -52,22 +80,3 @@ If present, `"*"` handlers are invoked prior to type-matched handlers.
5280

5381
- `type` **[String](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)** The event type to invoke
5482
- `event` **\[Any]** An event object, passed to each handler
55-
56-
* * *
57-
58-
## Sample usage
59-
60-
```es6
61-
import mitt from 'mitt'
62-
63-
let emitter = mitt()
64-
65-
// listen to an event
66-
emitter.on('foo', e => console.log('foo', e) )
67-
68-
// listen to all events
69-
emitter.on('*', (type, e) => console.log(type, e) )
70-
71-
// fire an event
72-
emitter.emit('foo', { a: 'b' })
73-
```

0 commit comments

Comments
 (0)