# Huzzah Weather Display ## Overview ![](https://cdn-learn.adafruit.com/assets/assets/000/027/893/medium800thumb/weather_Weather_Station_GIF.jpg?1448322229) Danger: The [Huzzah ESP8266 module](../../../../adafruit-huzzah-esp8266-breakout) is an inexpensive microcontroller with WiFi capabilities. It can be programmed with the Arduino IDE so that you don't need a separate microcontroller! This device gets the latest weather information from [DarkSky.net](DarkSky.net) and displays it on a [1.3" monochrome OLED](https://www.adafruit.com/products/938) display. **Note on difficulty:** this is an intermediate level project and involves running a PHP script on a web server to parse data from [DarkSky.net](DarkSky.net) before it gets read by the Huzzah. It's helpful to know some basics about PHP and web servers before starting this project! This project was created by [Daniel Eichhorn](https://github.com/squix78/esp8266-projects) and the code was forked to work with Adafruit hardware and libraries. The [weather icons](http://www.alessioatzeni.com/meteocons/) were created by [Alessio Atenzi](http://www.alessioatzeni.com/). [Dano Wall](https://github.com/danowall) designed the lasercut enclosure. # Huzzah Weather Display ## Parts List ![](https://cdn-learn.adafruit.com/assets/assets/000/027/894/medium800/weather_Weather_Station_kit_ORIG.jpg?1443212675) ## Electronics Parts - [Huzzah ESP8266 Breakout](https://www.adafruit.com/product/2471) - [Monochrome 1.3" 128x64 OLED graphic display](https://www.adafruit.com/products/938) - [USB micro-B breakout](https://www.adafruit.com/product/1833) - 2 x 1-pin male headers (these are included in the above breakouts) - 6-pin right angle header (cut from [one of these](https://www.adafruit.com/products/1540)) - [thin wire](https://www.adafruit.com/products/1446) - [MicroUSB cable](https://www.adafruit.com/products/2008) (for powering the clock) - [5V 2A USB port power supply](https://www.adafruit.com/products/1994) (if you don't want to just power the clock from your computer's USB port) - A web server running a small PHP script. You can even use a Raspberry Pi running locally on the network or any web hosting service you use. Featured ### Adafruit HUZZAH ESP8266 Breakout [Adafruit HUZZAH ESP8266 Breakout](https://www.adafruit.com/product/2471) Add Internet to your next project with an adorable, bite-sized WiFi microcontroller, at a price you like! The ESP8266 processor from Espressif is an 80 MHz microcontroller with a full WiFi front-end (both as client and access point) and TCP/IP stack with DNS support as well. While this chip... In Stock [Buy Now](https://www.adafruit.com/product/2471) [Related Guides to the Product](https://learn.adafruit.com/products/2471/guides) ![Angled shot of a Adafruit HUZZAH ESP8266 Breakout. ](https://cdn-shop.adafruit.com/640x480/2471-06.jpg) Featured ### Monochrome 1.3" 128x64 OLED graphic display - STEMMA QT / Qwiic [Monochrome 1.3" 128x64 OLED graphic display - STEMMA QT / Qwiic](https://www.adafruit.com/product/938) These displays are small, only about 1.3" diagonal, but very readable due to the high contrast of an OLED display. This display is made of 128x64 individual white OLED pixels, each one is turned on or off by the controller chip. Because the display makes its own light, no backlight is... In Stock [Buy Now](https://www.adafruit.com/product/938) [Related Guides to the Product](https://learn.adafruit.com/products/938/guides) ![Monochrome 1.3" OLED module with Adafruit logos falling like snow](https://cdn-shop.adafruit.com/product-videos/640x480/938-05.jpg) Featured ### USB Micro-B Breakout Board [USB Micro-B Breakout Board](https://www.adafruit.com/product/1833) Simple but effective - this breakout board has a USB Micro-B connector, with all 5 pins broken out. Great for pairing with a microcontroller with USB support, or adding USB 5V power to a project. We use a micro-B connector with through-hole shielding pads for an excellent strong... In Stock [Buy Now](https://www.adafruit.com/product/1833) [Related Guides to the Product](https://learn.adafruit.com/products/1833/guides) ![Angled shot of small, blue, rectangular USB micro-b breakout board.](https://cdn-shop.adafruit.com/640x480/1833-06.jpg) ## Enclosure Parts - 2 x laser-cut acrylic pieces ([download vectors from repository](https://github.com/andydoro/Huzzah-Weather-Display)) - 3 x 1" 2-56 screws - 1 x 3/4" 2-56 screw - 2 x 1/4" 2-56 screw - 15 x 2-56 hex nuts - 2 x 3/16" nylon spacers  ##   ## Tools - a computer which can program the Trinket Pro 5V - [FTDI cable](https://www.adafruit.com/products/70) (for programming the Huzzah breakout) - [a soldering iron](https://www.adafruit.com/products/1204) - [solder](https://www.adafruit.com/products/2473) - [wire strippers](https://www.adafruit.com/products/527) - [diagonal cutters](https://www.adafruit.com/product/152) - [small flathead screwdriver](https://www.adafruit.com/products/424) (2.4mm) # Huzzah Weather Display ## Circuit Assembly ## Overview The goal is to solder the Huzzah and OLED breakout boards so that the OLED screen and Huzzah module are facing in opposite directions. The two buttons on the Huzzah need to be accessible to put the module into bootloader mode and program the Huzzah. The power and ground will ultimate be connected to the 5V and GND pins on the microUSB breakout board. We'll use a microUSB cable to power the device. ![](https://cdn-learn.adafruit.com/assets/assets/000/029/744/medium800/huzzahweatherdisplay_bb.png?1452872436) ## First Steps On the OLED breakout, solder the two solder jumper pads SJ1 and SJ2 so that you can use the I2C protocol. Do this before soldering the boards together! ![](https://cdn-learn.adafruit.com/assets/assets/000/026/823/medium800/weather_IMG_6574.jpg?1438272998) You should get a 6-pin right angle header to solder into the Huzzah FTDI pins. Do this before soldering other things together! Be sure to solder all six headers securely. ![](https://cdn-learn.adafruit.com/assets/assets/000/026/824/medium800/weather_IMG_6575.jpg?1438273171) Ultimately you will solder the two boards with a header pin lining up V+ on the Huzzah and Vin on the 1.3" OLED. This way all the boards will stack up nicely. Make the other wire connections before soldering the two together however, since it will make the process easier. I've found that thin-gauge, wrapping style wire works best.  Start by soldering a header pin into the Vin on the 1.3" OLED breakout. ![](https://cdn-learn.adafruit.com/assets/assets/000/026/825/medium800/weather_IMG_6580.jpg?1438273180) If we examine the schematic again, notice that the Huzzah has two GND pins. Since there will be multiple connections to the same GND pin, it can be helpful to solder a male header pin into one of the GND pins. Make sure it's sticking out more on top, so solder it on the bottom of the Huzzah board. ![](https://cdn-learn.adafruit.com/assets/assets/000/026/821/medium800/weather_IMG_6590.jpg?1438272781) Now make the other connections between the Huzzah and OLED breakout board following the schematic below using thin wire. Remember, ultimately you'll use the header pin soldered into the OLED breakout to make the 5V power connection between the two boards.  ![](https://cdn-learn.adafruit.com/assets/assets/000/029/745/medium800/huzzahweatherdisplay_bb.png?1452872476) From the Huzzah to the OLED breakout, connect: - pin 2 to Rst - pin 12 to Clk - pin 14 to Data - GND to GND ![](https://cdn-learn.adafruit.com/assets/assets/000/026/845/medium800/weather_IMG_6592.jpg?1438284473) Now you can solder the Huzzah and OLED breakout boards together. They should be facing away from each other and lined up like this. Place the Vin header pin on the OLED breakout into the V+ on the Huzzah. ![](https://cdn-learn.adafruit.com/assets/assets/000/026/844/medium800/weather_IMG_6594.jpg?1438284201) Now connect the MicroUSB breakout. Connect the 5V pin to the header pin going through V+ on the Huzzah. You can also connect the GND pin on the MicroUSB breakout to the header pin sticking out of the Huzzah GND. ![](https://cdn-learn.adafruit.com/assets/assets/000/026/846/medium800/weather_IMG_6596.jpg?1438286021) Once you've attached the MicroUSB breakout you can cut down the excess header on the V+ pin and GND pin. The circuit is assembled! # Huzzah Weather Display ## PHP script ## PHP script Download[the code](https://github.com/andydoro/Huzzah-Weather-Display) from github by clicking  **Download ZIP**. Uncompress the file and find the folder named **php**.  Using an FTP client, upload these files to a web server which runs PHP-- most of them do. You can even run it on a Raspberry Pi on your local network. Be sure to also include the contents of the **lib** folder.  This PHP script parses some information from DarkSky.net and takes some of the heavy string processing off the shoulders of the ESP8266. The script is setup to get the temperature in Fahrenheit and other information in English. If you'd like to change this modify the following lines of code: ```auto $units = 'us'; // Can be set to 'us', 'si', 'ca', 'uk' or 'auto' (see forecast.io API); default is auto $lang = 'en'; // Can be set to 'en', 'de', 'pl', 'es', 'fr', 'it', 'tet' or 'x-pig-latin' (see forecast.io API); default is 'en' ``` Danger: Go to [https://darksky.net/dev/](https://darksky.net/dev/) and sign up for a free API key. At the free level there's a pretty generous limit to the number of requests per day you can make, well below what we'll be using.  It's a good idea to test the PHP script at this point by pointing your web browser to: **http://YOUR\_DOMAIN\_NAME/weather.php?apiKey=APIKEY&lat=40.71&lon=-74&units=us** Alter this URL to point to your PHP script, replacing **YOUR\_DOMAIN\_NAME** with the actual domain name hosting your script and replacing **APIKEY** with the API key you received from **forecast.io**. This longitude and latitude are for New York City- feel free to change them to get the weather for your location in the world.  NASA has [a good tool for finding your longitude and latitude](http://mynasadata.larc.nasa.gov/latitudelongitude-finder/). If you manage to enter the URL correctly, your web browser should give you a webpage that looks like this: ![](https://cdn-learn.adafruit.com/assets/assets/000/027/897/medium800/webscreenweather.png?1443215450) # Huzzah Weather Display ## Uploading Code ## Arduino code Make sure to use [Arduino IDE 1.6.4 or higher](https://www.arduino.cc/en/Main/Software) and follow [this tutorial](../../../../adafruit-huzzah-esp8266-breakout/using-arduino-ide) to install the ESP8266 board packages. Download[the code](https://github.com/andydoro/Huzzah-Weather-Display) from github by clicking  **Download ZIP**. Uncompress the file and copy the folder to your Arduino sketchbook folder. Attach the Huzzah ESP8266 to your computer using an FTDI cable. Since it's possible to connect the FTDI cable backwards, make sure to line up the black wire on the FTDI cable to the GND pin on the 6-pin connector. The Huzzah will get power from the FTDI cable, you don't have to have the microUSB plugged in. Once that is done, open the sketch and select:  **Tools → Board → Adafruit HUZZAH ESP8266** **CPU Frequency → 80 MHz** **Upload Speed → 115200** **Port → select the USB port with the FTDI cable** Make sure the code compiles properly. All of the relevant libraries should be included. For more information on using the Huzzah ESP8266 module with the Arduino IDE, follow [this tutorial](../../../../adafruit-huzzah-esp8266-breakout/using-arduino-ide).   ## Modifying the Code You'll need to make some modifications to the code to make it work properly on your WiFi network. ```auto #define WIFISSID "YOUR_WIFI_SSID" #define PASSWORD "YOUR_WIFI_PASSWORD" ``` Replace  **YOUR\_WIFI\_SSID** with the name of your WiFi network and  **PASSWORD** with your WiFi password. Keep the quotation marks! ```auto #define FORECASTAPIKEY "YOUR_FORECAST_API_KEY" ``` Replace  **YOUR\_FORECAST\_API\_KEY** with the API key you received when you signed up with **DarkSky.net**. Keep the quotation marks! ```auto #define DOMAINNAME "YOUR_DOMAIN_NAME" ``` Replace **YOUR\_**** DOMAIN\_NAME **with the domain name hosting the PHP script, e.g.** adafruit.com**. Keep the quotation marks! In WeatherClient.cpp feel free to alter the URL path to reflect the location of your PHP script on the web.  It's a good idea to test the PHP script at this point by pointing your web browser to: **http://YOUR\_DOMAIN\_NAME/weather.php?apiKey=APIKEY&lat=LATITUDE&lon=LONGITUDE&units=UNITS** making the appropriate substitutions for **APIKEY** , **LATITUDE** , **LONGITUDE** and **UNITS**. ```auto // New York City #define LATITUDE 40.69 #define LONGITUDE -73.99 ``` This longitude and latitude are for New York City- feel free to change them to get the weather for your location in the world.  NASA has [a good tool for finding your longitude and latitude](http://mynasadata.larc.nasa.gov/latitudelongitude-finder/). ## Uploading the Code Attach the Huzzah to your computer using an FTDI cable, making sure to plug it in the right way. When you're ready to upload the code, put the Huzzah module into bootloader mode. You'll have to do this before each upload. There is no timeout for bootload mode, so you don't have to rush! 1. Hold down the **GPIO0** button, the red LED will be lit 2. While holding down **GPIO0** , click the **RESET** button 3. When you release the RESET button, the red LED will be lit dimly, this means its ready to bootload This is what a successful upload will look like: ![](https://cdn-learn.adafruit.com/assets/assets/000/027/222/medium800/weather_Screen_Shot_2015-08-18_at_12.30.37_PM.png?1439915543) It can be difficult to access the buttons once the module is in the enclosure! The best way I've found is to manipulate the two buttons with two pairs of tweezers. ## Debugging Use the Arduino IDE Serial Monitor at 115200 baud to check for error messages. The device should connects to WiFi and download the webpage immediately, and then do this again every ten minutes. If the Huzzah connects to the WiFi network and webpage correctly, the window should look something like this: ![](https://cdn-learn.adafruit.com/assets/assets/000/027/223/medium800/weather_Screen_Shot_2015-08-18_at_12.43.31_PM.png?1439916513) Make sure the URL matches the actual location of your PHP script. You can test it by pasting it into a web browser. If the code is uploaded correctly, you should see the display showing the weather for "Now", "Today" and "Tomorrow". ![](https://cdn-learn.adafruit.com/assets/assets/000/027/896/medium800/weather_Weather_Station_iso_screen_02_ORIG.jpg?1443214174) # Huzzah Weather Display ## Enclosure Assembly The lasercut enclosure consists of two laser-cut pieces of acrylic held together by screws. The vector files are available from [the Github repository](https://github.com/andydoro/Huzzah-Weather-Display) or you can download them here: [vectorfiles.zip](https://learn.adafruit.com/system/assets/assets/000/027/225/original/vectorfiles.zip?1439930147) The enclosure can be put together with some 2-56 machine screws and hex nuts: - 3 x 1" 2-56 screws - 1 x 3/4" 2-56 screw - 2 x 1/4" 2-56 screw - 15 x 2-56 hex nuts - 2 x 3/16" nylon spacers  Start by removing the protective sticker from the OLED breakout. Place it into the laser-cut acrylic piece with the corresponding hole or window. Notice the small notch which corresponds to the OLED ribbon connector. It can help at this point to remove the double-stick tape affixing the OLED to the breakout PCB in order to get things lined up well. ![](https://cdn-learn.adafruit.com/assets/assets/000/027/111/medium800/weather_IMG_6624.jpg?1439311914) Start by putting a 1" screw through the top left hole (if the screen is facing you). This screw will go through all three breakout boards, lining them all up! Start by putting two hex nuts between the the OLED breakout and the Huzzah breakout and putting the screw all the way through. Don't overtighten though! ![](https://cdn-learn.adafruit.com/assets/assets/000/027/112/medium800/weather_IMG_6626.jpg?1439311955) Add a 3/16" nylon spacer and hex nut at the end. ![](https://cdn-learn.adafruit.com/assets/assets/000/027/117/medium800/weather_IMG_6628.jpg?1439313649) Place the 3/4" screw into the top right hole of the Huzzah breakout. You might need to angle this in to get past the OLED breakout. Tighten down with a hex nut.  ![](https://cdn-learn.adafruit.com/assets/assets/000/027/116/medium800/weather_IMG_6635.jpg?1439313363) Place the 1/4" screw through the top right hole of the acrylic and secure it on the other side of the OLED breakout with a hex nut. This can be a bit tricky- you may have to hold the hex nut in place with needle-nose pliers while you tighten the screw with a screwdriver. ![](https://cdn-learn.adafruit.com/assets/assets/000/027/118/medium800/weather_IMG_6637.jpg?1439313754) Add a nylon space and hex nut to the 3/4" screw. ![](https://cdn-learn.adafruit.com/assets/assets/000/027/121/medium800/weather_IMG_6654.jpg?1439314748) Attach the microUSB breakout to the other piece of lasercut acrylic. Use a 1/4" screw and hex nut to fix the left hole of the breakout to the acrylic on the side with the cutout notch. The cutout notch is there to allow a microUSB cable to connect. ![](https://cdn-learn.adafruit.com/assets/assets/000/027/119/medium800/weather_IMG_6643.jpg?1439313988) Place the other hole of the microUSB breakout through the 1" screw and secure with a hexnut. You can also secure the other side of the acrylic with a hex nut. ![](https://cdn-learn.adafruit.com/assets/assets/000/027/120/medium800/weather_IMG_6644.jpg?1439314426) Now for the easy part! You just need to add the bottom two screw. The spacing can be set using three hex nuts here. ![](https://cdn-learn.adafruit.com/assets/assets/000/027/122/medium800/weather_IMG_6649.jpg?1439314991) Add another 1" screw on the other side and do the same with 3 more hex nuts. ![](https://cdn-learn.adafruit.com/assets/assets/000/027/123/medium800/weather_IMG_6655.jpg?1439315610) You're done with the enclosure!  Attach a microUSB cable to a computer or 5V power adapter and power it up! ![](https://cdn-learn.adafruit.com/assets/assets/000/027/895/medium800thumb/weather_Weather_Station_GIF.jpg?1448322266) ## Guide Products ### Adafruit HUZZAH ESP8266 Breakout [Adafruit HUZZAH ESP8266 Breakout](https://www.adafruit.com/product/2471) Add Internet to your next project with an adorable, bite-sized WiFi microcontroller, at a price you like! The ESP8266 processor from Espressif is an 80 MHz microcontroller with a full WiFi front-end (both as client and access point) and TCP/IP stack with DNS support as well. While this chip... In Stock [Buy Now](https://www.adafruit.com/product/2471) [Related Guides to the Product](https://learn.adafruit.com/products/2471/guides) ### Monochrome 1.3" 128x64 OLED graphic display - STEMMA QT / Qwiic [Monochrome 1.3" 128x64 OLED graphic display - STEMMA QT / Qwiic](https://www.adafruit.com/product/938) These displays are small, only about 1.3" diagonal, but very readable due to the high contrast of an OLED display. This display is made of 128x64 individual white OLED pixels, each one is turned on or off by the controller chip. Because the display makes its own light, no backlight is... In Stock [Buy Now](https://www.adafruit.com/product/938) [Related Guides to the Product](https://learn.adafruit.com/products/938/guides) ### USB Micro-B Breakout Board [USB Micro-B Breakout Board](https://www.adafruit.com/product/1833) Simple but effective - this breakout board has a USB Micro-B connector, with all 5 pins broken out. Great for pairing with a microcontroller with USB support, or adding USB 5V power to a project. We use a micro-B connector with through-hole shielding pads for an excellent strong... In Stock [Buy Now](https://www.adafruit.com/product/1833) [Related Guides to the Product](https://learn.adafruit.com/products/1833/guides) ## Related Guides - [Adafruit CAN Bus BFF](https://learn.adafruit.com/adafruit-can-bus-bff.md) - [Generating Text with ChatGPT, Pico W & CircuitPython](https://learn.adafruit.com/generating-text-with-chatgpt-pico-w-circuitpython.md) - [CircuitPython OLED and Dual Knob Sketcher](https://learn.adafruit.com/circuitpython-oled-knob-sketcher.md) - [Monitor Your Greenhouse with a No-Code Environmental Sensor](https://learn.adafruit.com/monitor-your-greenhouse-with-a-no-code-environmental-sensor.md) - [Toddler Timer](https://learn.adafruit.com/toddler-timer.md) - [Adding a WiFi Co-Processor to CircuitPython](https://learn.adafruit.com/adding-a-wifi-co-processor-to-circuitpython-esp8266-esp32.md) - [Easy Alexa (Echo) Control of your ESP8266 Huzzah](https://learn.adafruit.com/easy-alexa-or-echo-control-of-your-esp8266-huzzah.md) - [USB MIDI Keyset Controller](https://learn.adafruit.com/midi-keyset.md) - [Adafruit BME680](https://learn.adafruit.com/adafruit-bme680-humidity-temperature-barometic-pressure-voc-gas.md) - [MIDI for Makers](https://learn.adafruit.com/midi-for-makers.md) - [CircuitPython Sound Box](https://learn.adafruit.com/circuitpython-sound-box.md) - [Using the TRRS Trinkey as an Assistive Technology Device](https://learn.adafruit.com/using-the-trrs-trinkey-as-an-assistive-technology-device.md) - [CircuitPython Powered Sip & Puff with ST LPS33HW Pressure Sensor](https://learn.adafruit.com/st-lps33-and-circuitpython-sip-and-puff.md) - [Pico W HTTP Server with CircuitPython](https://learn.adafruit.com/pico-w-http-server-with-circuitpython.md) - [Adafruit TPL5110 Power Timer Breakout](https://learn.adafruit.com/adafruit-tpl5110-power-timer-breakout.md)