Touchscreen user interface for Node-RED provided by the Nextion Display with ESP8266
434.Touchscreen user interface for Node-RED provided by the Nextion Display with ESP8266. This project will show you how to build a touchscreen user interface for Node-RED using the Nexti…

Know the mission before touching a wire.
Understand what you are making, prepare the right tools, and make the workbench safe.
Project details
Touchscreen user interface for Node-RED provided by the Nextion Display with ESP8266 is a iot project. 434.Touchscreen user interface for Node-RED provided by the Nextion Display with ESP8266. This project will show you how to build a touchscreen user interface for Node-RED using the Nexti…
- Source pages
- 1059-1065
- Named parts
- 11
- Build goal
- Working, tested prototype
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.
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.
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.
What's this?Image, role, pros, cons, handling & specifications

Development Board 3.2" Nextion display basic model – read more
An output component turns an electrical control signal into light, sound, motion, switching, or displayed information.
What it does hereIt presents the circuit result or acts on the physical world.
Buy / compare this part ↗Advantages
- Makes system state visible
- Can be tested separately
- Supports clear troubleshooting
Limitations
- Loads may exceed controller current
- Polarity or driver direction can matter
- Inductive loads create voltage spikes
Handling
- Use the documented driver stage
- Check polarity and load current
- Add flyback protection for inductive loads
Specifications to verify
- Use the exact model, value, package, and rating listed for Development Board 3.2" Nextion display basic model – read more; similar-looking parts are not always interchangeable.
- Confirm voltage, current, polarity, interface, driver requirements, and duty cycle.
What's this?Image, role, pros, cons, handling & specifications

about it here. Purchasing advice for the Nextion display
An output component turns an electrical control signal into light, sound, motion, switching, or displayed information.
What it does hereIt presents the circuit result or acts on the physical world.
Buy / compare this part ↗Advantages
- Makes system state visible
- Can be tested separately
- Supports clear troubleshooting
Limitations
- Loads may exceed controller current
- Polarity or driver direction can matter
- Inductive loads create voltage spikes
Handling
- Use the documented driver stage
- Check polarity and load current
- Add flyback protection for inductive loads
Specifications to verify
- Use the exact model, value, package, and rating listed for about it here. Purchasing advice for the Nextion display; similar-looking parts are not always interchangeable.
- Confirm voltage, current, polarity, interface, driver requirements, and duty cycle.
What's this?Image, role, pros, cons, handling & specifications

control
A named project component whose exact role is defined by the source circuit and build guide.
What it does hereIt performs a documented electrical, control, interface, or construction function in this project.
Buy / compare this part ↗Advantages
- Selected for this project
- Can be checked independently
- Supports modular troubleshooting
Limitations
- Substitutes may differ
- Generic names can hide variants
- Pinouts and ratings vary
Handling
- Compare the received part with the source
- Keep it labelled
- Do not force connectors or adjusters
Specifications to verify
- Use the exact model, value, package, and rating listed for control; similar-looking parts are not always interchangeable.
- Confirm dimensions, ratings, connection method, polarity, and environmental limits.
What's this?Image, role, pros, cons, handling & specifications

Transmitter and receiver operating at 433 MHz
A named project component whose exact role is defined by the source circuit and build guide.
What it does hereIt performs a documented electrical, control, interface, or construction function in this project.
Buy / compare this part ↗Advantages
- Selected for this project
- Can be checked independently
- Supports modular troubleshooting
Limitations
- Substitutes may differ
- Generic names can hide variants
- Pinouts and ratings vary
Handling
- Compare the received part with the source
- Keep it labelled
- Do not force connectors or adjusters
Specifications to verify
- Use the exact model, value, package, and rating listed for Transmitter and receiver operating at 433 MHz; similar-looking parts are not always interchangeable.
- Confirm dimensions, ratings, connection method, polarity, and environmental limits.
What's this?Image, role, pros, cons, handling & specifications

x LEDs
A named project component whose exact role is defined by the source circuit and build guide.
What it does hereIt performs a documented electrical, control, interface, or construction function in this project.
Buy / compare this part ↗Advantages
- Selected for this project
- Can be checked independently
- Supports modular troubleshooting
Limitations
- Substitutes may differ
- Generic names can hide variants
- Pinouts and ratings vary
Handling
- Compare the received part with the source
- Keep it labelled
- Do not force connectors or adjusters
Specifications to verify
- Use the exact model, value, package, and rating listed for x LEDs; similar-looking parts are not always interchangeable.
- Confirm dimensions, ratings, connection method, polarity, and environmental limits.
What's this?Image, role, pros, cons, handling & specifications

