Hva gjør man når man A: Vil vite hvor mange som har likt bedriftens Facebook-side og B: Er over middels interessert i Internet of Things?
Man lager en bilderamme som viser Facebook-likes, vel!
- Forrige hobbyprosjekt: Simen laget en Slack-bot som logger temperaturen på kontoret
Tips oss!
Denne uken får vi ta en kikk på hobbyprosjektet til Helge Johnsen i Hamar- og Gjøvik-selskapet Escio.
Takk til prosjektleder Karen Stampen for tipset!
- Kjenner du til et kult hobbyprosjekt? Send tips til erlend@digi.no. Legg gjerne ved tekst og bilder.
Helge skriver:
Når det kommer til IoT (Internet of Things) er det omtrent bare fantasien som setter grenser for hva man kan finne på.
Med uante muligheter til å koble sammen den virkelige verden med internett kan man sette opp mer eller mindre nyttige prosjekter.
I denne artikkelen vil jeg dele oppskriften på en bilderamme som viser antall likes på Facebook for bedriften Escio som jeg jobber i, inspirert av de som tidligere har laget display som viser antall abonnenter de har på sine YouTube-kanaler.
For meg var dette først og fremst et artig prosjekt, og jeg møtte noen utfordringer på veien som jeg lærte en hel del av.
Jeg håper dette kan inspirere andre til å utforske en verden der vi kobler fysiske ting med internett!
Mål
Målet var å lage en bilderamme som viser antallet som liker en Facebookside. Selv om jeg de siste årene har lekt mye med Arduino så er det å kode i C langt ifra mitt felt.
Noe som førte til mye prøving og feiling i begynnelsen, men jeg kom i mål til slutt.
Facebook app
For å hente ut antall likes (og mye annen informasjon) om en Facebookside så må man ta i bruk Facebook Graph API. Her opprettet jeg en app som ble knyttet til Facebooksiden.
Jeg kommer ikke til å gå inn i detalj om hvordan man oppretter og administrerer en app, men viser i korte trekk hvordan jeg gjorde det.
Lag en app
Gå til https://developers.facebook.com/ og opprett en ny app. Etter at appen er opprettet, noter ned app ID og app Secret. Disse trenger du senere.
Hvis du ønsker å teste, leke og utforske mulighetene så gå til https://developers.facebook.com/tools/explorer
AAA = Facebook Page ID eller navn, BBB = App ID, CCC = App Secret. Legg merke til | (pipe) mellom App ID og App Secret.
Hardware
Over til det jeg synes er den morsomste delen: Jeg benyttet meg av en NodeMCU Mini. Disse er tilgjengelig i mange varianter og priser på en rekke nettbutikker og eBay.
Det er to grunner til at jeg valgte å bruke denne; den ene er at den er liten og vil ta opp lite plass i en bilderamme. Den andre at jeg hadde en slik liggende.
I tillegg kjøpte jeg fire 7-segmenter som var ferdig montert på et brett. Det gjør tilkoblingen lettere siden man kun trenger å bruke fire av NodeMCU sine utganger.
Litt flaks skal man ha
Det viser seg at inn- og utgangene på displayet og NodeMCU passet perfekt ovenfor hverandre. Som du ser på bildet under er 5V, jording og signal i samme rekkefølge.
Normalt opererer NodeMCU over 3.3 volt. Det fikk displayet til å lyse noe svakere, men jeg kunne gi displayet 5 volt via VIN på NodeMCU.
Oppkobling
Som du kan se av mitt noe uklare bilde over er inn og utgangene mellom NodeMCU og displayet på linje. Dette gjorde at jeg bare kunne skyve NodeMCU-brettet inn på pinnene til displayet og ha på litt loddetinn for å sikre dem.
- VIN → 5V
- GND → GND
- D4 → DIO
- D3 → CLK
Fraskrivelse: Det er helt tilfeldig at jeg kunne hente ut 5 volt fra VIN. Om det er en feil at man kan hente ut 5 volt fra en inngang eller ei vet jeg ikke, og jeg tar ikke ansvar for skade på utstyr om du prøver å koble opp ditt utstyr slik jeg har gjort det. Min anbefaling er å undersøke muligheten eller ta en råsjans slik jeg gjorde.
Bilderamme
Bilderammen er en Ikea Ribba 00.783.34. Årsaken til at jeg valgte denne rammen er at den har en dyp ramme som skjuler elektronikken og kan henges på en vegg.
Bildet viser at jeg har festet på en mal og laget hull der jeg ønsket å ha displayet.
Bilde: Helge Johnsen
Neste steg var å plassere displayet på en slik måte at det lyste best mulig.
Som du forstår begynte jeg ikke med bilderammen, som i og for seg kan være fristende. Jeg begynte med en slags «proof of concept» før jeg gikk til innkjøp av materiale.
Etter at jeg hadde funnet ut av Facebook API og APP måtte jeg igjennom en noe ukjent verden i C++-universet. Etter noe prøving og feiling endte jeg opp med et tilfredsstillende resultat.
Biblioteker
Jeg brukte Arduino IDE og noen biblioteker for å programmere.
Trådløst nettverk – For å koble NodeMCU til et trådløst nettverk trenger vi et bibliotek for ESP8266. Gå til https://github.com/esp8266/Arduino og følg instruksene for å legge det til i Arduino IDE.
Display – Last ned SevenSegmentTM1637 Arduino Library fra https://github.com/bremme/arduino-tm1637
Merk: ulike display bruker ulik elektronikk (chips). Så det kan være at du må benytte et annet bibliotek enn det jeg endte opp med (dette var det første jeg fant som virket med mitt display).
JSON – For å håndtere JSON-data fra Facebook brukte jeg ArduinoJson - C++ JSON library for IoT https://github.com/bblanchon/ArduinoJson
Facebook fingerprint – Dette er ikke et bibliotek men likevel noe vi trenger for å koble til Facebook sin verden. Istedet for å prøve og forklare noe som for meg er litt uklart så følg instruksene her https://github.com/gbrault/esp8266-Arduino/blob/master/doc/esp8266wifi/client-secure-examples.md#how-to-verify-servers-identity
Koden
Koden får du også tak i på Hackster.io https://www.hackster.io/helge-johnsen/facebook-fan-count-faf13e#code
Lykke til!
Jeg er klar over at koden og fremgangsmåten er langt fra effektiv. Enhver som kan kode C++ vil nok skrike høyt og rive seg i håret av koden min.
Men den virker og min bilderamme som viser antallet som liker Facebooksiden har nå kjørt uavbrutt i flere måneder uten problemer. Til stor glede for oss på kontoret når noen liker Escio på Facebook!
