MQTT using Node.js with practical examples

Summary

This video tutorial demonstrates how to communicate with an MQTT broker using Node.js for both CLI and web applications. It showcases a simple CLI project and an Express web application, both interacting with a local Mosquitto MQTT broker. The tutorial uses the 'mqtt' package for Node.js, explaining how to install it and implement MQTT communication with sample code for subscriber and publisher functionalities. The video also includes a web application demo, showing real-time message exchange between publisher and subscriber through a browser interface.

Takeaways

• 📚 The video demonstrates communication with an MQTT broker using Node.js runtime.
• 🔌 Two practical applications are built: a CLI project and an Express web application.
• 📝 The local Mosquitto MQTT broker is used for communication with Node.js.
• 🛠️ The 'mqtt' npm package is utilized for MQTT communication in both applications.
• 🔧 Installation of the 'mqtt' package is done using 'npm install mqtt'.
• 📑 The CLI project includes 'subscriber.js' and 'publisher.js' scripts.
• 📡 The subscriber waits for messages on subscribed topics, while the publisher sends messages to topics.
• 🔄 The MQTT broker facilitates message exchange between the Node.js applications and itself.
• 🌐 The Express web application uses the same 'mqtt' package for browser-based interaction.
• 🖥️ The web application runs on port 3000, with separate pages for publishing and subscribing to MQTT topics.
• 🔍 The video includes a detailed explanation and code examples available on GitHub.

Q & A

What is the main topic of the video?

The video is about demonstrating how to communicate with an MQTT broker in a Node.js runtime environment using two example applications: a command-line interface (CLI) project and an Express web application.

What are the two example applications built in the video?

The two example applications are a CLI project that can be run in a shell or terminal, and an Express web application that can be accessed through a web browser.

What MQTT broker is used in the video?

The video uses a local Mosquitto MQTT broker for communication with the Node.js runtime.

What package is used to facilitate the communication with the MQTT broker in the Node.js applications?

The 'mqtt' package is used, which can be installed using the command 'npm install mqtt'.

Where can the complete code for the projects shown in the video be found?

The complete code for the projects is available in the presenter's GitHub repository, linked in the description of the video.

What are the two main JavaScript files used in the CLI project?

The two main JavaScript files for the CLI project are 'subscriber.js' and 'publisher.js'.

How does the subscriber.js file work in the CLI project?

The subscriber.js file subscribes to a particular topic and waits for any messages from the MQTT broker on that topic.

How does the publisher.js file work in the CLI project?

The publisher.js file publishes messages to a specified topic on the MQTT broker.

What is the purpose of the 'mqtt.connect' function in the video?

The 'mqtt.connect' function is used to establish a connection to the MQTT broker.

What happens when a message is published using the publisher.js file?

When a message is published using publisher.js, it is sent to the specified topic and received by the subscriber connected to that topic, as well as reflected in the Mosquitto broker terminal.

How does the video demonstrate the communication between the publisher and subscriber?

The video demonstrates communication by showing the process of publishing a message to a topic and receiving it on the subscriber side, with both applications (CLI and web) interacting with the Mosquitto MQTT broker.

What web framework is used in the Express web application project?

The Express web application project uses the Express web framework with EJS as the templating engine.

How can users interact with the MQTT broker through the web application?

Users can subscribe and publish messages to topics through the web application's interface, which communicates with the MQTT broker.

What is the URL for accessing the publisher and subscriber pages in the web application?

The URL for the publisher and subscriber pages is not explicitly mentioned in the script, but the web application runs on port 3000, suggesting that the pages can be accessed through 'http://localhost:3000/publisher' and 'http://localhost:3000/subscriber' or similar endpoints.

How does the web application handle browser requests?

The web application handles browser requests through routes defined in the Express framework, which then interact with controllers and the service layer to process the requests.

What is the role of the 'mqtt.service.js' file in the web application?

The 'mqtt.service.js' file contains the code that connects to the MQTT broker and is used by the controller layer to handle MQTT communication.

How does the video conclude?

The video concludes by summarizing the demonstration of MQTT communication in a Node.js environment and directing viewers to the companion write-up and code in the video description for further details.

Outlines

00:00

😀 Communicating with MQTT Broker in Node.js CLI and Web Applications

This paragraph introduces a tutorial on how to communicate with an MQTT broker using Node.js. Two practical applications are discussed: a command-line interface (CLI) project and an Express web application. The tutorial utilizes a local Mosquitto MQTT broker and the 'mqtt' package for Node.js, which is installed using npm. The presenter demonstrates the process of subscribing and publishing messages between the broker and Node.js applications. The code for both the subscriber and publisher is explained, including the setup of connection details and callback functions for message events. The paragraph concludes with the presenter showing how to publish messages to a topic and receive them in the subscriber terminal, indicating successful communication.

05:02

🌐 Building a Browser-Based MQTT Application with Node.js and Express