resistors with 330 Ohm each
A named project component whose exact role is defined by the source circuit and build guide.
What it does hereIt performs a documented electrical, control, interface, or construction function in this project.
Buy / compare this part ↗Advantages
- Selected for this project
- Can be checked independently
- Supports modular troubleshooting
Limitations
- Substitutes may differ
- Generic names can hide variants
- Pinouts and ratings vary
Handling
- Compare the received part with the source
- Keep it labelled
- Do not force connectors or adjusters
Specifications to verify
- Use the exact model, value, package, and rating listed for resistors with 330 Ohm each; similar-looking parts are not always interchangeable.
- Confirm dimensions, ratings, connection method, polarity, and environmental limits.
What's this?Image, role, pros, cons, handling & specifications

Jumper wires for the breadboard
A named project component whose exact role is defined by the source circuit and build guide.
What it does hereIt performs a documented electrical, control, interface, or construction function in this project.
Buy / compare this part ↗Advantages
- Selected for this project
- Can be checked independently
- Supports modular troubleshooting
Limitations
- Substitutes may differ
- Generic names can hide variants
- Pinouts and ratings vary
Handling
- Compare the received part with the source
- Keep it labelled
- Do not force connectors or adjusters
Specifications to verify
- Use the exact model, value, package, and rating listed for Jumper wires for the breadboard; similar-looking parts are not always interchangeable.
- Confirm dimensions, ratings, connection method, polarity, and environmental limits.
What's this?Image, role, pros, cons, handling & specifications

Developing the User Interface for the Nextion
A named project component whose exact role is defined by the source circuit and build guide.
What it does hereIt performs a documented electrical, control, interface, or construction function in this project.
Buy / compare this part ↗Advantages
- Selected for this project
- Can be checked independently
- Supports modular troubleshooting
Limitations
- Substitutes may differ
- Generic names can hide variants
- Pinouts and ratings vary
Handling
- Compare the received part with the source
- Keep it labelled
- Do not force connectors or adjusters
Specifications to verify
- Use the exact model, value, package, and rating listed for Developing the User Interface for the Nextion; similar-looking parts are not always interchangeable.
- Confirm dimensions, ratings, connection method, polarity, and environmental limits.
What's this?Image, role, pros, cons, handling & specifications

ESP8266 #1 – Schematics
A programmable controller that reads inputs, makes decisions, and drives the project's outputs.
What it does hereIt 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 #1 – Schematics; similar-looking parts are not always interchangeable.
- Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
What's this?Image, role, pros, cons, handling & specifications

ESP8266 #2 – Schematics
A programmable controller that reads inputs, makes decisions, and drives the project's outputs.
What it does hereIt 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 #2 – Schematics; similar-looking parts are not always interchangeable.
- Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
What's this?Image, role, pros, cons, handling & specifications

Decoding the RF Signals from the Sockets
A named project component whose exact role is defined by the source circuit and build guide.
What it does hereIt performs a documented electrical, control, interface, or construction function in this project.
Buy / compare this part ↗Advantages
- Selected for this project
- Can be checked independently
- Supports modular troubleshooting
Limitations
- Substitutes may differ
- Generic names can hide variants
- Pinouts and ratings vary
Handling
- Compare the received part with the source
- Keep it labelled
- Do not force connectors or adjusters
Specifications to verify
- Use the exact model, value, package, and rating listed for Decoding the RF Signals from the Sockets; similar-looking parts are not always interchangeable.
- Confirm dimensions, ratings, connection method, polarity, and environmental limits.
Connect one verified path at a time.
Explore the named components and standardized signal flow, then use Source Check to verify exact physical pins, values, and topology before applying power.
Trace this circuit.
Touchscreen user interface for Node-RED provided by the Nextion Display with ESP8266: interactive parts, standardized terminals, responsive anchored wires, student explanations, and the original circuit reference in one shared system.
Trace before wiring
Follow power, ground, inputs, processing, and outputs in that order. Never guess a pin from package shape alone.
Connect with power off
Make short, labelled connections and share a common ground only where the schematic requires it.
Inspect every joint
Check continuity, polarity, adjacent shorts, and loose connections before the first power-up.
Open all source diagrams and build views 5 visuals





