February 2019

iotqu - Sekilas tentang Node-RED

Artikel ini akan memperkenalkan kepada Anda beberapa contoh Node-RED, baik untuk memberi Anda rasa kemampuannya maupun untuk memperkenalkan konsep dasarnya. Disini juga akan membahas sejarah Node-RED dan asal-usulnya untuk memberi Anda gambaran tentang apa yang baik untuk Node-RED dan jenis tugas apa yang sebaiknya diserahkan pada bahasa pemograman.

Node-RED adalah sebuah tool (alat) yang ampuh untuk membangun aplikasi Internet of Things (IoT) dengan fokus pada penyederhanaan 'wiring together' dari blok kode untuk melakukan tugas. Ini menggunakan pendekatan pemrograman visual yang memungkinkan pengembang untuk menghubungkan blok kode yang telah ditetapkan, yang dikenal sebagai 'node', bersama-sama untuk melakukan tugas. Node yang terhubung, biasanya kombinasi dari node input, node pemrosesan dan output node, ketika dihubungkan bersama, membentuk 'flow'.

Awalnya dikembangkan sebagai proyek open source di IBM pada akhir 2013, untuk memenuhi kebutuhan mereka untuk dengan cepat menghubungkan hardware dan device ke layanan web dan software lainnya - sebagai semacam perekat untuk IoT - ia dengan cepat berkembang menjadi tujuan umum tool pemrograman IoT . Yang penting, Node-RED telah dengan cepat mengembangkan basis pengguna yang signifikan dan terus berkembang serta komunitas pengembang aktif yang menyumbangkan simpul baru yang memungkinkan programmer untuk menggunakan kembali kode Node-RED untuk berbagai macam tugas.

Meskipun Node-RED pada awalnya dirancang untuk bekerja dengan Internet of Things, yaitu perangkat yang berinteraksi dan mengendalikan dunia nyata, seperti yang telah berevolusi, Node-RED telah menjadi berguna untuk berbagai aplikasi.

Pada akhir penjelasan ini, Anda harus memiliki pemahaman tingkat tinggi tentang Node-RED, model pemrogramannya dan beberapa node pre-built yang sederhana serta wawasan tentang asal-usul dan penggunaan terbaik Node-RED.

Mengenal Node-RED

Mari kita mulai dengan melihat beberapa contoh sederhana dari hal-hal yang dapat Anda lakukan dengan Node-RED. Tujuan artikel ini bukan untuk membuat pemrograman dengan Node-RED, tetapi untuk memberikan rasa kemampuannya melalui beberapa contoh tingkat tinggi. Jika Anda benar-benar ingin terjun langsung, Anda bisa langsung melanjutkan ke artikel berikutnya di mana Anda akan dibawa melalui langkah-langkah untuk membuat dan menjalankan flow pertama Anda.

Flow contoh pertama ini akan menerima pesan dari umpan Twitter yang berisi tagar dan menyalakan dan mematikan LED ketika tweet baru telah tiba. Untuk contoh ini, mari kita asumsikan bahwa NODE-RED berjalan pada Raspberry PI - situasi umum bagi banyak pengguna Node-RED.

Contoh 1.1 Menggunakan Twitter untuk mengontrol Raspberry PI

Flow Node-RED untuk memeriksa Twitter dan untuk melihat apakah tagar #led terdeteksi, menyalakan LED yang terhubung ke Pi ditunjukkan pada Gambar 1.1. Seperti yang Anda lihat, ini cukup sederhana; itu terdiri dari 3 node yang dihubungkan bersama - sebuah node twitter di sebelah kiri, sebuah trigger node di tengah dan sebuah node Raspberry Pi (gpionode) di sebelah kanan. (gpio adalah singkatan dari General Purpose Input / Output dan adalah nama yang diberikan untuk simpul PI Raspberry generik yang menangani IO). Node, diwakili oleh kotak bulat, biasanya memiliki ikon untuk mewakili tipenya, misalnya ikon burung Twitter di node pertama, dan nama teks yang dapat ditetapkan oleh programmer.

Masing-masing dari ketiga simpul ini dibangun ke dalam alat pemrograman visual Node-RED dan dapat diseret dari palet simpul ke ruang kerja utama. Mereka kemudian 'wiring' bersama-sama dengan menggabungkan tab output mereka ke tab input dari node berikutnya dalam aliran (gumpalan abu-abu kecil di kanan atau kiri kotak node.) Artikel berikutnya akan melihat UI secara rinci, tetapi untuk sekarang mari kita fokus pada kemampuan tingkat tinggi.

