Hey Everyone,

This is a instructable for a social media stats counter, that fetches and displays data from Facebook, Twitter, YouTube and Instructables. I've seen commercial solutions for this cost over $400, but the total cost of this project was less $20.

These days there are APIs for everything! With this project I wanted to show how the ESP8266 can be used to integrate with these APIs.

There are 4 arduino libraries that I have written used in this project that integrates with the APIs. The YouTube one you might have seen before (bekathwia uses for a really cool project), but I wrote 3 new APIs just for this project: one for Twitter, Facebook and one for Instructables. These APIs allow you to connect to the various services and fetch data from them, directly from the ESP8266. Each of these libraries can be used individually if you have a project where you want to fetch the data from just one of these endpoints.

To be honest I wanted to add more to this project before submitting, such as Instagram and Twitch but I just ran out of time as I wanted to submit for the microcontroller competition. The project could easily be extended in the future though.

Hopefully you find the project interesting and please let me know if you have questions.

So lets get started!

Step 1: Parts

Let's first take a look at the parts we need for this project.

There are two core parts to the project (the ESP8266 and the LED Matrix display), everything else could be done however you would like to, but I'll list what I used anyways.

An ESP8266 board - I used a wemos d1 mini clone
4x single MAX7219 dot matrix modules - Getting one that has 4 built in might be easier, but I'm not sure it works with the library I used.
Ribba Picture Frame from Ikea
Dupont cables - I used a lot of M->F, but you could also do F->F either, I'll go into more details in a later step
Mini Breadboard
Tiny Breadboard - I just used this as a connector.
Thick Card - for the back of the MAX7219s (I hot glued them on).
Popsicle stick - to prop the card up enough to allow a wire underneath.
Double sided sticky tape to hold the popsicle stick to the card and the popsicle stick to the back of the frame.
Solder and soldering iron (for the MAX7219 boards)
Micro USB cable (for powering the board)

Step 2: Soldering the MAX7219

You will need to solder the MAX7219, it's pretty straight forward soldering though.

NB: Don't do what I have done in some of the photos and solder straight pins, it doesn't fit in breadboards! (I broke the board while de-soldering them and had to add a manual wire direct to the chip!)

First solder the angled pin headers. You want to position the pin headers so the small straight side is sticking through the board, so the angled side and the plastic is on the same side as the chip. Solder both sides for all 4 boards. I'd recommend holding them in place using blu tac to make it easier.

Then you want to solder the LED Matrix. I recommend sticking the pin header that came with it onto the LED matrix all the way before you solder, as shown in the picture. Leave the pin header connected on both sides and insert it into the board. NOTE: There is a lip on the white plastic of the LED matrix on one side, make sure that is aligned on the same side of the board as shown in the picture. Solder the pin headers in while still connected to the LED matrix to ensure they are lined up straight. Do it for all 4 boards.

Step 3: Wiring the MAX7219

Arranging the MAX7219 is a little complicated. and you definitely want to test it out before sticking it in place.

Download and install this library as per it's instructions.
Load the example from the library
Wire up the first MAX7219 board as follows (make sure to use the pins labeled IN):
VCC -> 3.3v
GND -> G
DIN -> D7 (GPIO13)
DS -> Defined by CS_PIN in the example sketch (I went with D3)
CLK -D5 (GPIO14)
The first board will be the furthest right in your display. The side with the IN pins will be the top.
Connect the output pins of the first board and connect it to the IN pins of the second board, it should be placed to the left of the first. Repeat for the remaining boards.
Run the example sketch, you should see the text animate on the screens.

One thing that I take advantage of in the project is VCC ,GND, DS, and CLK are all common pins on the input and output. so when wiring up I connected those pins only to the OUT pins, and only connected DIN as described above, this cut down on the amount of wires needed.

Step 4: Install the API Libraries

All the libraries you need to install are available on the Arduino Library Manager, which you can open by clicking Sketch -> Include Library -> Manage Libraries
(Note: if the search returns more than one, install the one where the Author is Brian Lough)

Arduino Facebook Library - Search for "Facebook" on the library manager
Arduino Twitter Library - Search for "Twitter" on the library manager
Arduino YouTube Library - Search for "YouTube" on the library manager
Arduino Instructables Library- Search for "Instructable" on the library manager.

To use the Twitter, Facebook and Youtube APIs you need to get API keys. Instructions are provided on the ReadMe of the Github pages linked above.

Step 5: Sketch for the Social Counter

The code for the project is available on my Github

You will need to replace the parts in the section up the top as shown in the picture.

The sketch will fetch data from the services every 5 minutes and will rotate what is shown on the LED matrix every 20 seconds.

Install it to your board and make sure it is working correctly for you, I recommend running it with the serial monitor open as you can see if something did not work as expected.

Step 6: Assembling the Hardware

Now we need to assemble the hardware. This can be done anyway you would like but I will show you how I done it.

First thing we need to is to hot glue the MAX7219 boards to a piece of thick card to hold them all together. Make sure you get them as level as possible.
I then broke up a popsicle stick so it was smaller than the thick card and stuck it in 3 places to the bottom of the thick card using double sided sticky tape.
I wired the LED matrix as described in the previous step. I connected each of the common wires together using this tiny breadboard I picked up on Aliexpress before. So all the VCC pins were in one row, all GND in another etc
Make sure to test again that it is working.
Stick the different parts down using double sided sticky tape. I stuck the popsicle sticks that were on the back of the card and also the little connected using the double sided sticky tape. The mini breadboard already had an adhesive back that I used.
I plugged in the USB cable and ran it out of the frame backing where there is a corner cut off.
Close up the frame and you should have your finished product!

In the future I will extend this project by the following:

Use Wifimanager so configuring the device can be code free.
Add more APIs (Reddit, Instagram, Twitch etc)
Tidy up the code so its a little neater to add/remove APIs

Hopefully you find this project interesting! I'm really happy with how it came out and I actually really like the look of the exposed wires. As always, if you have any questions please let me know!
Brian