Read temperature and humidity from nodemcu ESP12E with DHT11 and show it on HTML webpage(Local)

Teacher
Vivek Gupta
Vivek Gupta
Role : Writing free tutorials in free time
  • Website : http://vsgupta.in/
  • Experience : 5+ Years
  • Specialist in : IoT, NLP, Machine Learning, Chatbots, Voice Assistants, Hardware Engineering
Read More

Setting up breadboard for displaying dht11 data from nodemcu on html webpage(local)

Introduction

Setting up breadboard for displaying dht11 data from nodemcu on html webpage in the local server is almost same as controlling led using html in local network. We will be first wiring up our circuit on our breadboard from scratch. Keep this following circuit diagram hand and tally your breadboard circuit with the following circuit diagram on each step to avoid any mistakes.

Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local)-circuit

Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local)-circuit

I hope that you are ready with all the components which we mentioned in introductory lesson.

(You can also check my previous tutorial on:

Getting Started with ESP12E (Node MCU) Wifi Development Board
Controlling Esp12E NodeMCU with LED from website (local network)
Controlling Esp12E NodeMCU with LED from website using thingspeak from anywhere in the world
)

else you can start following the below steps:

  1. Get the ESP12E ready and place it on the breadboard as shown below. Also connect the "3.3V" of NodeMCU ESP12E to the "+ve" rail of breadboard and "gnd" of NodeMCU ESP12E to the "gnd" rail of breadboard as shown below.
    Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local) (1)

    Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local) (1)

     

  2. Now place your "DHT11 Temperature & humidity sensor" as shown in the below image.
    Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local) (2)

    Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local) (2)

    Here is the pinout of dht11 for your reference:

    dht11_pinout

    dht11_pinout

    Note that you have to be really careful while wiring up the DHT11. In my case, It started heating up and melting up when I was learning first time

  3. Now connect the 1st pin(from right facing front) to 3.3v by connecting it to the "+ve" rail of breadboard and last pin of dht11 sensor to the "gnd" rail of breadboard as shown below.(Note : Just follow the blue dots along with the instructions)
Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local) (3)

Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local) (3)

4. Now Simply put a 10k resistor in between pin no 1 & 2 of DHT11 as shown below.(check above the circuit diagram for reference)

Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local) (4)

Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local) (4)

5. Now finally connect the 2nd pin of DHT11 to the D1 pin of ESP12E NodeMCU.(Note : Don't get confused in the following image. There is a misprint on my pcb. It is D1 pin only. It is misprinted as D2. You have to connect it to D1 pin only.)

Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local) (5)

Read-temperature-and-humidity-from-nodemcu-ESP12E-with-DHT11-and-show-it-on-HTML-webpage(Local) (5)

Now you have successfully wired up the breadboard with ESP12E NodeMCU with DHT11 on breadboard.

In the next lesson, we will program it in a such a way that we will be getting the value from ESP12E NodeMCU of DHt11 in JSON format. Hope you enjoyed the tutorial. Click on the next chapter to go to next chapter.

 

Please login to get access to the quiz
(Next Lesson) Read temperature and humidity from nodemcu ESP12E with DHT11 and show it on HTML webpage(Local)-part1
Back to Read temperature and humidity from nodemcu ESP12E with DHT11 and show it on HTML webpage(Local)

No Comments

Post a Reply