The second paragraph delves into creating a web application that uses MQTT for communication. It leverages the 'mqtt' package and follows the standard Node.js and Express folder structure, including routes, controllers, and a service layer. The presenter demonstrates running the web application, which allows users to subscribe and publish messages through web pages. The subscriber page enables users to subscribe to topics and receive published messages, while the publisher page allows sending messages to the broker. The presenter also covers the code structure, including the service layer responsible for connecting to the MQTT broker, the controller layer that manages the webpage templates, and the routing that handles browser requests. The explanation includes the use of EJS as a templating engine and the overall setup of the Express server.

10:06

📝 Conclusion and Further Resources for MQTT in Node.js

The final paragraph wraps up the tutorial by summarizing the use of MQTT in a Node.js environment and encouraging further exploration. It mentions that the detailed write-up and code for the project can be found in the video description, providing a resource for those interested in learning more. The paragraph concludes with a prompt for viewers to check out the code and a sign-off, indicating the end of the tutorial.

Keywords

💡MQTT

MQTT, which stands for 'Message Queuing Telemetry Transport,' is a lightweight messaging protocol designed for limited bandwidth and unreliable networks. It is used for machine-to-machine communication and IoT applications. In the video, MQTT is central to the theme as the creator demonstrates how to communicate with an MQTT broker using Node.js, showcasing its use in both CLI and web applications.

💡Node.js

Node.js is an open-source, cross-platform JavaScript runtime environment that allows developers to run JavaScript on the server side. It is the runtime environment used in the video to demonstrate how to interact with an MQTT broker. The script mentions building CLI and web applications using Node.js, highlighting its versatility in creating various types of applications.

💡CLI

CLI stands for Command Line Interface, which is a text-based interface used to interact with computer programs. In the video, the creator builds a CLI project that communicates with an MQTT broker, demonstrating the use of Node.js to create command-line applications that can subscribe to and publish messages on MQTT topics.

💡Express

Express is a minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications. The video showcases an Express web application that communicates with an MQTT broker, illustrating how Express can be used to create web applications that interact with IoT devices and services.

💡Mosquitto

Mosquitto is an open-source MQTT broker that enables the exchange of messages between devices. In the video, Mosquitto serves as the MQTT broker that the Node.js applications interact with, facilitating the demonstration of MQTT communication in both CLI and web applications.

💡Subscriber

In the context of MQTT, a subscriber is a client that receives messages on a specific topic. The video script describes a subscriber script that subscribes to an MQTT topic and waits for messages, exemplifying how a Node.js application can act as an MQTT subscriber.

💡Publisher

A publisher in MQTT is a client that sends messages to a specific topic. The video demonstrates a publisher script that publishes messages to an MQTT topic, showing how a Node.js application can act as an MQTT publisher.

💡npm

npm stands for Node Package Manager, a package manager for JavaScript and the default package manager for the JavaScript runtime environment Node.js. The video script includes a command 'npm install mqtt' to install the 'mqtt' package, which is used to connect Node.js applications to an MQTT broker.

💡EJS

EJS is a templating engine that allows developers to use plain JavaScript code to generate dynamic HTML. In the video, EJS is used in the Express web application to create HTML pages that interact with an MQTT broker, demonstrating its role in server-side rendering of web content.

💡Service Layer

In software architecture, the service layer is a logical layer that provides specific business functionality. In the video, the service layer contains the code connecting to the MQTT broker, abstracting the business logic from the presentation layer, which is a common practice in creating maintainable and scalable applications.

💡Controller Layer

The controller layer in software architecture is responsible for handling user input, performing operations on the model, and selecting the appropriate view to display. In the video, the controller layer interacts with the service layer to handle requests from the web application, demonstrating how it manages the flow of data between the user interface and the service layer.

Highlights

Introduction to communicating with an MQTT broker in a Node.js runtime.

Building two example applications: a CLI project and an Express web application.

Using a local Mosquitto MQTT broker for communication.

Installation of the 'mqtt' package using npm.

CLI project setup with subscriber.js and publisher.js.

Demonstration of subscribing to a topic and receiving messages.

Publishing messages to the same topic from a separate terminal.

Verification of message exchange between subscriber and publisher.

Simple code structure for MQTT communication in Node.js.

Creating a browser-based web application using the same MQTT package.

Node.js and Express folder structure for the web application.

Running the web application and accessing publisher and subscriber pages.

Subscribing and publishing messages through the web interface.

Unsubscribing from a topic to stop receiving messages.

Re-subscribing to receive messages again after an unsubscribe.

Code explanation for the service layer connecting to the MQTT broker.

Controller layer handling browser requests and returning responses.

Use of app.js for setting up the server and routes.

Companion write-up and code availability in the video description.

Transcripts

hi welcome to Don's gator in this video

I'm going to show you how you can

communicate with your mqtt broker in a

node.js runtime

we are building two example practical

application here one is a command line

