STEP 1 / 6ESP + IOT

Visualize Your Sensor Readings from Anywhere in the World (ESP32/ESP8266 + MySQL + PHP)

478.Visualize Your Sensor Readings from Anywhere in the World (ESP32/ESP8266 + MySQL + PHP) During the course of this project, you will develop a web page that can be accessed from any lo…

Visualize Your Sensor Readings from Anywhere in the World (ESP32/ESP8266 + MySQL + PHP) - source illustration from page 1300
PROJECT#478
TRACKIoT
PARTS03
STAGES06
STEP 1 / 6 · Overview

Know the mission before touching a wire.

Understand what you are making, prepare the right tools, and make the workbench safe.

01

Project details

Visualize Your Sensor Readings from Anywhere in the World (ESP32/ESP8266 + MySQL + PHP) is a iot project. 478.Visualize Your Sensor Readings from Anywhere in the World (ESP32/ESP8266 + MySQL + PHP) During the course of this project, you will develop a web page that can be accessed from any lo…

Source pages
1300-1306
Named parts
3
Build goal
Working, tested prototype
02

Tools you need

  • Digital multimeter
  • Wire stripper and side cutters
  • Soldering iron with a fine tip
  • Current-limited bench supply
  • Computer with a data-capable USB cable

Use eye protection, good lighting, and a clean insulated surface throughout the build.

03

Safety precautions

  • Disconnect every power source before changing a connection.
  • Check component polarity, pinout, and supply voltage twice.
  • Use a current limit for the first power-up.
  • Keep liquids, loose metal, and uninsulated wires away from the bench.
Ready to continue?
STEP 2 / 6 · Parts library

Gather, identify, and understand every part.

Use the standardized inventory, then open What's this? to learn each part's role, advantages, limitations, handling, and specifications.

NAMED PROJECT INVENTORY3 PART LINES
PARTTYPEQTYREADY
MESP8266MODULE1
What's this?Image, role, pros, cons, handling & specifications
Visualize Your Sensor Readings from Anywhere in the World (ESP32/ESP8266 + MySQL + PHP) - source illustration from page 1300MODULE LEARNING VIEW

ESP8266

A programmable controller that reads inputs, makes decisions, and drives the project's outputs.

What it does here

It is the control centre and must use the documented board, pin map, supply, and logic level.

Buy / compare this part

Advantages

  • Reprogrammable and reusable
  • Large learning ecosystem
  • Complex behaviour remains changeable

Limitations

  • GPIO voltage and current are limited
  • Some pins affect boot or communication
  • Loads normally need a driver

Handling

  • Disconnect power before rewiring
  • Avoid static discharge
  • Never power motors, relays, or pumps directly from GPIO

Specifications to verify

  • Use the exact model, value, package, and rating listed for ESP8266; similar-looking parts are not always interchangeable.
  • Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
MESP32MODULE1
What's this?Image, role, pros, cons, handling & specifications
Visualize Your Sensor Readings from Anywhere in the World (ESP32/ESP8266 + MySQL + PHP) - source illustration from page 1300MODULE LEARNING VIEW

ESP32

A programmable controller that reads inputs, makes decisions, and drives the project's outputs.

What it does here

It is the control centre and must use the documented board, pin map, supply, and logic level.

Buy / compare this part

Advantages

  • Reprogrammable and reusable
  • Large learning ecosystem
  • Complex behaviour remains changeable

Limitations

  • GPIO voltage and current are limited
  • Some pins affect boot or communication
  • Loads normally need a driver

Handling

  • Disconnect power before rewiring
  • Avoid static discharge
  • Never power motors, relays, or pumps directly from GPIO

Specifications to verify

  • Use the exact model, value, package, and rating listed for ESP32; similar-looking parts are not always interchangeable.
  • Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
MRaspberry PiMODULE1
What's this?Image, role, pros, cons, handling & specifications
Visualize Your Sensor Readings from Anywhere in the World (ESP32/ESP8266 + MySQL + PHP) - source illustration from page 1300MODULE LEARNING VIEW