Gambar 1.1 Alur 3 simpul sederhana yang menggunakan tag Twitter untuk memicu LED pada Raspberry PI.

Simpul Twitter adalah simpul bawaan di Node-RED dan menyembunyikan semua kerumitan menggunakan API Twitter. Ini dapat dikonfigurasi dengan kredensial akun pengguna dan berbagai string pencarian, dalam kasus kami hanya mencari tagar '#led'.

Ketika simpul Twitter melihat tag baik dalam tweet ke pengguna, atau feed tweet publik, itu membuat pesan baru dengan rincian tweet, yang meneruskan ke simpul berikutnya dalam aliran. Dalam contoh kami, karena output simpul Twitter ditransfer ke input simpul (triger) pemicu, simpul (triger) pemicu menerima pesan dengan detail tweet.

Node pemicu (triger) adalah node bawaan lain dalam Node-RED dan perilaku defaultnya adalah menunggu pesan apa pun pada inputnya. Ketika menerima pesan, itu 'triger', dan mengirim pesan pada outputnya dengan nilai "1" sebagai badan pesan. Kemudian menunggu 1 detik dan mengirim pesan kedua dengan nilai "0" di badan pesan.

Karena node (triger) pemicu terhubung ke gpio node, yang mengontrol pin Input / Output atau IO pada Raspberry PI, maka mendapatkan dua pesan ini, terpisah 1 detik, pada inputnya.

Sekali lagi, gpio node adalah simpul bawaan pada Node-RED yang menyembunyikan detail pengaturan pin IO pada PI. Saat menerima pesan dengan nilai "1" di badan, ia mengambil pin IO tinggi, dan ketika menerima pesan dengan tubuh "0", ia mengambil pin rendah. Dalam contoh ini, gpionode dikonfigurasikan untuk mengontrol pin nomor 12, dan simpul tersebut menunjukkannya pada ikon simpul.

Jika PI Anda terhubung dengan LED yang terhubung ke Pin 12, gpionode akan menjadi high selama 1 detik dan kemudian low akan menyebabkan LED berkedip selama 1 detik.

Jika Anda berpikir tentang apa yang terjadi di sini, itu sebenarnya adalah contoh yang sangat kuat dari Node-RED dan Internet of Things (IoT). Ini menghubungkan 'Twitterverse' ke PI dan LED, tetapi tidak memerlukan pemrograman - semua tugas dilakukan oleh node pra-dibangun di Node-RED yang hanya perlu mengkonfigurasi. Ini benar-benar menunjukkan kekuatan Node-RED saat berjalan pada perangkat sederhana seperti Raspberry PI.

Jadi kesimpulannya. Node-RED adalah (tools) alat pemrograman berbasis flow dengan editor visual yang memungkinkan Anda untuk menyatukan node untuk membuat aliran. Dalam hal ini, 3 node membuat aliran pertama kami. Acara dunia nyata, misalnya tweet dengan tag hash #led, dikonversi menjadi pesan, yang 'flow' di sepanjang kabel di antara node. Node memproses pesan pada input mereka dan, sebagai hasilnya, mengirim pesan pada output mereka ke node berikutnya dalam flow. Dalam contoh sederhana ini, kami mencari tweet dengan tagar #led dan menggunakannya untuk memicu pesan ke simpul Raspberry PI yang menyebabkan IO pin 12 menjadi tinggi selama 1 detik, yang pada gilirannya menyebabkan LED berkedip selama 1 detik .

Contoh ini sebagian besar menunjukkan kepada Anda hal-hal yang dapat kita lakukan dengan Node-RED. Jika Anda ingin bermain-main dengan contoh ini, Anda harus melihat artikel selanjutnya untuk melihat cara mengatur akun dengan FRED (layanan Node-RED berbasis cloud yang kami gunakan) dan cara memulai. Anda dapat menemukan deskripsi simpul-merah dari aliran ini di:

https://raw.githubusercontent.com/SenseTecnic/nrguideflows/master/lesson1/1-1_twitter.json

Contoh 1.2 Menggunakan Node-RED untuk mengingatkan Anda ketika Anda ketinggalan jadwal latihan Anda

Contoh kedua kami menunjukkan penggunaan Node-RED yang berbeda. Alih-alih mengendalikan perangkat seperti Raspberry PI, aliran ini menggabungkan info cuaca dan penggunaan fitbit Anda untuk mengirimi Anda peringatan email saat cuaca baik dan Anda ketinggalan jadwal olahraga Anda. Alurnya sedikit lebih rumit, menggunakan 6 simpul (lihat Gambar 1.2), tetapi sekali lagi, dengan menggunakan simpul bawaan Anda dapat menyelesaikan tugas-tugas kompleks dengan sedikit atau tanpa pemrograman.

