IoT Web Controlled Smart Notice Board with ESP8266

In this
DIY IoT Project
, we will make
IoT Based Smart Web Controlled Notice Board
using
NodeMCU ESP8266
&
LCD Display
. We have created a local web server for demonstration, and for displaying message we have used LCD.
Overview
Notice Board
is the most common and primary apparatus in any institution, organization, or public utility places like a bus station, railways stations, and parks. But sticking various notices day today is a difficult process. This project deals with a
wireless notice board
. The main objective of the project is to develop a wireless notice board that displays messages sent from the webserver. When a user sends a message, it is received by a wifi Module through
Local Web Server
A display connected to a server system should continuously listen for the incoming messages from the user, process it, and display it on the LCD screen. The message displayed should be updated every time the user sends new information. Only authenticated people should update the data to be displayed on the LCD.
Bill of Materials
Following are the comoponents required for making IoT Based Web Controlled Smart Notice Board. All the components can be easily purchased from Amazon. The component purchase link is given below.
S.N.
Components
Quantity
Purchase Links

NodeMCU ESP8266 Board

Amazon
AliExpress

16x2 LCD Display

Amazon
AliExpress

Connecting Wires

Amazon
AliExpress

Potentiometer 10K

Amazon
AliExpress

Breadboard

Amazon
AliExpress
Circuit Diagram for Web Controlled Notice Board with ESP8266
To make
IoT Based Web Controlled Smart Notice Board
, we need to interface 16X2 LCD Display with Nodemcu ESP8266 Board. So the
circuit diagram
with detailed connection is given below.
We need following connections between NodeMCU & LCD Display.
RS pin of LCD — D0 pin of NodeMCU
EN pin of LCD — D1 pin of NodeMCU
D4 pin of LCD — D2 pin of NodeMCU
D5 pin of LCD — D3 pin of NodeMCU
D6 pin of LCD — D4 pin of NodeMCU
D7 pin of LCD — D5 pin of NodeMCU
Similarly connect pin 1, 5, 16 of LCD to GND & Pin 2, 15 to 5V VCC. A 10K Potentiometer should be used at pin 3 of LCD to adjust the contrast. The whole device operates at 5V.
Source Code/Program
Copy the code given below and upload it to Nodemcu board. But before that you need install two libraries to make the
local web server
. Download these libraries from the given links:
1. ESPAsyncTCP Library:
Download
2. ESPAsycnWebServer Library:
Download

#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include <LiquidCrystal.h>
LiquidCrystal
lcd
(
D0
D1
D2
D3
D4
D5
)
;
AsyncWebServer
server
(

)
;
const
char
*
ssid
=
"Sri Krishna 2."
;
//wifi ssid
const
char
*
password
=
"subbu@123"
;
//wifi password
const
char
*
PARAM_INPUT_1
=
"input1"
;
const
char
index_html
[
]
PROGMEM
=
R
"rawliteral(
<!DOCTYPE HTML><html><head>
<title>Smart Notice Board</title>
<meta name="
viewport
" content="
width
=
device
width
initial
scale
=

">
<p> <font size="

