Tweet
Demo
Things Used In This Project
- Arduino UNO & Genuino UNO
- USB Cable for Arduino
- PHPoC WiFi Shield for Arduino
- Adafruit 8x8 LED matrix
- Jumper wires
Wiring Diagram
- Stack PHPoC WiFi shield or PHPoC Shield on Arduino
- LED ----- Arduino
- VCC ----- 5V
- GND ----- GND
- SDA ----- A4(SDA)
- SCL ----- A5(SCL)
Data Flow
Web browser ---> PHPoC WiFi Shield ---> Arduino
When user touch on a key, web app on web browser will send the character corresponding with the pressed key to PHPoC shield via WebSocket. When receiving the data, PHPoC shield automatically passes it to Arduino. Arduino takes action (displaying on LED matrix) according to the data received from PHPoC Shield.
Note that: PHPoC shield has a built-in program to pass data from web browser to Arduino. Therefore, we don't need to care about it.
What We Need to Do
- Set WiFi information for PHPoC shield (SSID and password)
- Upload new UI to PHPoC shield
- Write Arduino code
Setting Wifi Information for PHPoC Shield
See this instruction http://www.phpoc.com/support/manual/...rk_first_setup
Upload new Web UI to PHPoC Shield
- Download PHPoC source code remote_keypad.php (on code section).
- Upload it to PHPoC shield using PHPoC debugger according to this instruction http://www.phpoc.com/support/manual/...d=major_upload .
Write Arduino Code
- Install library:
- PHPoC library https://github.com/phpoc/arduino
- Adafruit_LEDBackpack library https://github.com/adafruit/Adafruit_LED_Backpack
- Adafruit-GFX-library https://github.com/adafruit/Adafruit-GFX-Library
- on Arduino IDE (see the instruction ) http://www.phpoc.com/support/manual/...=library_setup
- See source code in code section.
Try it
- Click serial button on Arduino IDE to see the IP address.
- Open web browser, type http:// replace_ip_address/remote_keypad.php
- Click connect button and test it.