Confirm the hardware-only control path.
This project does not include firmware in the source. The circuit itself provides the required behaviour.
How to connect
- Match every controller label to the circuit view and source pin map.
- Join grounds before signal wires when separate low-voltage supplies are used.
- 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.
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.
How to upload code
The original design is implemented entirely in hardware, so proceed after verifying the circuit and supply.
Assemble, deploy, test, and troubleshoot.
Use the complete source notes in build order, then pass the final checks before calling the project finished.
Build in functional stages
- Power and regulation
- Controller or processing stage
- Inputs and sensors
- Outputs and loads
- Enclosure and strain relief
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
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
Follow the documented instructions.
These notes come from this project's source and remain in their original order.
Project overview
Project build note434.Touchscreen user interface for Node-RED provided by the Nextion Display with ESP8266. This project will show you how to build a touchscreen user interface for Node-RED using the Nextion display and the ESP8266 so that you can control the electronic appliances in your home. The goal of this project is to give you the ability to control your home automation system through the Nextion display so that you don't have to use your smartphone or computer to access the Node-RED user interface. This will be accomplished while ensuring that the Node-RED Dashboard is always kept up to date.
Project Overview
Project build noteIn order to exert control over four distinct outlets, you will construct a physical Node-RED interface using the Nextion display. Take a look at the
chart that can be found below
Project build noteThe user interface of Nextion controls four distinct outputs. Through the use of a 433 MHz transmitter. ESP8266 #1 controls Outlet #1 as well as Outlet #2. Additionally, this ESP8266 is connected to the display of the Nextion. ESP8266 #2 is in charge of controlling two LEDs that are referred to as the Workbench and Top light. The plan is for you to replace these two LEDs with other outputs that are of use to you, such as a relay or a SONOFF smart switch, for example. When you use the Nextion display to turn an output ON, the state of the corresponding node in the Node-RED Dashboard is automatically updated to reflect the change. The Node-RED Dashboard also gives you the ability to exercise control over all of these outputs.
How does the project work? The steps involved in completing this project are outlined in the figure below. 1) When you tap the Outlet #1 ON button, the Nextion display communicates with the ESP8266 via serial communication to let it know that the button was tapped. This lets the ESP8266 know which button was tapped. 2) The ESP and Raspberry Pi are able to communicate with one another thanks to a communication protocol known as MQTT. The Raspberry Pi is
equipped with the Mosquitto broker, which is responsible for collecting all of the MQTT messages and distributing them to the various devices that have subscribed to a specific topic. The ESP will publish a "true" message on the topic office/outlet1/buttonState whenever you tap the ON button that is displayed on the Nextion display. 3) The Node-RED message will be sent to the Outlet #1 button, which is subscribed to this topic and will therefore receive it. When it receives that message, it toggles the state of the button that corresponds to it so that it is ON. When something like this takes place, the Node-RED sends out a message with the subject office/outlet1. 4) Since the ESP is subscribed to this topic, it is aware that Node-RED has switched the button state to the ON position. In order to activate Outlet #1, the ESP8266 initiates the transmission of a signal at 433 MHz via a 433 MHz transmitter. Controlling any of the other outputs follows the same procedure as described here.
Parts Required
Project build noteThe Raspberry Pi 2x ESP8266 – read more about them on the Best ESP8266 Wi-Fi Development Board 3.2" Nextion display basic model – read more about it here. Purchasing advice for the Nextion display MicroSD card 433 MHz RF Plugs that are operated by remote control Transmitter and receiver operating at 433 MHz 2x LEDs 2 resistors with 330 Ohm each Jumper wires for the breadboard Developing the User Interface for the Nextion
The user interface for the 3.2-inch Nextion basic model has been developed by our team. If you are utilizing a Nextion display of a different size, you will need to make some modifications to the user interface in order for it to function properly for your particular model. In order to do this, you will need to edit the.HMI file and produce a new.TFT file.
ESP8266 #1 – Schematics By following the schematic in the following figure, you can successfully connect an ESP8266 to a Nextion display as well as a 433MHz transmitter. It is necessary to connect the RX pin of the ESP8266 to the TX pin of the Nextion display. It is necessary to connect the RX pin of the Nextion display to the TX pin of the ESP8266.The data pin of the 433 MHz transmitter is connected to the
GPIO 5 of the ESP8266 (D1 pin). A connection has been made between the VCC pin of the 433 MHz transmitter and the 3V3 pin of the ESP8266. ESP8266 #2 – Schematics Connect two LEDs to the second ESP8266 in the manner denoted by the accompanying circuit diagram. GPIO 5 is the point of connection for the red LED (D1 pin). GPIO 4 is the point of connection for the green LED (D2 pin). Decoding the RF Signals from the Sockets Decoding the signals that cause the sockets to turn on and off is necessary if you want to use 433 MHz signals to control the sockets in your device. Code: Each individual ESP8266 device requires a unique sketch to be uploaded by the user. Be sure to make the necessary adjustments to each code in order to get them to function properly for you. Note: Before you upload any code, check that the Nextion library for the Arduino IDE is properly configured to work with the ESP8266. This must be done before you upload any code.
Demonstration
Project build noteAfter setting up everything, you should be able to control your outputs by tapping the buttons on the display of the Nextion. Instant updates are made to the Node-RED Dashboard whenever you tap one of the buttons displayed on the Nextion. We sincerely hope that you have found this project to be beneficial. After gaining an understanding of the concepts presented in this project, you will be able to modify it to control virtually anything you want by utilizing the Nextion display interface and Node-RED.
You built Touchscreen user interface for Node-RED provided by the Nextion Display with ESP8266.
You followed the full workflow from understanding the mission to testing the finished project. That is a real engineering achievement - well done.
Browse all 500 projects