Gambar 1.2. Aliran sederhana untuk mengingatkan Anda ketika Anda tidak berolahraga dan cuacanya baik

Seperti sebelumnya, node diseret dari palet node di Node-RED UI dan disatukan bersama di kanvas aliran. Mulai dari simpul paling kiri, mari kita mulai dengan simpul openweather yang dapat Anda konfigurasi untuk memeriksa cuaca untuk kota besar mana pun pada interval yang ditentukan. Ketika memeriksa, ia mengemas hasil dalam pesan yang diteruskan ke node berikutnya, dalam hal ini, ke node switch. Switch node melakukan tes sederhana, memeriksa nilai input pesan dan mengirim pesan dengan nilai "1" jika tes itu benar. Dalam kasus kami, ini telah dikonfigurasi untuk menguji nilai suhu (tempc) untuk melihat apakah suhu 15 derajat celcius atau lebih tinggi.

Ketika saklar beralih ke true, atau 'aktif', ia mengirimkan pesan ke simpul fitbit yang merupakan simpul berikutnya dalam aliran. Node fitbit adalah node bawaan yang kuat yang bisa Anda konfigurasi untuk mendapatkan statistik pada perangkat fitbit Anda dari portal fitbit.com. Node fitbit mengemas statistik untuk perangkat Anda ke dalam pesan dan meneruskannya ke node berikutnya dalam aliran.

Node berikutnya adalah switch lain. Yang ini telah dikonfigurasikan untuk memeriksa apakah jumlah langkah yang Anda lalui hari ini kurang dari 1000. Ini dilakukan dengan menguji untuk melihat apakah bidang data fitbit, summary.steps, kurang dari 1000. Ingat, ia baru saja mendapatkan ini statistik dalam pesan dari simpul fitbit, yang pada gilirannya mendapatkannya dengan melakukan panggilan ke API fitbit di fitbit.com.

Jika Anda telah berjalan kurang dari 1000 langkah hari ini, maka node switch menghasilkan pesan yang diteruskan melalui aliran ke node fungsi. Node fungsi adalah simpul serba guna generik yang memungkinkan Anda untuk menulis logika pemrograman Anda sendiri dalam Javascript. Node ini akan dibahas lebih detail pada kuliah berikutnya. Untuk saat ini Anda dapat mengasumsikan bahwa simpul ini hanya membuat pesan baru dengan baris subjek email dan badan teks yang dapat dikirim melalui email.

Setelah pesan ini dibuat di dalam simpul fungsi, itu dikirim melalui aliran ke simpul akhir yang merupakan simpul email. Node ini akan mengambil isi pesan yang masuk dan mengirimkannya ke akun email yang dikonfigurasi ketika node diinisialisasi. Dalam hal ini, Anda akan mengaturnya untuk mengirim pesan kepada Anda sendiri.

Jadi sekali lagi, aliran yang sangat sederhana yang menggunakan kekuatan node bawaan Node-RED untuk memeriksa cuaca lokal Anda. Dan jika itu cukup hangat dan Anda tidak melakukan banyak berjalan hari ini, itu mengirimkan pengingat email kepada Anda.

Meskipun contohnya terlihat cukup sederhana, hanya memeriksa cuaca dan aktivitas fitbit Anda, Anda dapat menggunakan aliran serupa untuk memeriksa status perangkat rumah, komputer di server server Anda, perangkat di pabrik, dll., Dan kemudian Anda dapat menggunakan node output untuk mengirim email, tweet, melakukan panggilan API ke perangkat lunak back-office, mengontrol perangkat dunia nyata - pada kenyataannya pilihannya tidak terbatas. Node-RED adalah tools alat yang sangat kuat untuk menggabungkan input dan output bersama dan menawarkan banyak node, baik dibangun atau dikembangkan oleh komunitas Node-RED, untuk melakukan berbagai tugas yang luar biasa.

Anda dapat menemukan deskripsi simpul-merah dari aliran ini di:

https://raw.githubusercontent.com/SenseTecnic/nrguideflows/master/lesson1/1-2_weatheralert.json

Contoh 1.3 Membangun layanan web sederhana menggunakan node HTTP bawaan Node-RED

Contoh terakhir kami dalam pengantar tingkat tinggi ini adalah kelas fow lain. Ini menunjukkan cara membuat layanan web sederhana yang merespons browser yang mengirim permintaan HTTP dengan menanyakan beberapa data dunia nyata, dan kemudian memberikan halaman web dengan representasi grafis dari data itu kembali ke browser - pada dasarnya Node-RED sedang digunakan untuk menyediakan server web dan layanan sederhana semua dengan beberapa node.

