Skip to main content

💧EventEmitter’s typesafe replacement💧

Home - Documentation - v2.0 🚀


'evt' is intended to be a replacement for 'events'.
It enables and encourages functional programming and makes heavy use of typescript’s type inference features to provide type safety while keeping things concise and elegant 🍸.

Suitable for any JS runtime env (deno, node, old browsers, react-native …)

Can be imported in TypeScript projects using version >= 3.4 (Mar 2019) and in any plain JS projects.

TL;DR*

import { Evt } from "evt";

const evtText = new Evt<string>();
const evtTime = new Evt<number>();

evtText.attach(text => console.log(text));
evtTime.attachOnce(time => console.log(time));

evtText.post("hi!"); //Prints "hi!"
evtTime.post(123);   //Prints "123"
evtTime.post(1234);  //Prints nothing

OR

import { Evt, to } from "evt";

const evt = new Evt<
    [ "text",  string ] | 
    [ "time",  number ]
>();

//Mind the '$' prefixing 'attach'
evt.$attach(to("text"), text => console.log(text));
evt.$attachOnce(to("time"), time => console.log(time));

evt.post(["text", "hi!"]);
evt.post(["time", 123]);
evt.post(["time", 1234]);

in React, it let you attach event listeners without having to worry about detaching them.

import { useState } from "react";
import { Evt } from "evt";
import { useEvt } from "evt/hooks";

const evtTick = Evt.create();

setInterval(()=> evtTick.post(), 1000);

function App(){

    const [count, setCount]= useState(0);

    useEvt(ctx=> {
    
        evtTick.attach(ctx, ()=> setCount(count+1));
    
    },[count]);
    
    return <h1>tick count: {count}</h1>;


}

run it

*Those are introductory examples, EVT can do much more than this.

Who is using it


Install / Import

In Deno:

import { Evt } from "https://deno.land/x/evt/mod.ts";

Anywhere else:

$ npm install --save evt
import { Evt } from "evt"; 

Try it

Run some examples

Motivations

There are a lot of things that can’t easily be done with EventEmitter:

  • Enforcing type safety.
  • Removing a particular listener ( if the callback is an anonymous function ).
  • Adding a one-time listener for the next event that meets a condition.
  • Waiting (via a Promise) for one thing or another to happen.
    Example: waiting at most one second for the next message, stop waiting if the socket disconnects.

Why would someone pick EVT over RxJS:

  • EVT’s learning curve is not as steep as RxJS’s.
  • Generates code that is easier to grasp for people not familiar with reactive programming.

EVT is an attempt to address all these points while trying to remain as accessible as EventEmitter.


Get started

The sticker

Shop