interface or a CLI project that you can

run in your shell or your terminal and

the other is an Express web application

that you can run using your browser in

both this project I am using my local

mosquito mqtt broker which communicates

with my node.js runtime and bought my

CLI application and my Express web

application communicates with my mqtt

broker to the mqtt message exchange

between mosquito and node.js in what

this project we are gonna be using an NM

package called the mqtt

and all you have to do is to install it

using this command which is npm install

fqtt I have already done this so I will

not be executing this command now let's

go over to my first project which is my

CLI project

the complete code that I am showing you

here is available in my GitHub

repository which you can find in the

description of this video

I have here

my subscriber WPS and my publisher.js

and in the background is my mosquito

mqtt broker

so I have here to split terminal

the left side is for the publisher and

the right side is for that subscriber

let's just arrange the screen

if I execute the command node

subscriber.js

then you would notice that that this was

reflected in my mosquito broker terminal

that I have subscribed to a particular

topics since I have subscribed

then this terminal will wait for any

messages coming from my mosquito mqtt

broker in a separate terminal we are

going to publish some messages on the

same topic to do this I'm going to

execute the command node

publisher.js so let's try publishing

some message on the same puppy

as you can see I am subscribed to the

topic temperature so in my node

publisher.js I'm going to publish

something to the same topic which is

temperature

as you can see I am sending the topic

temperature and the message 32 and if

you check out the message from the

subscriber terminal you would see that I

have received the message 32 on the

topic temperature same also with my

mosquito mqtt broker you have noticed

that the publish was successfully

received by both the subscriber and the

publisher if we take a look at the code

it is really simple as I just import my

mqtt package here and set my and set my

connection details here I have a

function called connect broker that

connects to my qtt mosquito broker and

using this command which is

mqtt.connect and I have function here

called callback functions that gets

called

whenever something happened like this

message event which basically just logs

the topic and messages received from the

broker

to subscribe from any topic we just need

to execute this command and that's it it

will wait for any published messages on

the same topic if we go over to the

publisher.js then it has the same mqtt

connect functions and the only

difference here is this published

message functions which basically

publish a message on a particular topic

that is basically how easy it is to

communicate with an mqtt broker using

this code

and if you just follow these plants here

then you can create your own CLI

applications that communicates with your

own mqtt broker tli applications might

be a bit boring so if you wanted to

create your own browser-based web

application

then you can still leverage the same

mqtt and PM package I have here a node

Express mqtt web application that uses

the express web framework I will be

following the usual node.js and express

folder structure where I have routes

controllers

applied processing and using ejs here in

a service layer that communicates with

our acute mosquito broker

again the complete hood is in my GitHub

account and for demo purpose I'm going

to run this project let's go back into

my

third Visual Studio code and in this

command I'm just going to execute npm

run and then

you can see it says that and now able to

listen to at the application running in

Port 3000.

so

when you run the project we have here

the URL for my publisher page

and

I have here the URL for my subscriber

on the subscriber page we can subscribe

to any topic like I'm pretty sure

temperature temperature

and we click the Subscribe button you

would notice that it says that the

status bar here that you are subscribed

if I publish something in on the

publisher page

like

I click 32 and click publish

then you would notice that

it was displayed in the message section

of the publisher page let's try again so

28

and then 31

now if I unsubscribe to the same Peak

temperature then I am expecting that I

should not be receiving any mqtt message

from my publisher so I click unsubscribe

now I am unsubscribed then I'll send in

another message

notice nothing is happening let's try

again 40.

okay nothing is happening if I click the

Subscribe button again I'm subscribed

then if I type in a new temperature and

I publish then you would notice that it

gets published that's right for the last

time

then you would notice that the publisher

is able to send messages into the

subscriber through my mosquito mqtt

broker but the publisher and the

subscriber application is running in my

node.js project

take a look at the code that I have here

the usual node.js directory structure

where I have here the controllers

the routes the service layer and the

templating engine

using the ejs

if we take a look at the service layer

The mqtt

service.js Click contains our it

contains our code that will connect to

our mqtt broker

which is almost similar to what we have

discussed in the CLI application the

service layer is used by the controller

layer here

the controller layer in turns returns

our ejs template

like this one which is our HTML pages

like here

and for the subscriber

so

the routes on the other hand like this

one handles our browser request if it is

get or a post request then it asks the

controller

to handle the request

the return of the controller could

either be an HTML or a Json data

all of these components are tied up by

our app.js file server

which sets up the static files to serve

our static assets and set that view

engine to ejs and we have here the

parsing of the request and several

routes that we have created also

and you can see here that it is using

the Subscribe router and the publish

router and it runs and listen to the

port 3000

that is all for the code actually depend

on how you could leverage mqtt in a

node.ap.js environment the companion

write up of this video contains much

detailed explanation of this project the

right app and the code can be found in

the description of this video I hope you

learned something public exploring

foreign

[Music]