Mit dem Aufstieg des Maker Movement-Maker Faire, 3D-Druckern, DIY-Robotern, Drohnen und so weiter - der Popularität von Arduino, einem Open-Source-Kit, das auf Mikrocontrollern basiert, hat viele Software-Entwickler zu Hardwarehackern gemacht. Sie können ein Arduino mit einem USB-Kabel an Ihren Computer anschließen, die IDE herunterladen und den Boom: Sie können loslegen.
Ich sehe jedoch viele Web-Ingenieure nicht, weil Sketch, die C-basierte Sprache, die zum Programmieren eines Arduino-Boards erforderlich ist, Web-Entwicklern nicht gefällt. Aber was wäre, wenn Sie JavaScript verwenden könnten, eine Sprache, mit der Sie bereits vertraut sind? Möchten Sie nicht mit einem spielen??
In diesem Tutorial zeige ich Ihnen, wie Sie mit Arduino mit Node.js loslegen können, und ich gehe durch das Prototyping einer Anwendung Internet of Things mit den JavaScript-APIs von PubNub.
Nun möchte ich Ihnen Johnny-Five vorstellen, ein Programmier-Framework von JavaScript Robotics. Johnny-Five ist Open Source und hat eine wachsende Anzahl von Entwicklergemeinschaften, da wir mittlerweile auf der ganzen Welt Community-basierte NodeBots-Tage sehen.
Beginnen wir also mit Johnny-Five, um den Arduino Uno zu programmieren!
Hardware und Software, die Sie benötigen:
Verbinden Sie zuerst Ihren Arduino Uno mit einem USB-Kabel mit Ihrem Computer. Laden Sie in der Zwischenzeit die Arduino IDE herunter und installieren Sie sie auf Ihrem Computer. Sie benötigen die IDE nur für die Ersteinrichtung.
Gehen Sie in der Arduino IDE zu Extras> Port und stellen Sie sicher, dass das richtige Board, Arduino Uno, ist mit dem richtigen Port verbunden (tty.usbmodem… für Mac, cu.usbmodem… für Windows).
Johnny-Five kommuniziert mit Arduino über das Firmata-Protokoll. Sie müssen also installieren StandardFirmata:
Stellen Sie sicher, dass Node.js auf Ihrem Computer installiert ist. Erstellen Sie ein entsprechendes Verzeichnis wie js-hallo
, und dann CD
in das Verzeichnis und installieren Sie Johnny-five mit der npm
Paket-Manager.
$ npm installiere johnny-five
Nun schreiben wir Hello World mit Johnny-Five. Da Sie über glänzende Hardware verfügen, erstellen Sie die „Hallo-Welt“ der Hardware, die blinkende LED-Anzeige!
LEDs, kurz für Leuchtdioden, sind polarisiert: Die positive (+) Seite wird Anode und die negative Seite Kathode genannt. Normalerweise hat jede LED zwei Beine, und das längere Bein ist ein Anodenstift. Dies ist wichtig, wenn Sie eine Schaltung erstellen.
Verwenden wir eine Farbkonvention, um Verwirrung zu vermeiden:
Ihre Drähte müssen nicht rot und schwarz sein, verwenden Sie jedoch zwei verschiedene Farben, damit Sie sich nicht selbst verwirren. Am besten verwenden Sie Rot, um eine Verbindung mit dem positiven Ende herzustellen (in dieser Praxis verwenden Sie Pin 13) und blockieren Sie gegen Masse (GND-Pin)..
Bei Adafruit erfahren Sie mehr über Steckbretter, Widerstände und alle Grundlagen der Teile!
Jetzt werden Sie auf der Softwareseite arbeiten.
Erstellen Sie eine Datei, blink.js, und fügen Sie den folgenden Code ein:
var five = erfordern ('johnny-five'); var board = new five.Board (); board.on ('ready', function () var led = new five.Led (13); // pin 13 led.blink (500); // 500ms Intervall);
Lauf:
$ sudo-Knoten blink.js
Die LED sollte im Abstand von 500 ms blinken. Überprüfen Sie andernfalls den Stromkreis und den Code.
Sie haben die Grundlagen gelernt, also machen wir weiter und lernen, wie Sie Ihre Hardware mit dem Internet kommunizieren lassen und Ihr erstes intelligentes Gerät prototypisieren!
Auf dem Markt gibt es verschiedene intelligente LED-Lampen, wie beispielsweise Philips HUE und LIFX. Mit ihnen können Sie die Helligkeit und Farbe Ihrer Smartphones und Tablets ändern.
Jetzt werden Sie etwas Ähnliches prototypisieren, mit dem Sie die Fernbedienung von einem Browser mit Arduino und einer LED aus steuern können!
Ein wichtiger Punkt dabei ist, dass Sie Ihre Hardware zu einem IoT-Gerät (Internet of Things) machen, indem Sie sie mit dem Internet verbinden. Anders als bei Bluetooth können Sie Ihre LED nach dem Anschluss an das Internet von überall auf der Welt bedienen. Um die Kommunikation mit einer Socket-Verbindung zu vereinfachen, verwenden wir die PubNub-JavaScript-API!
Das PubNub Data Stream Network (DSN) bietet eine globale Infrastruktur und ermöglicht das einfache Erstellen und Skalieren von Echtzeit-Apps und IoT-Geräten. Die intelligente LED, die Sie erstellen werden, funktioniert folgendermaßen:
Zum Beispiel, wenn ein Benutzer in San Francisco ein Arduino in Tokio kontrolliert:
Die Operation dauert nur eine Viertelsekunde.
In diesem Tutorial erstellen Sie einen Prototyp. Wenn Sie jedoch das eingebettete SDK verwenden, können Sie tatsächlich Verbraucherprodukte wie die intelligente Beleuchtungsplattform Emberlight erstellen.
Bei einer RGB-LED handelt es sich um eine Drei-in-Eins-LED, die rote, grüne und blaue Farben in einem einzigen Gehäuse enthält. RGB-LEDs kombinieren diese Farben, um Millionen von Farbtönen zu erzeugen. Jede LED verfügt über vier Beine (ein Bein pro Farbe) und eine gemeinsame Kathode (oder Anode). In diesem Lernprogramm verwenden Sie eine mit einer gemeinsamen Kathode.
Bauen Sie die Schaltung wie folgt auf. Anders als in der vorherigen Übung „LED blink“ werden Sie PWM-Pins (Pulse Width Modulation) verwenden, die auf Ihrer Arduino-Platine mit „~“ gekennzeichnet sind.
Der Unterschied zwischen diesen Pins ist im Wesentlichen der Unterschied zwischen analogen und digitalen Ergebnissen. Wenn Sie beispielsweise eine LED an einen digitalen Pin anschließen, erhalten Sie nur zwei Zustände: Ein oder Aus. Das Blinken der LED schaltet einfach die beiden Zustände um. Um jedoch Millionen von Farbtönen mithilfe einer RGB-LED zu erzeugen, müssen Sie zwischen den Zuständen wechseln. Daher müssen Sie analoge PWM-Pins verwenden.
Verbinden Sie die RGB-LED mit Drähten und Steckbrett mit den Arduino-Pins 6, 5 und 3 für Rot, Grün und Blau. Der gemeinsame Pin ist mit GND verbunden.
In diesem Diagramm habe ich 220Ω (für Rot) und 330Ω (für Grün und Blau) Widerstände verwendet, da rotes Licht zu stark wird, wenn der gleiche Widerstand mit Grün und Blau verwendet wird. Sie können sich während der Arbeit anpassen. Wenn Sie mehr über Widerstand und das Berechnen mit dem Ohmschen Gesetz erfahren möchten, empfehle ich Ihnen, von Adafruit zu lernen.
Nun bauen Sie eine Webschnittstelle zur Steuerung der LED auf.
Verwenden Sie das HTML5-Element um einen Schieberegler zu zeichnen, damit ein Benutzer den Wert jedes „R“, „G“ und „B“ ändern kann. Jede Farbe hat die Werte von 0 bis 255 (min = "0" max = "255") und verwendet nur ganzzahlige Werte, indem das Inkrement um 1 gesetzt wird (Schritt = "1")..
Dies steuert die Intensität der roten Farbe. In diesem Lernprogramm werde ich nicht über das Styling mit CSS sprechen, aber Sie können den Quellcode auf GitHub im gh-pages-Zweig anzeigen, um zu sehen, wie ich die visuellen Komponenten der Benutzeroberfläche strukturiere.
Als Nächstes erfahren Sie, wie Sie die JavaScript-API von PubNub verwenden, um die Farbdaten von der Benutzeroberfläche bis Arduino wiederzugeben.
Besorgen Sie sich Ihre eigenen API-Schlüssel und importieren Sie anschließend die JavaScript-Bibliothek von CDN oder lokal.
Initialisieren Sie die Instanz:
var pubnub = PUBNUB (subscribe_key: 'you_subscribe_key', publish_key: 'your_publish_key');
Lassen Sie uns Daten senden, um die Farbe der LED zu ändern, da das UI-Ereignis ausgelöst wird.
Hören Sie sich das Änderungsereignis des Schiebereglers DOM an, und senden Sie alle Änderungen an PubNub mit veröffentlichen
Methode.
var red = document.getElementById ('rot'); red.addEventListener ('change', function () pubnub.publish (channel: 'smart-led', Nachricht: color: 'red', Helligkeit: + this.value);, false);
Sie können jeden verwenden Kanal
Name in der Zeichenfolge, denken Sie jedoch daran, denselben Namen zu verwenden, wenn Sie die Daten später erhalten.
Als Nächstes verwenden Sie Node.js, um die Daten mit Hardware zu empfangen!
Mit Johnny-Five lassen sich RGB-LEDs sehr einfach aufleuchten. Installieren Johnny-Fünf
mit npm
, Probieren Sie diesen Code aus:
var five = erfordern ('johnny-five'); Var führte; five.Board (). on ('ready', function () console.log ('ready'); // Initialisieren Sie die RGB-LED-LED = new five.Led.RGB (Pins: // Pin-Nummern rot: 6, grün: 5, blau: 3); // test led.color (rot: 255, blau: 0, grün: 0); led.on (););
Leuchtet Ihre LED rot? Wenn nicht, überprüfen Sie Ihren Code und Ihre Schaltung. Wenn es immer noch nicht funktioniert, verwenden Sie möglicherweise anstelle der Kathode eine gemeinsame Anoden-LED. Versuchen Sie, den Ping zu GND zu entfernen, und verbinden Sie ihn erneut mit dem 5V-Pin.
Nun sehen Sie die Zeile unter dem Kommentar, // Prüfung
. Sie werden feststellen, dass die Farbmethode die Farbe angibt. In diesem Fall ist der Wert für Rot 255 und die anderen sind 0, so dass Ihre LED rein rot ist.
Mit Johnny-Five können Sie die RGB-Werte wie die CSS-Farbeigenschaft in 0 bis 255 angeben. Ändern Sie die Werte und experimentieren Sie mit der Farbe Ihrer LED!
Als Nächstes ändern Sie den Wert dynamisch anhand der von der Browser-Benutzeroberfläche gesendeten Daten.
Um die Daten zu erhalten, verwenden Sie die PubNub abonnieren
Methode.
Installieren pubnub
mit npm
:
$ npm install pubnub
Initialisieren Sie die Instanz genauso wie den Code auf der Browserseite:
var pubnub = required ('pubnub'). init (subscribe_key: 'your_subscribe_key', publish_key: 'your_publish_key');
Sie können die Daten lesen, indem Sie auf denselben Kanal zugreifen, von dem Sie die Daten senden. Sobald die Daten empfangen wurden, wird die Rückruffunktion aufgerufen, sodass Sie den Wert der LED widerspiegeln können.
pubnub.subscribe (channel: 'smart-led', callback: function (m) if (led) r = (m.color === 'red')? m.brightness: r; g = (m. color === 'green')? m.helligkeit: g; b = (m.color === 'blue')? m.helligkeit: b; led.color (rot: r, blau: b, grün: g); console.log ('Farbwechsel in…'); console.log (led.color ()); error: function (err) console.log (err);;
Das zurückgegebene Objekt m
ist eine Nachricht, die von der Browserseite kommt. Wenn der Wert für Blau beispielsweise 150 ist, erhalten Sie Farbe: 'blau', Helligkeit: 150
, und dann, wenn die nächsten Daten sind Farbe: 'Rot', Helligkeit: 150
, Das Rot = 150 fügt dem Blau = 150 hinzu, um eine lila Farbe zu erhalten.
Weitere Informationen zum gesamten Quellcode finden Sie unter /node/index.js im GitHub-Master-Zweig.
Ta-da! Sie haben gerade Ihre erste IoT-Smart-LED als Prototyp entwickelt!
Sie können andere Mikrocontroller wie Raspberry Pi mit Johnny-Five und PubNub verwenden. Sie sollten also versuchen, weitere IoT-Apps zu erstellen!