Web Controlled IoT Notice Board using Raspberry Pi
How ToIoT HardwaresRaspberry PiTutorials/DIY

Web Controlled IoT Notice Board using Raspberry Pi

Harshvardhan Mishra

In this Tutorial, we learn how to create Web Controlled IoT Notice Board using Raspberry Pi. We are using Internet to wirelessly send the message from Web Browser to the LCD which is connected to Raspberry Pi. As message is sent through the web browser.

We create a server over internet. At the Raspberry Pi, we have used 16×2 LCD to display message and Flask for receiving the message over network. Whenever Raspberry receives any wireless message from Web browser, it displays on the LCD.

Components Required:

  • Raspberry Pi 3 (any model)
  • 16×2 LCD
  • Bread Board
  • Connecting wires
  • 10K Pot

Web Controlled IoT Notice Board using Raspberry Pi

Creating Webpage

We have  created a web server for send notice message to RPi using Flask. Webpage is given below. This very simple and written in HTML.

<h1> Notice Board IoTbyHVM.OOO</h1>
<p> Bits and Bytes of IoT</p>
</div>

<div data-role="content">

<form method="post" action="change">
  <label for="slider-1">Notice Message:</label>
  <input type="text" name="lcd" id="lcd" />  
  <br />
  
  <input type="submit" value="Submit" />
</form>

{% if value %}
<p>Notice Submitted Successfully: {{ value }}</p>
{% endif %}

</div>

Just copy above code and paste into any text editor and save with .html extension. Then put this HTML file in the same folder where you have put your Python Code file (given at the end) for this Web Controlled Notice Board.

Now you can just run the Python code in Raspberry Pi, open the IP_address_of_your_Pi:8080 in web Browser (like 192.168.1.14:8080) and input the message and click submit, as soon as you submit the message, you will get the message on LCD connected to Raspberry Pi.

The webpage is created using HTML language, which contain a form having a textbox and submit button, with Heading (h1 tag) Web Control Notice Board. The form has “change” is the action that will be performed in code using post method, when we click on Submit button. The slider is block with label “Notice Message”.

After it, we can add an optional line to show the text which we have sent to the Raspberry Pi via the server.

{% if value %}
<p>Notice Submitted Successfully: {{ value }}</p>
{% endif %}

It checks the value in the text box and if there is some value in the textbox then it prints the text on webpage itself, so that user can also see the submitted message. Here ‘value’ is “input text or notice message” that we will type in slider box or text box.

Circuit connection

Connections for this Wireless Message Board are very easy; we only need to connect LCD with the Raspberry Pi board by using some connectors over bread board. The user may use zero PCB for connections. RS, RW and EN pins of LCD are directly connected to pin 18, GND and 23. And data pins of LCD D4, D5, D6, D7 are directly connected to Raspberry Pi’s GPIO 24, 16, 20, 21. A 10K pot is used to control the brightness of LCD.

rpi lcd connection

Programming Explanation and Flask:

Before program Raspberry Pi, user needs to install a flask support package into the Raspberry Pi by using given commands:

$ pip install Flask

The programming part of this project plays a very important role to perform all the operations. First of all, we include required libraries for Flask, initialize variables and define pins for LCD.

from flask import Flask
from flask import render_template, request
import RPi.GPIO as gpio
import os, time

app = Flask(__name__)

RS =18
EN =23
D4 =24
D5 =16
D6 =20
D7 =21
... ......
..... ......

For LCD, def lcd_init() function is used to initialize LCD in four bit mode, def lcdcmd(ch) function is used for sending command to LCD, def lcddata(ch) function is used for sending data to LCD and def lcdstring(Str) function is used to send data string to LCD. You can check all these functions in Code given afterwards.

Below part of the Program is used to send the message from the web browser to Raspberry Pi using Flask. You can learn more about the programming using Flask here.

@app.route("/")

def index():
    return render_template('web.html')
@app.route("/change", methods=['POST'])

def change():
 if request.method
 == 'POST':
    # Getting the value from the webpage
   data1 = request.form['lcd']
   lcdcmd(0x01)
   lcdprint(data1)
 return render_template('web.html', value=data1)

if __name__ == "__main__":
    app.debug = True
    app.run('192.168.1.10', port=8080,debug=True)

So this is how we can send the message from our computer or smartphone to the Raspberry Pi LCD and can make a Web Controlled IoT Notice Board using Raspberry Pi. Check the Full Python Code and Demonstration Video below.

Code

