Temperature, pressure and humidity measurement with BME280 on smartphone applications [Out Of the box Project]

Hello,

Check out this video tutorial for better understanding:

The title of this tutorial speaks for itself – you will create an application for smartphone, where you can read the measurements from BME280 sensor, which are pressure, humidity and temperature + history in the form of a graph. At the bottom of the tutorial, I have explains how it works.

Start

First we log into the application and go to https://app.remoteme.org/en/#/app/quickstart

Click “Read More or Build it”

Needed parts:

connections:

 

The next step is building the source files (we need to complete the name of the WiFi and password – we can omit and complete it in the source code in the IDE arduino)

We do not have to add other values, the green text at the top informs us that everything is OK

Click on the “Next Step” two times

And Click “Build Project”:

Now you need to download the source code for ESP and open it in the Arduino IDE

In the Arduino IDE, you need install the required libraries:

In Arduino IDE -> Tools -> Manage Libraries:

we search all three libraries and install each:

Then upload sketch to ESP

After uploading and running, the icon will change:

 

Installation on a smartphone:

Choose the platform, then the window will appear:

By clicking we create the necessary files to install the application (more here):

Then scan the QR code, or otherwise open the link in chrome on the android phone (iPhone users should follow the steps written above the QR code)

On the phone (with android) pops up a notification and asks to install the application on the main screen – click yes, and then add. The program icon will appear on the main screen:

after launch it

After clicking on “show history” there will be a graph that is almost empty  (you don’t have data yet):

 

Its ready 🙂

Now a description of how it works and what happened:

Three variables humm, press and temp can be used to store data:

More about variables in the article describing variables in RemoteMe

1. Variables Tab
2. Last written value
3. History of values rounded to hour

to change the rounding for history, click on the history settings:

then “Disable or change round” and in the window set the rounding in minutes(60min means rounding to the hour)

The green glow means that the variable has just been changed by our ESP. This is because:

Every 10 seconds we send data to RemoteMe with the following function:

Which performs nine readings and sends a median to the server:

This allows you to filter out erroneous readings – which sometimes happen.

The measurement data is read by a website that we can also open on the computer:

All components that have been used can be inserted in the same way in the new web page in the article about components

The application for Android/iPhone is a so-called progressive application (about PWA ,  and those who want to change files like icons etc there is article about PWA in the RemoteMe platform), of course you can easily change the icon by changing icon files: icon512.png, icon192.png, iconApple.png simply by dragging new icons in “Drop Files here” and reinstalling the application – to show the QR code for the new installation, click the android or apple icon on the bar:

 

Charts that are visible on the subpage are rendered using plotly.js – and how to render them can be changed in the scriptHistory.js file

Data is collected using RESTs, a description of the rests in the swagger document in the Variables-rest tab

 

Ideas for developing the project:

You can add sleep options to your ESP since every time the loop runs it just does nothing wasting power- it will also allow you to run the project on the battery.

 

Cheers,

Maciej