Tetap menggunakan simpul fitbit yang diperkenalkan pada contoh sebelumnya, dan contoh ini menciptakan layanan web sederhana yang memungkinkan Anda untuk menanyakan statistik fitbit Anda untuk hari itu dan, menggunakan bagan donat yang bagus, menampilkan berapa banyak kalori yang telah Anda 'bakar' melalui olahraga.

Alur ditunjukkan pada Gambar 1.3 dan terdiri dari 4 node. Node pertama dan terakhir adalah input http dan node output yang bekerja bersama untuk mendengarkan permintaan HTTP dan mengirim respons HTTP. Alur ini mendengarkan permintaan HTTP dari sumber apa pun, tetapi mari kita asumsikan peramban biasa di sini. Ketika tiba, ia menanyakan statistik fitbit Anda dari fitbit.com, kemudian menggunakan templat node untuk membangun halaman HTTP, dan meneruskannya ke node output http yang mengirimkan kembali halaman web ke browser.

Gambar 1.3 Contoh server web sederhana untuk membuat grafik data fitbit

Sekali lagi, ini hanya untuk memberi Anda rasa tentang kekuatan dan fleksibilitas Node-RED tanpa masuk ke semua detail tentang bagaimana aliran ini bekerja. Anda akan mengetahui lebih banyak tentang itu di kuliah nanti. Pada level tinggi, simpul input http telah dikonfigurasi untuk mendengarkan permintaan HTTP pada URL, yang merupakan kombinasi dari layanan hosting yang digunakan dalam kuliah ini ditambah nama login Anda {username} dan string / fitbit. Ini akan dijelaskan secara lebih rinci dalam kuliah dua.

Ketika permintaan HTTP masuk, simpul input http membuat pesan untuk memicu simpul fitbit, yang merupakan simpul berikutnya dalam aliran. Node fitbit mendapatkan statistik saat ini untuk pengguna, dan kemudian meneruskan statistik tersebut, sebagai pesan, ke node templat. Node templat html adalah simpul pra-bangun lain di Node-RED, yang, seperti simpul fungsi, memungkinkan Anda membuat kode arbitrer. Namun, alih-alih menggunakan JavaScript seperti simpul fungsi, simpul templat bekerja dengan teks seperti HTML.

Kode HTML di node templat ditunjukkan pada Listing 1.1, sehingga Anda dapat melihat apa yang terjadi. Namun, Anda tidak perlu memeriksanya secara terperinci jika Anda tidak mau. Pada dasarnya, node templat mengambil data konsumsi kalori dari fitbit dan, menggunakan perpustakaan grafik pihak ketiga, membuat file HTML sederhana yang akan memberi tahu browser penerima untuk menggunakan perpustakaan grafik pihak ke-3 untuk menampilkan grafik donat konsumsi kalori.

Listing 1.1 Template HTML sederhana untuk menampilkan bagan donat penggunaan kalori

<!doctype html>
<head>
<title>A Node RED Example</title>
<link rel=”stylesheet” href=”//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css”>
<script src=”//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js”></script>
<script src=”//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js”></script>
<script src=”//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js”></script>
</head>
<html>
<div id=”chart-example” style=”height: 250px;”></div>
<script>
Morris.Donut({
element: ‘chart-example’,
data: [
{label: “Activity Calories”, value: {{payload.summary.activityCalories}} },
{label: “Calories BMR”, value: {{payload.summary.caloriesBMR}} },
{label: “Calories Out”, value: {{payload.summary.caloriesOut}} }
]
});
</script>
</html>

Setelah simpul templat telah menghasilkan file HTML, ia meneruskannya sebagai pesan ke simpul final, yang merupakan simpul respons http. Node ini mengemas HTML sebagai respons HTTP yang dikirim kembali ke browser.

Pengguna kemudian akan melihat bagan donat sederhana dari penggunaan kalori mereka untuk hari itu (lihat Gambar 1.4) - semua dibuat dan dilayani oleh aliran Node-RED sederhana!

Gambar 1.4 Grafik donat, disajikan oleh Node-RED yang menunjukkan jumlah kalori dari fitbit

Anda dapat menemukan deskripsi simpul-merah dari aliran ini di:

https://raw.githubusercontent.com/SenseTecnic/nrguideflows/master/lesson1/1-3_webservice.json

Sejarah Node-RED

