{"id":16998525,"url":"https://github.com/felipewind/poc-mosquitto-quarkus-angular","last_synced_at":"2026-04-11T06:35:34.104Z","repository":{"id":159933599,"uuid":"373354792","full_name":"felipewind/poc-mosquitto-quarkus-angular","owner":"felipewind","description":"A POC to integrate Quarkus and Angular using Mosquitto.","archived":false,"fork":false,"pushed_at":"2021-06-03T10:03:47.000Z","size":511,"stargazers_count":1,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-01-27T07:42:11.738Z","etag":null,"topics":["angular","docker","docker-compose","mosquitto-mqtt-broker","quarkus"],"latest_commit_sha":null,"homepage":"","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/felipewind.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-06-03T02:08:37.000Z","updated_at":"2021-06-03T14:57:59.000Z","dependencies_parsed_at":null,"dependency_job_id":"dfcdb076-3f35-4e2d-95c9-dc171371b44e","html_url":"https://github.com/felipewind/poc-mosquitto-quarkus-angular","commit_stats":{"total_commits":5,"total_committers":1,"mean_commits":5.0,"dds":0.0,"last_synced_commit":"79e09132d669db215e00e605b33cc57591affb33"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felipewind%2Fpoc-mosquitto-quarkus-angular","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felipewind%2Fpoc-mosquitto-quarkus-angular/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felipewind%2Fpoc-mosquitto-quarkus-angular/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felipewind%2Fpoc-mosquitto-quarkus-angular/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/felipewind","download_url":"https://codeload.github.com/felipewind/poc-mosquitto-quarkus-angular/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244921195,"owners_count":20532199,"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","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":["angular","docker","docker-compose","mosquitto-mqtt-broker","quarkus"],"created_at":"2024-10-14T04:05:30.365Z","updated_at":"2025-12-30T23:51:27.442Z","avatar_url":"https://github.com/felipewind.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# poc-mosquitto-quarkus-angular\n\n- [Overview](#overview)\n- [Chat](#chat)\n- [Fast Way to run the project](#Fast-way-to-run-the-project)\n- [Building it locally and running with Docker](#Building-it-locally-and-running-with-Docker)\n- [Running with development mode](#Running-with-development-mode)\n- [Mosquitto](#Mosquitto)\n- [Quarkus](#Quarkus)\n- [Angular](#Angular)\n- [Credits](#Credits)\n- [Extras](#Extras)\n\n# Overview\n\nA POC to integrate Quarkus and Angular using Mosquitto.\n\n![image](./documentation/design/poc-mosquitto-quarkus-angular.png)\n\n# Chat\n\nJust start the project and then acces the chat!\n\n[Quarkus Chat](http://localhost:8080/chat.html)\n\n[Angular Chat](http://localhost/)\n\n# Fast way to run the project\n\nJust bring up the following docker-compose.yml:\n```yaml\nversion: \"3.8\"\n\nservices:\n  mosquitto:\n    container_name: mqtt-mosquitto\n    image: felipewind/poc-mqtt-mosquitto:2.0.10\n    restart: always\n    networks:\n      - poc-mqtt-net\n    ports:\n      - 1883:1883\n      - 9001:9001\n\n  quarkus:\n    container_name: mqtt-quarkus\n    image: felipewind/poc-mqtt-quarkus:1.0\n    ports:\n      - 8080:8080\n    networks:\n      - poc-mqtt-net\n    depends_on:\n      - mosquitto\n    environment:\n      - mp.messaging.outgoing.topic-send-chat.host=mosquitto\n      - mp.messaging.incoming.topic-receive-chat.host=mosquitto\n\n  angular:\n    container_name: mqtt-angular\n    image: felipewind/poc-mqtt-angular:1.0\n    ports:\n      - 80:80\n    networks:\n      - poc-mqtt-net\n    depends_on:      \n      - mosquitto\n\nnetworks:\n  poc-mqtt-net:\n    driver: bridge\n```\n\nOr run `run-from-docker-hub.sh`.\n\n\n# Building it locally and running with Docker\n\nRun `run-with-local-build.sh`.\n\n\n# Running with development mode\n\nStart Mosquitto:\n```\n$ docker run -it -p 1883:1883 -p 9001:9001 --name mosquitto --rm felipewind/poc-mqtt-mosquitto:2.0.10\n```\n\nOn the `angular` folder:\n```\n$ npm install\n$ ng serve\n```\n\nOn the `quarkus` folder:\n```\n$ mvn quarkus:dev\n```\n\n\n# Mosquitto \n\nMosquitto is running providing TCP connection on port 1883 and Websocket connection on port 9001.\n\nmosquitto.conf:\n```\nallow_anonymous true \n\n# this will listen for mqtt on tcp\nlistener 1883 0.0.0.0\n\n# this will expect websockets connections\nlistener 9001 0.0.0.0\nprotocol websockets\n```\n\n\n# Quarkus\n\n## Chat\n\nQuarkus provides Websockets to its [chat](http://localhost:8080/chat.html).\n\nYou can open how many `Quarkus Chats` you want!\n\nEvery message received from the chat is published on the `chat` topic.\n\nEvery message received from the `chat` topic is broadcasted to the Websocket connection.\n\n![image](./documentation/images/quarkus-chat.png)\n\n## MQTT tester\n\nThere's one [MQTT tester](http://localhost:8080/mqtt.html) where you can see the last message that was published to the `chat` topic.\n\n![image](./documentation/images/quarkus-mqtt-tester.png)\n\n## Swagger\n\nIt's possible to acces the [swagger](http://localhost:8080/q/swagger-ui/) and send one message directly to the `chat` topic.\n\n![image](./documentation/images/quarkus-swagger.png)\n\n# Angular\n\nAngular communicates with Mosquitto using the Websockets protocol.\n\nYou can acces its [chat](http://localhost) and send and read the messages.\n\n![image](./documentation/images/angular-chat.png)\n\n# Credits\n\n## Mosquitto configuration\n\nhttps://github.com/tiagostutz/eclipse-mosquitto-ws\n\nhttps://stackoverflow.com/questions/34408624/how-do-i-enable-both-tcp-and-web-sockets-in-mosquitto\n\n## Connect Angular with Mosquitto\n\nhttps://medium.com/@anant.lalchandani/dead-simple-mqtt-example-over-websockets-in-angular-b9fd5ff17b8e\n\nhttps://github.com/anantl05/angular-mqtt\n\n## Providing Websockets and connecting to Mosquitto with Quarkus\n\nhttps://github.com/quarkusio/quarkus-quickstarts/tree/main/websockets-quickstart\n\nhttps://github.com/quarkusio/quarkus-quickstarts/tree/main/mqtt-quickstart\n\nhttps://quarkus.io/blog/reactive-messaging-emitter/\n\n\n\n# Extras\n\nhttp://ddewaeletest.github.io/testblog/iot/mqtt/2015/09/21/building-mosquitto-with-websocket-support.html\n\nhttp://www.steves-internet-guide.com/mqtt-websockets/\n\nhttps://www.hivemq.com/blog/mqtt-essentials-special-mqtt-over-websockets/\n\n## MQTT softwares\n\nhttps://www.hivemq.com/\n\nhttps://github.com/mqttjs/MQTT.js\n\nhttps://github.com/eclipse/paho.mqtt.javascript\n\nhttps://github.com/jpmens/simple-mqtt-websocket-example\n- Uses Paho MQTT JavaScript client\n- Just clone this project and open the index.html\n\n## Web clients to test online\n\nhttp://www.hivemq.com/demos/websocket-client/\n\nhttps://mitsuruog.github.io/what-mqtt/\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffelipewind%2Fpoc-mosquitto-quarkus-angular","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffelipewind%2Fpoc-mosquitto-quarkus-angular","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffelipewind%2Fpoc-mosquitto-quarkus-angular/lists"}