Raspberry Pi

A programmable controller that reads inputs, makes decisions, and drives the project's outputs.

What it does here

It is the control centre and must use the documented board, pin map, supply, and logic level.

Buy / compare this part

Advantages

  • Reprogrammable and reusable
  • Large learning ecosystem
  • Complex behaviour remains changeable

Limitations

  • GPIO voltage and current are limited
  • Some pins affect boot or communication
  • Loads normally need a driver

Handling

  • Disconnect power before rewiring
  • Avoid static discharge
  • Never power motors, relays, or pumps directly from GPIO

Specifications to verify

  • Use the exact model, value, package, and rating listed for Raspberry Pi; similar-looking parts are not always interchangeable.
  • Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
Ready to continue?
STEP 4 / 6 · Source code

Confirm the hardware-only control path.

This project does not include firmware in the source. The circuit itself provides the required behaviour.

01

How to connect

  1. Match every controller label to the circuit view and source pin map.
  2. Join grounds before signal wires when separate low-voltage supplies are used.
  3. Keep motors, relays, pumps, and other loads on a suitable driver and external supply.

Common mistakes

Reversed VCC/GND, board-label versus GPIO-number confusion, missing common ground, and charge-only USB cables.

Troubleshoot

Disconnect loads, continuity-test one path at a time, then test with a current limit.

02

Software preparation

No IDE, board package, library, or firmware upload is required for this project.

If you add a programmable controller as an extension, document its pin map separately.

03

How to upload code

The original design is implemented entirely in hardware, so proceed after verifying the circuit and supply.

Ready to continue?
STEP 5 / 6 · Build

Assemble, deploy, test, and troubleshoot.

Use the complete source notes in build order, then pass the final checks before calling the project finished.

ASSEMBLY

Build in functional stages

  • Power and regulation
  • Controller or processing stage
  • Inputs and sensors
  • Outputs and loads
  • Enclosure and strain relief
TEST

Power up safely

  • Inspect unpowered continuity first
  • Apply the lowest safe current limit
  • Measure supply rails before signals
  • Add one load at a time
  • Record expected and actual results
TROUBLESHOOT

Work from simple to complex

  • Confirm power, ground, polarity, and orientation
  • Compare each pin with the source
  • Test inputs separately from outputs
  • Replace only one variable at a time
  • Power off before every correction
PROJECT-SPECIFIC BUILD NOTES

Follow the documented instructions.

These notes come from this project's source and remain in their original order.

01

Project overview

Project build note

478.Visualize Your Sensor Readings from Anywhere in the World (ESP32/ESP8266 + MySQL + PHP) During the course of this project, you will develop a web page that can be accessed from any location in the world and displays sensor readings in the form of a plot. In a nutshell, you will construct a client for the ESP32 or ESP8266 microcontroller family that issues a query to a PHP script in order to save sensor readings in a MySQL database.

For the purpose of illustration, we will be using a BME280 sensor that is linked to an ESP board. You can either use multiple boards or modify the code that was provided so that it sends readings from a different sensor.

02

To create this project, you’ll use these technologies

Project build note

Arduino IDE-based programming of an ESP32 or ESP8266 microcontroller Hosting server and domain name. A script written in PHP that inserts data into a MySQL database and displays it on a website. Readings will be stored in a MySQL database. A chart-generating PHP script that pulls data from a database. 1. Providing Hosted Services for Your PHP Application and MySQL Database This project's objective is to provide you with your very own domain name and hosting account so that you can save sensor readings obtained from an ESP32 or ESP8266 microcontroller. If you access your own server domain, you will be able to visualize the readings no matter where you are in the world. An overview of the project is as follows, at a high level:

It is strongly suggested that you use one of the following hosting services, as they are able to fulfill all of the requirements for the project: When you sign up for Bluehost's 3-year plan, you'll receive a free domain name. Bluehost is known for being user-friendly and offering cPanel. It is highly recommended that you go with the option that allows unlimited websites; A Linux server hosted by Digital Ocean that can be administered via a command line. This choice is one that I would only recommend to more