Seperti yang ditunjukkan contoh di bagian sebelumnya, Node-RED adalah (tools) alat yang ampuh untuk membangun aplikasi dan layanan IoT. Asal-usulnya dipicu oleh kebutuhan untuk membuat prototipe aplikasi IoT dengan cepat dan Node-RED dibuat sebagai proyek open sourcea oleh kelompok IBM Emerging Technologies, khususnya oleh dua peneliti, Nick O'Leary dan Dave Conway-Jones. Mereka menciptakan Node-RED pada awalnya sebagai alat untuk diri mereka sendiri ketika mereka sedang mengerjakan proyek-proyek IoT dan “mencari cara untuk menyederhanakan proses menghubungkan sistem dan sensor ketika membangun teknologi pembuktian konsep untuk pelanggan.”

Versi awal Node-RED dirilis sebagai proyek open soure pada akhir 2013 dan membangun kelompok pengguna dan pengembang yang kecil namun aktif selama 2014. Pada saat penulisan, Node-RED masih merupakan teknologi yang muncul, tetapi telah melihat adopsi signifikan oleh pembuat, eksperimentalis dan sejumlah perusahaan besar dan kecil bereksperimen dengan menggunakannya untuk kebutuhan mereka.

Saat ini ada komunitas pengguna dan pengembang yang dinamis, dengan kelompok inti bekerja pada kode Node-RED itu sendiri dan sebagian besar pengembang berkontribusi node atau aliran ke perpustakaan aliran. Anda dapat memeriksa milis dan repositori github menggunakan tautan yang disediakan di Lampiran A atau hanya google mereka.

Karena Node-RED masih merupakan teknologi yang berkembang pesat, perlu diketahui bahwa hal-hal dapat berubah dengan cepat. Kuliah-kuliah ini ditulis terhadap pelepasan Node-RED 0.11.0 dan contoh-contohnya akan diperbarui ketika Node-RED berevolusi. Namun, selalu bijaksana, seperti halnya teknologi baru, untuk memeriksa kompatibilitas jika semuanya tidak berjalan seperti yang Anda harapkan.

Node-RED dan IOT

Ketika orang-orang IBM membuat Node-RED, mereka kebanyakan berfokus pada Internet of Things, yaitu menghubungkan perangkat ke pemrosesan dan pemrosesan ke perangkat. Sebagai alat untuk pengembangan aplikasi yang cepat untuk IoT, Node-RED sangat kuat dan fleksibel. Kekuatannya berasal dari kombinasi dua faktor:

Node-RED adalah contoh model pemrograman berbasis flown - pesan yang mewakili peristiwa mengalir antara node, memicu pemrosesan yang menghasilkan output. Model pemrograman berbasis aliran memetakan dengan baik untuk aplikasi IOT khas yang ditandai dengan peristiwa dunia nyata yang memicu semacam pemrosesan yang pada gilirannya menghasilkan tindakan dunia nyata. Node-RED mengemas kejadian ini sebagai pesan yang menawarkan model yang sederhana dan seragam untuk acara saat mereka mengalir di antara node yang membentuk arus.

Himpunan node bawaan adalah bagian kedua dari cerita Node-RED. Dengan membangun satu set input dan output node yang kuat, yang masing-masing menyembunyikan banyak kerumitan berinteraksi dengan dunia nyata, Node-RED menawarkan pengembang blok bangunan yang kuat untuk memungkinkan mereka dengan cepat menyatukan aliran yang menghasilkan banyak hal, tanpa harus khawatir tentang detail pemrograman.

Dua faktor ini menjadikan Node-RED alat yang ampuh untuk pengembangan aplikasi IoT. Ketika dikombinasikan dengan fleksibilitas untuk membuat dan menggunakan node seperti node fungsi, yang memungkinkan pengembang untuk dengan cepat menulis JavaScript sewenang-wenang, ditambah komunitas Node-RED, yang terus-menerus membuat dan berbagi node baru, Node-RED cenderung menjadi satu dari alat utama dalam kotak alat pengembang IOT.

Namun, Node-RED tidak selalu merupakan alat terbaik untuk pengembangan aplikasi IoT. Meskipun kuat dan fleksibel, itu tidak selalu merupakan solusi yang tepat. Beberapa situasi di mana Node-RED mungkin bukan pilihan pertama termasuk:

Aplikasi IoT multi-fungsi yang kompleks. Node-RED unggul pada pengembangan aplikasi yang cepat dan bertindak sebagai perekat untuk menghubungkan acara dengan tindakan, atau sensor ke aktuator, jika Anda suka. Namun, ketika aplikasi mendapatkan di atas ukuran tertentu, menjadi rumit untuk secara visual memprogram dan mengelola melalui Node-RED. Ada beberapa fitur untuk membantu ini, misalnya sub-aliran (lihat kuliah 5), tetapi akhirnya UI menjadi hambatan.

