Game of things: magento button [part 2/2]

Nel precedente post è stata introdotta tutta la parte backend del button che non è altro che un’interfaccia per le API di Magento 2. Il front: l’UI della funzionalità di aggiunta al carrello non sarà fatta, come di consueto, di HTML, CSS e JS ma di un device fisico. Il device sarà solo di esempio, l’idea di base è quella del single purpose button, il contesto non è la casa, ma il negozio.

A questo punto posso definire il mio goal: ho bisogno di un device in grado di dialogare con AWS per poter segnalare pressioni del button (che lato Amazon si traduce in uno state update).

Si potrebbero seguire diverse strade, utilizzando microcontrollori differenti e board differenti. Ad esempio potremmo utilizzare il più celebre Arduino, oppure utilizzare il GPIO del raspberry. Per il prototipo è stata scelta una board con l’ESP8266: NodeMCU. Quasi equivalente ad Arduino, ma con ESP8266 per la connessione wi-fi built-in. Per chi avesse avuto esperienze precedenti la board è programmabile con Arduino IDE.

Procediamo per gradi. Quello che andremo a costruire sono 2 moduli semplicissimi:

• il primo conterrà 2 led per segnalare lo stato del device;
• il secondo modulo conterrà il button;

Hardware

Il modo più semplice per seguire da questo punto per chi non abbia mai sentito parlare di breadboard, resistenze e led, sarebbe acquistare i componenti. La spesa è veramente per tutte le tasche, vi passo i link:

• 1 ESP8266 (es: NodeMCU)
• 2 resistore da 220Ω, 1 resistore da 10KΩ, 2 Led, 1 Pushbutton, jumpers (es: Basic Starter Kit)
• Mini Breadboards

In alternativa si può simulare la componente elettronica utilizzando servizi come TinkerCAD (ex circuits.io). Su TinkerCAD non esistono board con ESP8266 integrato che va sostituito con Arduino + ESP8266.

Modulo Led

Come per altre board, sul NodeMCU saranno presenti dei PIN a cui collegare i componenti esterni all’MCU. Questi PIN saranno controllabili via software in scrittura o lettura (digitale o analogico).

Questo primo modulo molto elementare serve solo a indicare lo stato dell’oggetto. E’ poco più di un Hello World su bread board. Ai PIN D5 e D7 del NodeMCU, collegheremo due LED. Il led rosso servirà per indicare lo stato di richiesta di aggiunta al carrello, mentre il led verde lampeggia fino al completamento della connessione Wi-Fi, dopo di che sarà fisso.

I LED hanno una polarità, il terminale più lungo è il polo positivo (anodo) mentre quello più corto è il polo negativo (catodo). Davanti ai LED va anteposto un resistore di 220 Ohm per evitare che bruci.

Sopra il modulo completo su una piccola breadboard . I 2 resistori partiranno dagli anodi dei LED e finiranno laddove posizioneremo il NodeMCU (esattamente nei PIN D5 e D7). Il jumper nero che parte dalla breadboard è sulla stessa riga dei due catodi dei LED, andrà collegato sul pin G (ground) del NodeMCU.

(Per chi non ha mai utilizzato una breadboard: le linee orizzontali rispetto alla foto delle 2 metà della breadboard sono un circuito, nel senso che ogni foro è connesso con gli altri sulla stessa riga)

Modulo button

Il button sarà collegato al pin D2 del NodeMCU. Il PIN sarà configurato per ricevere input, diversamente dai PIN collegati ai LED che saranno di output. Un pushbutton è un pulsante che se premuto mette in collegamento 2 parti di un circuito. Non mantiene uno stato.

Ha quattro piedini. Su 2 dei piedini ci andrà l’alimentazione a 3v e la messa a terra (con resistore 10 Kohm). Mentre un altro dei piedini sarà collegato al PIN D2 del NodeMCU per leggerne lo stato. Anche questo modulo sarà molto elementare:

Prima di di collegarlo sulla messa a terra del NodeMCU, va anteposto un resistore di 10 kOhm. Il jumper in rosso sarà per l’alimentazione di 3v, il nero al PIN G come di consueto mentre il jumper blu sarà collegato al PIN D2 del NodeMCU.

Integrazione dei moduli

Anche se molto elementare, il device è stato pensato modulare. A questo punto, I 2 moduli sopra, isolati su 2 mini breadoard vanno uniti. In basso il risultato finale.

Arduino IDE

Per poter programmare il device con l’IDE di Arduino ci sono alcune operazioni da fare preliminari. Nel video che segue viene spiegato come poter programmare NodeMCU con Arduino IDE.

Per quanto riguarda la parte software del button, è sufficiente trovare un po’ di letteratura su Arduino e ESP8266 e qualche esercizio su TinkerCAD. Io sono partito da questo README. Il programma consiste di  3 files. Due di questi conterranno le costanti con i dati di ambiente e relative dichiarazioni. Nei file di libreria keys.h e keys.c andranno inserite le costanti contenenti i dati di autenticazione alla rete Wi-Fi e ad AWS.

Nel file aws-esp.ino invece inseriremo il codice che consente all’ESP8266 su NodeMCU di gestire il LED e il button fisico e in più è collegato ad AWS. Qui il sorgente: è molto elementare.

Finally

Probabilmente ho saltato alcuni passaggi e sono stato molto leggero sugli altri, comunque ecco il risultato.