Index
- Introduction
- Publisher at a glance
- Subscriber at a glance
- Eventbus at a glance
- A Complete Example
- With React
- With Vue
- With Angular
Introduction
Pubs is a client-side message broker written in Typescript. The main idea is to provide state passing of web components between each other. Pubs is completely focused on component communication. To understand how the publisher/subscriber approach works, you can look at the image below.Pubs basically consists of three parts; Eventbus, Publisher and Subscriber.
Eventbus stores topic
and state
.
Publisher is message sender for Eventbus that can send any type of message; string, array, number etc.
Subscriber is message sink for Eventbust that subscribes to messages sent with the help of a callback method.
Publisher at a glance
Publisher publish a state object to eventbus with its `constructor` and `send` method.;
Topic and state attributes can change later with setter
& getter
; pub.topic = "another_topic"pub.state =
You can publish the state to the eventbus
using the send
method.
; ; eventbus.publisher.addpub; // Foo// Bar// Tar pub.send;
Publisher's API
Name | Type | Description |
---|---|---|
topic | string | none |
state | any | none |
Subscriber at a glance
Subscribers listens to a `topic` on the `eventbus` using a `callback` method. Subscriber initialize with constructor method. Subscribers must have a unique `id` attribute.;
Subscribers can be listen multiple topic.
;
Different subscribers can listen common topic on eventbus.
Subscribers's API
Coming soonEventbus at a glance
Eventbus stores `topic` and `state`. Eventbus initialize with contructor method. Eventbus have two public object; `publisher` & `subscriber`;
Publisher Object
Publishers can register with add method of publisher object.
; ; ; ; eventbus.publisher.addpub_1;eventbus.publisher.addpub_2;eventbus.publisher.addpub_3;
Subscriber Object
Subscribers can register with add method of eventbus.
; ; ; ; eventbus.subscriber.addsub_1;eventbus.subscriber.addsub_2;eventbus.subscriber.addsub_3;