Pemrograman berbasisflow adalah model pemrograman yang tidak selalu paling cocok untuk pengembangan aplikasi. Dalam banyak cara yang sama bahwa bahasa pemrograman tertentu unggul di beberapa tugas tetapi tidak yang lain, pemrograman berbasis flow memiliki kelemahan. Contoh yang baik adalah loop: Node-RED rumit ketika menangani loop.

Kasus penggunaan khusus. Pemrograman berbasis aliran adalah model tujuan umum dan tidak ditargetkan atau dioptimalkan untuk kebutuhan spesifik, misalnya pengembangan Data Analytics atau User Interface. Saat ini Node-RED tidak memiliki dukungan khusus untuk jenis aplikasi ini dan tidak ada cara mudah untuk menambahkan dukungan tersebut. Jelas, karena teknologi yang mendasari Node-RED adalah JavaScript, Anda dapat memanfaatkan kemampuannya untuk kebutuhan ini. Jika ingin menggunakan Node-RED untuk membuat prototipe sesuatu, satu pendekatan adalah dengan mengimplementasikan bagian atau semua aplikasi Anda dalam bahasa lain yang lebih cocok untuk tugas Anda dan menggunakan Node-RED untuk kontrol keseluruhan.

Karena itu, seperti yang telah ditunjukkan dalam kuliah ini dan akan ditunjukkan dalam kuliah berikut, Node-RED adalah alat yang ampuh untuk sejumlah besar aplikasi IoT. Seiring berevolusi, ia akan menjadi lebih canggih dan lebih bermanfaat dalam berbagai situasi.

Mungkin sama pentingnya, ketika Anda menjelajahi Node-RED dalam kuliah-kuliah berikutnya, Anda akan menyadari bahwa meskipun akar Node-RED ada di IoT, itu adalah alat yang dapat digunakan untuk membangun berbagai aplikasi, bukan hanya aplikasi IoT. Bahkan, dalam kuliah ini Anda akan melihat contoh Node-RED yang digunakan untuk aplikasi web, aplikasi media sosial, integrasi back-office, manajemen tugas TI, yaitu melintasi berbagai tugas komputasi modern.

Harapan kami adalah bahwa pada akhir kuliah ini, Anda akan melihat Node-RED, seperti yang kita lakukan, sebagai alat yang fleksibel dan kuat yang dapat digunakan dalam banyak situasi, baik untuk prototipe tetapi juga untuk pengembangan tingkat produksi.

Ringkasan

Dalam artikel ini Anda telah melihat bagaimana kabel Node-RED bersama-sama membangun blok, menggunakan alat visual untuk secara cepat membuat aliran sederhana yang benar-benar melakukan tugas dunia nyata yang canggih. Anda juga telah belajar sedikit tentang asal-usul Node-RED sebagai alat pengembangan aplikasi yang cepat untuk IoT dan bagaimana, karena telah berkembang, sekarang digunakan untuk berbagai tugas, bukan hanya pemrograman IoT. Akhirnya, kami telah membahas batasan Node-RED dan mengindikasikan beberapa area di mana bahasa dan alat lain dapat melayani Anda dengan lebih baik. Dalam kuliah berikutnya, kita akan mulai pada beberapa pemrograman nyata dan menunjukkan kepada Anda bagaimana membangun aliran Anda sendiri menggunakan node dasar yang disediakan Node-RED.

iotqu - Membangun Server Web menggunakan ESP8266

Tutorial ini adalah panduan langkah demi langkah yang menunjukkan kepada Anda bagaimana membangun Server Web ESP8266 secara mandiri yang mengontrol dua output (berupa dua LED). Server Web ESP8266 ini responsif dalam seluler dan dapat diakses dengan perangkat apa pun yang sebagai browser di jaringan lokal Anda.

Tutorial ini mencakup dua metode berbeda untuk membangun server web:

Bagian 1: Buat Server Web Menggunakan Arduino IDE
Bagian 2: Buat Server Web Menggunakan NodeMCU

BAGIAN 1: BUAT SERVER WEB MENGGUNAKAN ARDUINO IDE

Bagian ini menunjukkan kepada Anda cara membuat server web untuk mengontrol dua output menggunakan Arduino IDE. Anda dapat menggunakan metode ini untuk membuat server web yang berbeda untuk memenuhi kebutuhan Anda.