from flask import Flask
from flask import render_template, request
import RPi.GPIO as gpio
import os, time
app = Flask(__name__)
RS =18
EN =23
D4 =24
D5 =16
D6 =20
D7 =21
HIGH=1
LOW=0
OUTPUT=1
INPUT=0
gpio.setwarnings(False)
gpio.setmode(gpio.BCM)
gpio.setup(RS, gpio.OUT)
gpio.setup(EN, gpio.OUT)
gpio.setup(D4, gpio.OUT)
gpio.setup(D5, gpio.OUT)
gpio.setup(D6, gpio.OUT)
gpio.setup(D7, gpio.OUT)
def begin():
lcdcmd(0x33)
lcdcmd(0x32)
lcdcmd(0x06)
lcdcmd(0x0C)
lcdcmd(0x28)
lcdcmd(0x01)
time.sleep(0.0005)

def lcdcmd(ch):
gpio.output(RS, 0)
gpio.output(D4, 0)
gpio.output(D5, 0)
gpio.output(D6, 0)
gpio.output(D7, 0)
if ch&0x10==0x10:
gpio.output(D4, 1)
if ch&0x20==0x20:
gpio.output(D5, 1)
if ch&0x40==0x40:
gpio.output(D6, 1)
if ch&0x80==0x80:
gpio.output(D7, 1)
gpio.output(EN, 1)
time.sleep(0.0005)
gpio.output(EN, 0)
# Low bits
gpio.output(D4, 0)
gpio.output(D5, 0)
gpio.output(D6, 0)
gpio.output(D7, 0)
if ch&0x01==0x01:
gpio.output(D4, 1)
if ch&0x02==0x02:
gpio.output(D5, 1)
if ch&0x04==0x04:
gpio.output(D6, 1)
if ch&0x08==0x08:
gpio.output(D7, 1)
gpio.output(EN, 1)
time.sleep(0.0005)
gpio.output(EN, 0)

def lcdwrite(ch):
gpio.output(RS, 1)
gpio.output(D4, 0)
gpio.output(D5, 0)
gpio.output(D6, 0)
gpio.output(D7, 0)
if ch&0x10==0x10:
gpio.output(D4, 1)
if ch&0x20==0x20:
gpio.output(D5, 1)
if ch&0x40==0x40:
gpio.output(D6, 1)
if ch&0x80==0x80:
gpio.output(D7, 1)
gpio.output(EN, 1)
time.sleep(0.0005)
gpio.output(EN, 0)
# Low bits
gpio.output(D4, 0)
gpio.output(D5, 0)
gpio.output(D6, 0)
gpio.output(D7, 0)
if ch&0x01==0x01:
gpio.output(D4, 1)
if ch&0x02==0x02:
gpio.output(D5, 1)
if ch&0x04==0x04:
gpio.output(D6, 1)
if ch&0x08==0x08:
gpio.output(D7, 1)
gpio.output(EN, 1)
time.sleep(0.0005)
gpio.output(EN, 0)

def lcdprint(Str):
l=0;
l=len(Str)
for i in range(l):
lcdwrite(ord(Str[i]))
begin()
lcdprint("Circuit Digest")
lcdcmd(0xc0)
lcdprint("Welcomes You")
time.sleep(5)
@app.route("/")
def index():
return render_template('web.html')
@app.route("/change", methods=['POST'])
def change():
if request.method == 'POST':
# Getting the value from the webpage
data1 = request.form['lcd']
lcdcmd(0x01)
lcdprint(data1)
return render_template('web.html', value=data1)
if __name__ == "__main__":
app.debug = True
app.run('192.168.1.10', port=8080,debug=True)

Thanks for reading. If you like this post “Enviro+ for Raspberry Pi” probably you might like my next ones, so please support me by subscribing my blog.

You may like also:

Explore Some more Raspberry Pi Tutorials :

Harshvardhan Mishra

Hi, I'm Harshvardhan Mishra. Tech enthusiast and IT professional with a B.Tech in IT, PG Diploma in IoT from CDAC, and 6 years of industry experience. Founder of HVM Smart Solutions, blending technology for real-world solutions. As a passionate technical author, I simplify complex concepts for diverse audiences. Let's connect and explore the tech world together! If you want to help support me on my journey, consider sharing my articles, or Buy me a Coffee! Thank you for reading my blog! Happy learning! Linkedin

You May Also Like

Using Mq135 Sensor with InfluxDB

Using Mq135 Sensor with InfluxDB

Harshvardhan Mishra
How To Use DS18B20

How To Use DS18B20 Water Proof Temperature Sensor

Harshvardhan Mishra
Raspberry Pi Resource Monitoring

Raspberry Pi Resource Monitoring

Harshvardhan Mishra

One thought on “Web Controlled IoT Notice Board using Raspberry Pi”

Leave a Reply

Your email address will not be published. Required fields are marked *