Hello friends, I hope you all are doing great. Today, we will create a wifi temperature monitoring system. For reading, we will use the DS18B20 sensor. For data processing and webpage creation, we will use our already known ESP8266.

The project will be built as follows:

  1. Circuit assembly
  2. Code for reading the DS18B20 sensor (we will use Serial for tests).
  3. Creation of the webpage (we will use SPIFFS to store in FLASH).

But first, let's know a little about the sensor and the communication model it uses.

Materials

For this project, we will need the following items: For this project, we will need the following items:

  • 1 x ESP8266
  • 1x DS18B20 Sensor
  • 1x Breadboard
  • 1x 4k7 Ohms resistor

DS18B20

  • DS18B20 is a digital temperature sensor with good precision, good customization, practical use, reliable and low cost. Good combination?
  • The sensor monitors temperatures in the range: -55°C to +125°C (-67°F to + 257°F), with an accuracy of +-0.5°C in the range -10°C to +85°C (outside that range, this inaccuracy increases, but nothing absurd).
It uses three pins for operation:
  • VDD (Power Supply)
  • GND (Ground)
  • DQ (Digital Communication)

VDD operates with values from 3V to 5.5V and can even be omitted. The sensor has a Parasite Mode, using only the DQ and GND pins, and its power comes from the communication pin. This mode works well but is more susceptible to noise.

Data communication takes place over the 1-Wire (OneWire) protocol, using the DQ pin. We'll discuss the protocol later, but now it's important to know that, despite having only one wire, it allows two-way communication.

The reading is performed actively, the microcontroller sends a command and receives back a packet with the information.

In addition to the reading request, the sensor can also receive alarm configuration and data format commands. The DallasTemperature library already handles most of this for us. Including offering us some additional features, such as receiving reading in Faraday.

The most common models on the market are found in the TO-92 package (looks like a transistor) and the waterproof package. This second is more common due to its practical application, 1m long cable with stainless steel tip. It can be used to control water temperature, for example. The reading is performed actively, the microcontroller sends a command and receives back a packet with the information.

In addition to the reading request, the sensor can also receive alarm configuration and data format commands. The DallasTemperature library already handles most of this for us. Including offering us some additional features, such as receiving reading in Faraday.

The most common models on the market are the TO-92 package (looks like a transistor) and the waterproof package. This second is more common due to its practical application, 1m long cable with stainless steel tip. It can be used to control water temperature, for example.

WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,

OneWire

OneWire (or 1-Wire) is a communication method designed by Dallas Semiconductor that transmits data using just one line, with a system of signaling who sends and when.

The method is very similar to i2C, but it has a much more limited data transfer speed. Another difference is that in the 1-wire case, it is possible to omit the power pin, using the data pin in parasite mode (by now, you may have noticed that despite the name, the method needs at least two wires: Data and GND).

Communication is done in master-slave mode, in which the microcontroller sends all requests, and the other devices only send data when nominally requested.

Each device has a unique address/name. This allows us to connect multiple devices on the same data line. The requests are sent in broadcast, the device that recognizes itself in it responds.

Circuit

The circuit for our application is simple. We will connect the VDD pin of the sensor to the 3V3 of the NodeMCU, GND with GND, and we will use the D4 pin for the sensor data. It could be any other digital pin.

Additionally, a 4k7 ohm resistor must be placed between the data pin and the 3V3 to increase stability.

WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,

Finding the DS18B20 address

As we saw earlier, each sensor has a unique address and, this address is essential for communication. We can understand this as a manufacturing serial number. But how to identify this number? We will create a helper code to find this address. In this case, the code scans any devices connected to pin D4. We will use the Serial Monitor to visualize the result.

WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,
We started with importing the OneWire and DallasTemperature libraries (do not forget to maintain order). If any import error occurs, you can add them to Arduino IDE's library manager.

Next, we start a OneWire object on pin D4 and create a sensor using that object. From that moment on, the “sensors” object has all the properties and functions offered by the DallasTemperature library.

And we will make use of two functions Search(), which performs a search for devices in OneWire, and reset_search() which restarts this search.

What our code does is start a search, save the result in the addr variable and, if the variable is not empty, write it in the serial.

We found the result on the Serial Monitor. If there are other devices, they will appear here too. Keep the address, we'll need it.

WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,
 

Sensor reading by Serial Monitor

Now that we know the sensor's address. Let's start our main code for reading the temperature. The objective here is to start the sensor and take a reading every 10s.

We started in the same way, but this time we created the sensor1 variable with the collected address.

In the readDs18b20() function we will use two functions:

  • requestTemperatures() - This function does not specifically communicate with any sensors, but with all. It's like it says: If you're a ds18b20, run a new read now and wait for my ” And what the sensor does.
  • getTempC(address) - Here we send information directed to each sensor of interest, which responds to us with the last reading

Inside the Setup() function we started the sensor with the begin() function, it performs a reading automatically, if you didn't make new requests, the sensor would still respond to the getTemp() function, but with an outdated value.

In the loop, we have a timer with the millis() function so that the reading takes place every 10s.

WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,
On the serial monitor, we should get the following result:
WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,

Note that on line 15, we added one more parameter to the Serial.println() function. With that, we define the number of decimal places.

Creating the monitoring page

With our reading ready, let's create a web page to view this information in the browser. Remember that later we will put these files in FLASH ESP8266 with SPIFFS.

We will build the following screen:

WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,
    And for this, we will use two files:
  • index.html
WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,
  • style.css
WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,

The page structure is not the focus of this article, but basically, we have the index.html file creating the page itself and triggering a javascript function to update the reading.

The style.css file improves the appearance of the page but does not interfere with its functioning.

Both files must be in the data folder within the project folder and be transferred using the ESP8266 Sketch Data Upload.

Complete Code

With the page saved to FLASH, we need to create the structure to serve the page.

  • Connect on wifi
  • Create a web server
  • Create call-backs for requests to this

This step is nothing new for us, but it is worth noting a few points.

Now the readDs18b20() function also updates a variable of type String. We do this because server call-back functions do not accept integer or float variables.

For the server, we have three routes:

  • “/” will send the html file with the latest sensor reading.
  • “/styled.css” will send the css file
  • “/state” will return the temperature variable to be updated.
WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,
WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,
  • And now in Serial Monitor, we have the IP to access at http://yourIP.
WiFi Temperature Monitor with ESP8266 and DS18B20, Code for reading the DS18B20 sensor, Creation of the webpage, DS18B20, Finding the DS18B20 address, Sensor reading by Serial Monitor,

Conclusion

The DS18B20 is an extremely efficient and easy-to-use sensor. The application we developed today could be used to monitor the ambient temperature, or perhaps the temperature of a water reservoir. And the ESP8266 extends the range of that monitoring as far as we want.