Mempersiapkan software Arduino IDE

Unduh dan instal software Arduino IDE pada sistem operasi Anda.
Kemudian, Anda perlu menginstal board ESP8266 untuk IDE Arduino. Untuk itu, buka File > Preferensi.
Masukkan http://arduino.esp8266.com/stable/package_esp8266com_index.json ke dalam bidang "Additional Board Manager URLs" seperti yang ditunjukkan pada gambar di bawah ini. Kemudian, klik tombol "OK".

4. Buka Tools > Board > Boards Manager ...

5. Gulir ke bawah, pilih menu board ESP8266 dan instal "platform esp8266", seperti yang ditunjukkan pada gambar di bawah ini.

6. Buka Tools > Board dan pilih board ESP8266 Anda. Kemudian, buka kembali IDE Arduino Anda.

Kode

Salin kode di bawah ini ke IDE Arduino Anda, tetapi jangan mengunggahnya. Anda perlu membuat beberapa perubahan untuk membuatnya bekerja untuk Anda. Anda perlu memodifikasi dua variabel berikut dengan kredensial jaringan Anda, sehingga ESP8266 Anda dapat membuat koneksi dengan router Anda.

// Load Wi-Fi library
#include <ESP8266WiFi.h>
// Replace with your network credentials
const char* ssid     = "REPLACE_WITH_YOUR_SSID";
const char* password = "REPLACE_WITH_YOUR_PASSWORD";
// Set web server port number to 80
WiFiServer server(80);
// Variable to store the HTTP request
String header;
// Auxiliar variables to store the current output state
String output5State = "off";
String output4State = "off";
// Assign output variables to GPIO pins
const int output5 = 5;
const int output4 = 4;
void setup() {
  Serial.begin(115200);
  // Initialize the output variables as outputs
  pinMode(output5, OUTPUT);
  pinMode(output4, OUTPUT);
  // Set outputs to LOW
  digitalWrite(output5, LOW);
  digitalWrite(output4, LOW);

  // Connect to Wi-Fi network with SSID and password
  Serial.print("Connecting to ");
  Serial.println(ssid);
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  // Print local IP address and start web server
  Serial.println("");
  Serial.println("WiFi connected.");
  Serial.println("IP address: ");
  Serial.println(WiFi.localIP());
  server.begin();
}
void loop(){
  WiFiClient client = server.available();   // Listen for incoming clients

  if (client) {                             // If a new client connects,
    Serial.println("New Client.");          // print a message out in the serial port
    String currentLine = "";                // make a String to hold incoming data from the client
    while (client.connected()) {            // loop while the client's connected
      if (client.available()) {             // if there's bytes to read from the client,
        char c = client.read();             // read a byte, then
        Serial.write(c);                    // print it out the serial monitor
        header += c;
        if (c == '\n') {                    // if the byte is a newline character
          // if the current line is blank, you got two newline characters in a row.
          // that's the end of the client HTTP request, so send a response:
          if (currentLine.length() == 0) {
            // HTTP headers always start with a response code (e.g. HTTP/1.1 200 OK)
            // and a content-type so the client knows what's coming, then a blank line:
            client.println("HTTP/1.1 200 OK");
            client.println("Content-type:text/html");
            client.println("Connection: close");
            client.println();
            
            // turns the GPIOs on and off
            if (header.indexOf("GET /5/on") >= 0) {
              Serial.println("GPIO 5 on");
              output5State = "on";
              digitalWrite(output5, HIGH);
            } else if (header.indexOf("GET /5/off") >= 0) {
              Serial.println("GPIO 5 off");
              output5State = "off";
              digitalWrite(output5, LOW);
            } else if (header.indexOf("GET /4/on") >= 0) {
              Serial.println("GPIO 4 on");
              output4State = "on";
              digitalWrite(output4, HIGH);
            } else if (header.indexOf("GET /4/off") >= 0) {
              Serial.println("GPIO 4 off");
              output4State = "off";
              digitalWrite(output4, LOW);
            }
            
            // Display the HTML web page
            client.println("<!DOCTYPE html><html>");
            client.println("<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">");
            client.println("<link rel=\"icon\" href=\"data:,\">");
            // CSS to style the on/off buttons 
            // Feel free to change the background-color and font-size attributes to fit your preferences
            client.println("<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}");
            client.println(".button { background-color: #195B6A; border: none; color: white; padding: 16px 40px;");
            client.println("text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer;}");
            client.println(".button2 {background-color: #77878A;}</style></head>");
            
            // Web Page Heading
            client.println("<body><h1>ESP8266 Web Server</h1>");
            
            // Display current state, and ON/OFF buttons for GPIO 5  
            client.println("<p>GPIO 5 - State " + output5State + "</p>");
            // If the output5State is off, it displays the ON button       
            if (output5State=="off") {
              client.println("<p><a href=\"/5/on\"><button class=\"button\">ON</button></a></p>");
            } else {
              client.println("<p><a href=\"/5/off\"><button class=\"button button2\">OFF</button></a></p>");
            } 
               
            // Display current state, and ON/OFF buttons for GPIO 4  
            client.println("<p>GPIO 4 - State " + output4State + "</p>");
            // If the output4State is off, it displays the ON button       
            if (output4State=="off") {
              client.println("<p><a href=\"/4/on\"><button class=\"button\">ON</button></a></p>");
            } else {
              client.println("<p><a href=\"/4/off\"><button class=\"button button2\">OFF</button></a></p>");
            }
            client.println("</body></html>");
            
            // The HTTP response ends with another blank line
            client.println();
            // Break out of the while loop
            break;
          } else { // if you got a newline, then clear currentLine
            currentLine = "";
          }
        } else if (c != '\r') {  // if you got anything else but a carriage return character,
          currentLine += c;      // add it to the end of the currentLine
        }
      }
    }
    // Clear the header variable
    header = "";
    // Close the connection
    client.stop();
    Serial.println("Client disconnected.");
    Serial.println("");
  }
}

Mengunggah Sketsa

1. Mengunggah Sketsa ke ESP-12E

Jika Anda menggunakan Kit NodeMCU ESP-12E, mengunggah sketsa itu sangat sederhana, karena ia memiliki pemrogram bawaan. Tancapkan papan Anda ke komputer Anda. Pastikan Anda memiliki papan yang tepat dan port COM yang dipilih.

Kemudian, klik "Tombol upload" di Arduino IDE dan tunggu beberapa detik hingga Anda melihat pesan "Selesai mengunggah." Di sudut kiri bawah.

2.Mengunggah Sketsa ke ESP-01

Mengunggah kode ke ESP-01 membutuhkan komunikasi serial antara ESP8266 Anda dan Programmer FTDI seperti yang ditunjukkan pada diagram skematik di bawah ini.

Tabel berikut menunjukkan koneksi yang perlu Anda buat antara ESP8266 dan programmer FTDI.

Jika Anda memiliki Programmer FTDI yang benar-benar baru dan Anda perlu menginstal driver FTDI di PC Windows, kunjungi situs web ini untuk driver resmi . Atau, Anda dapat menghubungi

penjual yang menjual Anda Programmer FTDI.

Kemudian, Anda hanya perlu menghubungkan programmer FTDI ke komputer Anda, dan mengunggah kodenya ke ESP8266.

Skema

Untuk membangun sirkuit Anda membutuhkan bagian-bagian berikut:

NodeMCU ESP8266 12-E
2 x LED
2 x Resistor (220 atau 330 ohm)
Breadboard
Kabel pelompat

Hubungkan dua LED ke ESP8266 Anda seperti yang ditunjukkan dalam diagram skematik berikut - dengan satu LED yang terhubung ke GPIO 4, dan satu lagi ke GPIO 5.

Jika Anda menggunakan ESP8266-01, gunakan diagram skematik berikut sebagai referensi, tetapi Anda perlu mengubah tugas GPIO dalam kode (ke GPIO 2 dan GPIO 0).

Menguji Server Web

Sekarang, Anda dapat mengunggah kodenya, dan itu akan langsung berfungsi. Jangan lupa untuk memeriksa apakah Anda memiliki papan yang tepat dan port COM yang dipilih, jika tidak Anda akan mendapatkan kesalahan ketika mencoba mengunggah. Buka Monitor Seri dengan kecepatan baud 115200.

Alamat IP ESP

Tekan tombol RESP ESP8266, dan itu akan menampilkan alamat IP ESP pada serial monitor

Salin alamat IP itu, karena Anda memerlukannya untuk mengakses server web.

Mengakses Server Web

Buka browser Anda, ketik alamat IP ESP, dan Anda akan melihat halaman berikut. Halaman ini dikirim oleh ESP8266 ketika Anda membuat permintaan pada alamat IP ESP.

Jika melihat serial monitor, Anda dapat melihat apa yang terjadi di latar belakang. ESP menerima permintaan HTTP dari klien baru - dalam hal ini, browser Anda. Anda juga dapat melihat informasi lain tentang permintaan HTTP - bidang ini disebut bidang header HTTP, dan mereka menentukan parameter operasi transaksi HTTP.