experienced users. Those are the two hosting services that I use and highly recommend to others, but you are free to use whichever hosting service you prefer. This project will function properly with any web hosting service so long as it provides PHP and MySQL. 2. Preparing Your MySQL Database After registering for a hosting account and establishing a domain name, you will be able to access your cPanel or an interface that is very similar to it. After that, you will need to create your database, username, and password, as well as a SQL table, by following the subsequent steps. Developing a user base and a database

03

Click the " Advanced " tab to reveal

Project build note

1. In the search bar, enter "database," then select "MySQL Database Wizard." 2. Give the database the name you want it to have. In my particular scenario, the name of the database is esp data. After that, click the button

04

labeled "Next Step"

Project build note

Note: when the time comes, you'll need to use the database name that includes the prefix that your host provides for you (my database prefix in the screenshot above is blurred). From this point forward, I'll refer to it as example esp data. 3. Enter your username for the Database and create a password for it. You have to make sure to save all of those particulars, as you will require them in the future in order to set up a database connection using your PHP code.

That wraps it up! Both the new database and user that you wanted to create have been successfully made. Save all of your information

05

for later use because you are going to need it

Project build note

Go back to the cPanel dashboard once you have finished creating your database and user, and then search for "phpMyAdmin." Choose "example esp data" as the name of your database in the sidebar on the left, and then click the "SQL" tab. To create your table, copy the following, then press the "Go" button after pasting it into the SQL query field (which is highlighted with a

06

red rectangle)

Project build note

After that, you should be able to locate your freshly created table in the example esp data database under the name Sensor. 3. Insert Data into MySQL Database Utilizing PHP Script via HTTP POST In this part of the tutorial, we are going to create a PHP script that will insert incoming requests from the ESP32 or ESP8266 into a MySQL database after receiving them from the respective boards. You can search for "File Manager" if you are utilizing a hosting

07

provider that comes with cPanel

Project build note

After that, choose the public html option from the drop-down menu, and then click the "+ File" button to produce a new.php file. 4. A PHP Script That Allows You to View the Content of a Database as a Chart Make a new PHP file in the public html directory that will plot the contents of the database as a chart on a website. This file should be created. Name your new file: esp-chart.php

08

Demonstration

Project build note

After you have finished all of the steps, you should now allow your ESP board to collect some readings and then publish them to your server. If everything is functioning as it should, you should see the following in the Serial Monitor of your Arduino ID. You have gained the knowledge necessary to publish sensor data into a database on your own server domain, which you are able to access from any location in the world thanks to this project. You need to have your very own server and domain name in order to do this (you can also use a Raspberry Pi for local access). You will have complete control over your server and the ability to switch to a new host if this configuration is used. There are a wide variety of cloud services, both free and paid, that you can use to publish your readings; however, using these services may come with a number of drawbacks, including limitations on the number of readings that can be published, the number of connected devices, and the individuals who can view your data.

In addition, the cloud service may undergo price reductions or other modifications at any time. The illustration that is given to you is kept as straightforward as is humanly possible so that you can comprehend how everything operates. Once you have a firm grasp of this illustration, you will be able to alter the visual presentation of the web page, publish varying sensor readings, publish from multiple ESP boards, and do a great deal more.

Ready to continue?
PROJECT ACHIEVED

You built Visualize Your Sensor Readings from Anywhere in the World (ESP32/ESP8266 + MySQL + PHP).

You followed the full workflow from understanding the mission to testing the finished project. That is a real engineering achievement - well done.

Power ESP32/ESP8266 with Solar Panels (includes battery level monitoring) project thumbnail featuring ESP32 or ESP8266; both are available (read ESP32 vs ESP8266), x Mini Solar Panel (5/6V 1.2W), Holder for Lithium-ion and Lithium-ion batteries
NEXT IOT ADVENTURE

Power ESP32/ESP8266 with Solar Panels (includes battery level monitoring)

Ready to reuse what you learned in another project from the same track?

Start this project
Browse all 500 projects