" face="
sans
serif
"> <marquee> Smart Notice Board </marquee> </font> </p>
</head><body><center>
<form action="
/
get
">
Enter Text to Display: <input type="
text
" name="
input1
">
<input type="
submit
" value="
Send
">
</form><br>
</center></body></html>)rawliteral"
;
void
notFound
(
AsyncWebServerRequest *
request
)
{
request
->
send
(

"text/plain"
"Not found"
)
;
}
void
setup
(
)
{
Serial
begin
(
115200
)
;
lcd
begin
(

)
;
lcd
clear
(
)
;
lcd
setCursor
(

)
;
lcd
(
"Smart Notice Board"
)
;
WiFi
mode
(
WIFI_STA
)
;
WiFi
begin
(
ssid
password
)
;
if
(
WiFi
waitForConnectResult
(
)
!=
WL_CONNECTED
)
{
Serial
println
(
"WiFi Failed!"
)
;
return
;
}
Serial
println
(
)
;
Serial
(
"IP Address: "
)
;
Serial
println
(
WiFi
localIP
(
)
)
;
server
on
(
"/"
HTTP_GET
[
]
(
AsyncWebServerRequest *
request
)
{
request
->
send_P
(

"text/html"
index_html
)
;
}
)
;
server
on
(
"/get"
HTTP_GET
[
]
(
AsyncWebServerRequest *
request
)
{
String
message
;
String
inputParam
;
if
(
request
->
hasParam
(
PARAM_INPUT_1
)
)
{
message
=
request
->
getParam
(
PARAM_INPUT_1
)
->
value
(
)
;
inputParam
=
PARAM_INPUT_1
;
lcd
clear
(
)
;
lcd
setCursor
(

)
;
lcd
(
message
)
;
}
else
{
message
=
"No message sent"
;
inputParam
=
"none"
;
}
Serial
println
(
message
)
;
request
->
send
(

"text/html"
index_html
)
;
}
)
;
server
onNotFound
(
notFound
)
;
server
begin
(
)
;
}
void
loop
(
)
{
for
(
int
positionCounter
=

;
positionCounter
<

;
positionCounter
++
)
{
lcd
scrollDisplayLeft
(
)
;
delay
(

)
;
}
}
Code Explanation

#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include <LiquidCrystal.h>
First we need to include all the libraries. ESP8266Wifi library is used for TCP/IP Communication. ESPAsyncTCP & ESPAsycnWebServer are used for creating local webserver. LiquidCrystal is used for interfacing LCD Display with NodeMCU.

LiquidCrystal
lcd
(
D0
D1
D2
D3
D4
D5
)
;
const
char
*
ssid
=
“
*
*
*
*
*
*
*
*
*
”
;
const
char
*
password
=
“
*
*
*
*
*
*
*
*
*
*
*
*
”
;
Then we declare all the required pins for LCD and make an instance to use in the program. SSID & Password is used for connecting to wifi network.

const
char
index_html
[
]
PROGMEM
=
R
”
rawliteral
(
<
!
DOCTYPE
HTML
>
<
html
>
<
head
>
<
title
>
Smart
Notice
Board
<
/
title
>
…………………………………………………………………………
…………………………………………………………………………
<
input
type
=
”
submit
”
value
=
”
Send
”
>
<
/
form
>
<
br
>
<
/
center
>
<
/
body
>
<
/
html
>
)
rawliteral
”
;
These lines are used to make a simple HTML page to enter. Here you can enter the message and hit the send button to send the message on LCD. The send message is stored in the memory of NodeMCU.

server
on
(
“
/
”
HTTP_GET
[
]
(
AsyncWebServerRequest *
request
)
{
request
->
send_P
(

“
text
/
html
”
html_page
)
;
}
)
;
This command is used to send the webpage with input fields to the client computer.

<
ESP_IP
>
/
get
?
input1
=
<
Message
>
server
on
(
“
/
get
”
HTTP_GET
[
]
(
AsyncWebServerRequest *
request
)
{
if
(
request
->
hasParam
(
input1
)
)
{
message
=
request
->
getParam
(
input1
)
->
value
(
)
;
inputParam
=
input1
;
lcd
(
message
)
;
This command will send a GET request & and print the received message on the LCD Screen.

void
loop
(
)
{
for
(
int
positionCounter
=

;
positionCounter
<

;
positionCounter
++
)
{
lcd
scrollDisplayLeft
(
)
;
delay
(

)
;
}
Under the loop function we print the scrolling value of the text without a break.
IoT Web Controlled Smart Notice Board with ESP8266 Demonstration
Once the code is uploaded to NodeMCU board, you can open the Serial Monitor. The serial monitor will display the local ip address after getting connected to wifi.
Copy the ip address and paste it in your webs browser and hit enter. It will display the webpage.
Now you can enter the message here and send it by clicking on the send button.
Once the message is sent, the serial monitor will display whatever is sent.
You can now see the same message on LCD Screen.
Check some more Iot Based Project here:
DIY IoT Projects
Video Tutorial: IoT Based Notice Board using ESP8266
IoT Web Controlled Smart Notice Board using NodeMCU ESP8266
Watch this video on YouTube
A better version of this project is a Smart Notice Board with
Dot Matrix LED Display
which has more features and wider range for display.