Introduction: ESP8266-To-LED Matrix (Look Ma No Arduino)

About: I love programming and working on projects that build things.

This project came about when I created this instructional:

I received comments from people that it could be accomplished without the Arduino. I took that as a challenge.

The purpose of this project is to program an ESP8266-12 to service up a web page with a form, then take the text loaded into the form and display it on a LED Matrix.

The ESP8266-12 (NodeMCU)

  • Connects to your Wifi (you supply SSID and password)
  • Starts a web server on port 80
  • Display IP Address on the LED Matrix until Text is entered.
  • Remove URL tags from text enter on webpage and send to LED Matrix
  • On your home internet router you may forward port 80 on that IP to enable it on the internet.

Step 1: Parts Needed

You will need....

  1. Wifi Development board (esp8266-12 NodeMCU) for about $5 on Amazon here.
  2. 7219 LED Matrix 4 - 8x8 modules for about $8 on Amazon here
  3. Programmer for WIFI module, I used this one from Tayda Electronics for about $2 (make sure it has 3.3v option.
  4. Enclosure. I use a cigar box
  5. Power supply. I cut the end off an old 5v phone charger.
  6. Wires. Female to Female

Step 2: Overview of the ESP8266 Development Board.

I used the ESP8266-12e development board. One advantage this board has is the voltage regulator so I can power both the ESP8266 and LED Matrix with the same 5v line. This board is also tolerant of 5v inputs. If you want to be very careful you could attach the pins to bi directional level shifts. I did that originally but found it worked fine without them.

Add Support for the ESP8266 NodeMCU to the Arduino IDE:

  • In the Arduino IDE go to File menu, under preferences
  • Enter the following in the "Additional Board Managers URLs" ''
  • The in the Tools menu, click on "Board" and then "boards Manager'
    • "Install the ESP8266 by the ESP8266 Community

Step 3: Add the LED Matrix Library

The LED Matrix Library:

I was unable to compile the library I used on the Arduino so I had to switch to a different one. I picked the "LEDMatrixDriver"

To install this LEDMatrixDriver library:

  • In the top menu bar click "Sketch"
  • Then click "Include Library"
  • Then click "Manage Libraries..."
  • You will be given a list of libraries. Use search and find the LEDMatrixDriver
  • Click "Install"

Step 4: Program the ESP8266

Programming the ESP8266:

  1. Connect the programmer to your PC or Laptop
  2. Connect he GPIO0 jumper before powering on the ESP8266
  3. Connect TX (transmit) and RX(receive)
  4. Connect Ground to Ground
  5. Connect 3.3v from programmer to ESP8266

Upload the program:

  • Change SSID and Password for your WiFi router.
  • Click on Sketch menu then Upload. (Ctrl+u) shortcut.
  • The program will upload to the ESP8266.
  • Once complete remove jumper from GPIO0

Step 5: Connecting It Together

Connect the ESP8266 to the LED Matrix.

Connect pins with Female/Female wires:

  • DIN (data in) on Matrix ---> 13 or MOSI on ESP8266
  • Clock(CLK) on Matrix --> 14 or SCK on ESP8266
  • CS pin on Matrix define below --->( picked 15 on ESP8266)
  • Ground on Matrix --> Ground on ESP8266
  • +5v to Matrix
  • +5v to ESP8266 if you have a built in voltage regulator.
    • If not you can just a LM1117 and pull the 3.3v from it.

Step 6: Programming Notes


This program differed from having an Arduino because delays were in the original code. The ESP8266 could loop and wait for a web client to submit data and the Arduino could wait for serial traffic. Since the two were combined it wasn't possible to wait.

In order to move the characters smoothly across the screen I setup it up like this and put in the displayText() any time the code was in a loop waiting for something that it checks to see if the time to move the text.

const int ANIM_DELAY = 75; //speed of animation or text
unsigned long myTime=millis();  //Now

void displayText ( char * theText)
   if ( myTime + ANIM_DELAY < millis()) 
        myTime=millis(); //now
        // Draw the text to the current position
        drawString(theText, len, x, 0);
        // Advance to next coordinate
        if( --x < len * -8 )
            x = LEDMATRIX_WIDTH;

I hope you enjoy this Instructable.