{"id":18947277,"url":"https://github.com/gunerkaanalkim/pubs","last_synced_at":"2025-08-16T18:09:00.564Z","repository":{"id":44003128,"uuid":"237777373","full_name":"gunerkaanalkim/pubs","owner":"gunerkaanalkim","description":"a message broker that applied publisher/subscriber pattern with Typescript","archived":false,"fork":false,"pushed_at":"2023-01-05T06:29:03.000Z","size":790,"stargazers_count":2,"open_issues_count":13,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-08-09T13:41:57.813Z","etag":null,"topics":["message-broker","publisher-subscriber","pubsub","typescript"],"latest_commit_sha":null,"homepage":"https://gunerkaanalkim.github.io/pubs/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/gunerkaanalkim.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-02-02T13:44:10.000Z","updated_at":"2023-08-09T07:10:45.000Z","dependencies_parsed_at":"2023-02-03T15:46:26.407Z","dependency_job_id":null,"html_url":"https://github.com/gunerkaanalkim/pubs","commit_stats":null,"previous_names":["gunerkaanalkim/pub-sub"],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/gunerkaanalkim/pubs","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gunerkaanalkim%2Fpubs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gunerkaanalkim%2Fpubs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gunerkaanalkim%2Fpubs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gunerkaanalkim%2Fpubs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gunerkaanalkim","download_url":"https://codeload.github.com/gunerkaanalkim/pubs/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gunerkaanalkim%2Fpubs/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":270749268,"owners_count":24638692,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-16T02:00:11.002Z","response_time":91,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["message-broker","publisher-subscriber","pubsub","typescript"],"created_at":"2024-11-08T13:09:29.042Z","updated_at":"2025-08-16T18:09:00.536Z","avatar_url":"https://github.com/gunerkaanalkim.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n    \u003ca href=\"https://circleci.com/gh/gunerkaanalkim/pubs/tree/dev\"\u003e\u003cimg src=\"https://circleci.com/gh/gunerkaanalkim/pubs.svg?style=shield\" alt=\"Build Status\"\u003e\u003c/a\u003e\n    \u003ca href=\"https://codecov.io/gh/gunerkaanalkim/pub-sub\"\u003e\u003cimg src=\"https://codecov.io/gh/gunerkaanalkim/pub-sub/branch/master/graph/badge.svg\" /\u003e\u003c/a\u003e\n    \u003ca href=\"https://opensource.org/licenses/MIT\"\u003e\u003cimg src=\"https://img.shields.io/badge/License-MIT-green.svg\"/\u003e\u003c/a\u003e\n    \u003ca href=\"https://github.com/gunerkaanalkim/pubs/issues\"\u003e\u003cimg src=\"https://img.shields.io/github/issues/gunerkaanalkim/pubs?color=red\"/\u003e\u003c/a\u003e\n    \u003ca href=\"https://www.npmjs.com/package/pubs-js\"\u003e\u003cimg src=\"https://img.shields.io/github/issues-closed/gunerkaanalkim/pubs?color=green\"/\u003e\u003c/a\u003e\n    \u003ca href=\"https://www.npmjs.com/package/pubs-js\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/pubs-js.svg?color=yellow\"/\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\u003ch2 align=\"center\"\u003eIndex\u003c/h2\u003e\n\n\u003cul\u003e\n    \u003cli\u003e\n        \u003ca href=\"#introduction\"\u003eIntroduction\u003c/a\u003e\n    \u003c/li\u003e\n    \u003cli\u003e \n        \u003ca href=\"#publisher-at-a-glance\"\u003ePublisher at a glance\u003c/a\u003e \n        \u003cul\u003e\n            \u003cli\u003e\u003ca href=\"#publishers-api\"\u003ePublisher's API\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n    \u003c/li\u003e\n    \u003cli\u003e \n        \u003ca href=\"#subscriber-at-a-glance\"\u003eSubscriber at a glance\u003c/a\u003e \n        \u003cul\u003e\n            \u003cli\u003e\u003ca href=\"#subscribers-api\"\u003eSubscribers's API\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n    \u003c/li\u003e\n    \u003cli\u003e \n        \u003ca href=\"#eventbus-at-a-glance\"\u003eEventbus at a glance\u003c/a\u003e \n        \u003cul\u003e\n            \u003cli\u003e\u003ca href=\"#publisher-object\"\u003ePublisher Object\u003c/a\u003e\u003c/li\u003e\n            \u003cli\u003e\u003ca href=\"#subscriber-object\"\u003eSubscriber Object\u003c/a\u003e\u003c/li\u003e\n            \u003cli\u003e\u003ca href=\"#eventbus-api\"\u003eEventbus's API\u003c/a\u003e\u003c/li\u003e\n        \u003c/ul\u003e\n    \u003c/li\u003e\n    \u003cli\u003e\n        \u003ca href=\"#a-complete-example\"\u003eA Complete Example\u003c/a\u003e\n    \u003c/li\u003e\n    \u003cli\u003e\n            \u003ca href=\"#with-react\"\u003eWith React\u003c/a\u003e\n    \u003c/li\u003e\n    \u003cli\u003e\n            \u003ca href=\"#with-vue\"\u003eWith Vue\u003c/a\u003e\n    \u003c/li\u003e\n    \u003cli\u003e\n            \u003ca href=\"#with-angular\"\u003eWith Angular\u003c/a\u003e\n    \u003c/li\u003e\n\u003c/ul\u003e\n\n---\n\n\u003ch2 align=\"center\" id=\"introduction\"\u003eIntroduction\u003c/h2\u003e\nPubs is a client-side message broker written in Typescript. \nThe main idea is to provide state passing of web components between each other.\nPubs is completely focused on component communication.\nTo understand how the publisher/subscriber approach works, you can look at the image below.\n\n\u003cimg src=\"https://user-images.githubusercontent.com/5802308/74986695-9dcd1e00-544a-11ea-8a5a-5f610b0a7408.png\" alt=\"Build Status\"\u003e\n\nPubs basically consists of three parts; Eventbus, Publisher and Subscriber.\nEventbus stores `topic` and `state`. \nPublisher is message sender for Eventbus that can send any type of message; string, array, number etc.\nSubscriber is message sink for Eventbust that subscribes to messages sent with the help of a callback method.\n\n\u003ch2 align=\"center\" id=\"publisher-at-a-glance\"\u003ePublisher at a glance \u003c/h2\u003e\nPublisher publish a state object to eventbus with its `constructor` and `send` method.\n\n````typescript\nlet pub = new Publisher({\n    topic: 'topic_1',\n    state: {\n        name: \"Patrick\",\n        surname: \"Swayze\",\n        message: \"R.I.P\"\n    }\n});\n````\n\nTopic and state attributes can change later with `setter` \u0026 `getter`\n\n````typescript\nlet pub = new Publisher({\n    topic: 'topic_1',\n    state: {\n        name: \"Patrick\",\n        surname: \"Swayze\",\n        message: \"R.I.P\"\n    }\n});\n\npub.topic = \"another_topic\"\npub.state = { foo: \"bar\" }\n\n````\nYou can publish the state to the `eventbus` using the `send` method.\n\n````typescript\nlet eventbus = new Eventbus();\n\nlet pub = new Publisher({\n    topic: \"topic_1\",\n    state: {}\n});\n\neventbus.publisher.add(pub);\n\n// Foo\n// Bar\n// Tar\n\npub.send({\n    name: \"Patrick\",\n    surname: \"Swayze\",\n    filmography: [\"Ghost\"]\n});\n````\n\u003ch2 id=\"publishers-api\"\u003ePublisher's API\u003c/h2\u003e\n\n| Name            | Type                          | Description                  |\n|-----------------|-------------------------------|------------------------------|\n| topic           | string                        | none                         |\n| state           | any                           | none                         |\n\n\n---\n\n\u003ch2 align=\"center\" id=\"subscriber-at-a-glance\"\u003eSubscriber at a glance \u003c/h2\u003e\nSubscribers listens to a `topic` on the `eventbus` using a `callback` method.\nSubscriber initialize with constructor method.\nSubscribers must have a unique `id` attribute.\n\n````typescript\nlet sub = new Subsciber({\n    id: \"sub_1\",\n    topic: \"topic_1\",\n    callback: (state) =\u003e {\n        console.log(state);\n    }\n});\n````\n\nSubscribers can be listen multiple topic.\n\n```typescript\nlet sub = new Subsciber({\n    id: \"sub_1\",\n    topic: [\"topic_1\", \"topic_2\", \"topic_3\"],\n    callback: (state) =\u003e {\n        console.log(state);\n    }\n});\n```\n\nDifferent subscribers can listen common topic on eventbus.\n\n```typescript\nlet pub_1 = new Publisher({\n    topic: \"topic_1\",\n//...\n\nlet sub_1 = new Subsciber({\n    id: \"sub_1\",\n    topic: [\"topic_1\"],\n    callback: (state) =\u003e {\n        console.log(\"It's sub_1\");\n    }\n});\n\nlet sub_2 = new Subsciber({\n    id: \"sub_2\",\n    topic: [\"topic_1\"],\n    callback: (state) =\u003e {\n        console.log(\"It's sub_2\");\n    }\n});\n```\n\n\u003ch2 id=\"subscribers-api\"\u003eSubscribers's API\u003c/h2\u003e\nComing soon\n\n---\n\n\u003ch2 align=\"center\" id=\"eventbus-at-a-glance\"\u003eEventbus at a glance \u003c/h2\u003e\nEventbus stores `topic` and `state`. Eventbus initialize with contructor method.\nEventbus have two public object; `publisher` \u0026 `subscriber`\n\n```typescript\nlet eventbus = new Eventbus();\n```\n\n\u003ch3 id=\"publisher-object\"\u003ePublisher Object\u003c/h3\u003e\n\nPublishers can register with add method of publisher object.\n\n```typescript\nconst eventbus = new Eventbus();\n\nlet pub_1 = new Publisher({\n    topic: \"topic_1\",\n    state: {name: \"Patrick Swayze\"}\n});\n\nlet pub_2 = new Publisher({\n    topic: \"topic_2\",\n    state: {name: \"Demi Moore\"}\n});\n\nlet pub_3 = new Publisher({\n    topic: \"topic_3\",\n    state: {name: \"Whoopi Goldberg\"}\n});\n\neventbus.publisher.add(pub_1);\neventbus.publisher.add(pub_2);\neventbus.publisher.add(pub_3);\n```\n\n\u003ch3 id=\"subscriber-object\"\u003eSubscriber Object\u003c/h3\u003e\n\nSubscribers can register with add method of eventbus.\n\n```typescript\nconst eventbus = new Eventbus();\n\nlet sub_1 = new Subsciber({\n    id: \"sub_1\",\n    topic: \"topic_1\",\n    callback: (state) =\u003e console.log(state)\n});\n\nlet sub_2 = new Subsciber({\n    id: \"sub_2\",\n    topic: \"topic_2\",\n    callback: (state) =\u003e console.log(state)\n});\n\nlet sub_3 = new Subsciber({\n    id: \"sub_3\",\n    topic: [\"topic_1\", \"topic_2\"],\n    callback: (state) =\u003e console.log(state)\n});\n\neventbus.subscriber.add(sub_1);\neventbus.subscriber.add(sub_2);\neventbus.subscriber.add(sub_3);\n```\n\n\u003ch2 id=\"eventbus-api\"\u003eEventbus's API\u003c/h2\u003e\nComing soon\n\n---\n\n\u003ch2 align=\"center\" id=\"a-complete-example\"\u003eA Complete Example\u003c/h2\u003e\nComing soon\n\n\u003ch2 align=\"center\" id=\"with-react\"\u003eWith React\u003c/h2\u003e\nComing soon\n\n\u003ch2 align=\"center\" id=\"with-vue\"\u003eWith Vue\u003c/h2\u003e\nComing soon\n\n\u003ch2 align=\"center\" id=\"with-angular\"\u003eWith Angular\u003c/h2\u003e\nComing soon","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgunerkaanalkim%2Fpubs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgunerkaanalkim%2Fpubs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgunerkaanalkim%2Fpubs/lists"}