[2019鐵人賽] - 6.筆記IoT初練習-利用REPL模式來開發！

今天要來簡介REPL怎麼用在Arduino上～ ٩(｡・ω・｡)و 

首先要來介紹REPL是什麼？

REPL 全名為「Read-Eval-Print Loop」讀取-求值-輸出 循環，是一種簡單的交互式的編輯環境 ；用戶輸入事件、表達式或是運算式，再由電腦進行處理運算，接著輸出給用戶，如此循環下去。

REPL很常見在前端開發者開發環境中，像瀏覽器的開發者工具的Console、使用終端機Terminal開啟Node，這些都是REPL～

例如以下：
→ Chrome中，開發者模式的Console drawer

→ 使用Terminal開啟Node JS的REPL模式

所以我們可以很方便的使用JavaScript在這些工具上debug或者開發等動作ヽ(・×・´)ゞ

那進入正題～
Johnny-five也提供了REPL的API，說明要怎麼在Arduino上調用REPL

Component Classes-Board #REPL: http://johnny-five.io/api/board/#repl


我們要使用Johnny-five提供的REPL範例來示範Arduino會怎樣動作～(๑•̀ㅂ•́)و✧
程式碼如下

var five = require("johnny-five"); var board = new five.Board(); board.on("ready", function() { console.log("Ready event. Repl instance auto-initialized!"); var led = new five.Led(13); this.repl.inject({ // 寫在這邊的函式可以透過REPL來操控 // 範例為操控LED的亮(on)與滅(off)
on: function() { led.on(); }, off: function() { led.off(); } }); });

Examples-Board-REPL: http://johnny-five.io/examples/repl/

當板子on ready後，REPL初始化也隨之啟動
範例中第9行呼叫了J5內建的方法 repl.inject 在大誇號裡面可以自訂函式，可以看到範例中有簡單的LED亮和滅的功能 ～


我在範例中增加上一篇的介紹的blink功能來實際操作給大家看( • ̀ω•́ )

首先執行範例檔repl.js在terminal輸入 node repl.js 電腦便會透過傳輸線上傳程式到Arduino上。
→ terminal輸入 node repl.js

可以看到執行Node JS後電腦開始找連接阜，連接上Arduino開發版之後執行REPL模式，
Connected狀態後，REPL會隨之初始化～
接下來我們試著操控LED燈即時的亮、滅、閃爍，在REPL模式中分別執行function on()、off()、blink() 來看實作結果！

→REPL模式下呼叫函式 on();

→REPL模式下呼叫函式 off();

→REPL模式下呼叫函式 blink();

很方便吧～ヽ(・×・´)ゞ

這就是Johnny-five提供REPL的方法，
「讀取函式→運算資料→輸出到Arduino運行結果→再繼續等待下一個循環動作」
讓我們可以簡易的查看實現的結果～ d(`･∀･)b

本文到這邊先下台一鞠躬了～
有錯敬請留言改正，感謝您的閱讀 <(_ _)>

[2019鐵人賽] - 5.筆記IoT初練習-用JavaScript控制Arduino吧！－ 實作篇

接下來就要實作程式部分囉！ヽ(・×・´)ゞ

本篇文章續上篇
「 [2019鐵人賽] - 4.筆記IoT初練習-用JavaScript控制Arduino吧！— 安裝環境篇 」

有如學習程式一切的開始「Hello World」～
Arduino的第一個程式「Blink」閃耀你的LED吧！XD

Step 3.  Coding....(ง๑ •̀_•́)ง

程式碼如下：

var five = require("johnny-five");
//引入johnny-five
var board = new five.Board(); //宣告Arduino開發版
board.on("ready", function() { //當Arduino開發版ready好，做以下動作
var led = new five.Led(13); //宣告led在開發版第13腳

led.blink(500);
//每500毫秒 LED會亮→滅→亮→滅...持續的閃爍 });

解說一下上面做了哪些事情～

首先 var board = new five.Board(); 這行

一開始要先調用J5的 Board();
告訴電腦USB連接到初始化實體的Arduino板子，
依照官網所說不用特別設定通訊埠，雖然官網是這樣說.....

但本魯一開始就是遇到沒有設定通訊埠而報的錯 ╮(╯_╰)╭

Component Classes-Board: http://johnny-five.io/api/board/

所以還是加一下好了........(´-ι_-｀)

-----
var board = new five.Board({
port:"目前Arduino和電腦連接的Port",
});
-----

※如何知道Arduino連到哪一個通訊埠？

Win的使用者可以透過裝置管理員查看
Mac的使用這需要輸入指令 $ ls /dev/tty.*

查看Arduino連接的是哪一個port

Johnny-Five (簡稱J5) 的寫法沒有什麼特別不同的地方，可以看到第七行

board.on("ready", function() {
    //執行的內容
});

語法上平時有在寫JS的朋友們應該都蠻熟悉的～ヽ(・×・´)ゞ

第10行 利用J5的 led()函式

宣告板子第13隻腳為輸出腳位，當有動作時會輸出5V電壓

第13行 剛剛宣告的LED 利用內建的閃爍函式blink();

其動作為LED on-off 這樣算一次動作，在括號裡面填寫毫秒數，在毫秒內會做完一次的動作。

範例中的blink(500);的意思就是

500毫秒會做完一次的 LED on-off 的動作，然後重複動作。

大致上的程式的動作差不多是這樣啦～（有錯請訂正 (つд⊂)

以電子角度來講

new five.Led(13); 就代表板子輸出電壓的腳位是第13腳 blink(); 

這個函式其實就是電壓不斷的一直變化 5V→0V→5V→0V→5V 一直循環下去～

Step 4. NodeJS GO!!

程式寫好之後，開啟終端機到該目錄底下輸入 node 檔名.js

就是這麼簡單！ʅ（´◔౪◔）ʃ

電腦便會連接上你的Arduino板子，並開始動作
現在應該可以看到板子上的LED燈一閃一閃的吧！d(`･∀･)b

恭喜你用JavaScript統一軟體世界了ヽ(́◕◞౪◟◕‵)ﾉ 

本文到這邊先下台一鞠躬了，有錯敬請留言改正，感謝您的閱讀啦～<(_ _)>

[2019鐵人賽] - 4.筆記IoT初練習-用JavaScript控制Arduino吧！－ 環境篇

用JavaScript將統一世界！！（欸欸....不是吧XD

上一篇我們利用Aruduino的原生語言來測試版子是否正常，以及小小燒錄範例程式等～

讓大家了解熟悉並操作一下Arduino的環境 ٩(｡・ω・｡)و

魯宅我雖然有大學的時候有上過C語言的課程，但現在幾乎都忘光光了.....

但出社會轉職後現在上班都在寫JavaScript，哪有沒有辦法用JavaScript寫iOT呢？

在我心裡是存在這樣的疑惑的....

經過了一番搜尋後答案是，可以的！ ｡:.ﾟヽ(*´∀`)ﾉﾟ.:｡灑花

就讓我們看看要怎麼用JavaScript來一統世界軟硬體吧XD

這邊要準備的環境有

硬體部分

> Arduino Uno 一片

> USB TypeB 線材一條

> LED燈 隨便來一顆（也可以不用，用內建的LED也可以）

硬體部分和上篇是一樣的～

軟體環境部分

> Node.JS (穩定版即可)
> Arduino Web Editor
> npm johnny-five

準備好之後Let's go！( • ̀ω•́ )
先來看一下成功的結果

執行NodeJS來控制Aruduino

Step 1. 燒錄Firmata協定

Firmata 協定是軟體和硬體溝通的橋樑，你可以用各種程式語言讓 Arduino 和 host computer 溝通藉由控制腳位等等
官方介紹原文在此

>The Firmata library implements the Firmata protocol for communicating with software on the host computer. This allows you to write custom firmware without having to create your own protocol and objects for the programming environment that you are using.

Arduino Firmata Library- https://www.arduino.cc/en/reference/firmata

依照上一篇  Step 4.  電腦USB接上 Arduino 後，開啟 Arduino Web Editor，最左邊 Meun列選擇
 [ Libraries → Search Libraries 中輸入" firmata " → 找到 Firmata 如圖所示下拉選擇最新版本 → 直接燒錄進 Arduino 即可 ]

→ 圖解說明 (ง๑ •̀_•́)ง

→ 燒錄 Firmata 等待幾秒～  ( ´Д`)y━･~~

→ 燒錄 Firmata 成功的樣子 ヽ(・×・´)ゞ

Step 2. 安裝 johnny-five 套件

創新專案並且安裝 johnny-five 套件用 JavaScript 來控制 Arduino ，步驟如下：

1. 創建 package.json 
開啟終端機，到專案資料夾路徑下輸入指令 npm init 接著會出現要你填寫初始專案的相關資訊，想略過的話也可以一直按enter就好，這邊不多解釋了～
創立完後會產生package.json這隻檔案，主要的功能是用來掌控專案資訊等等的....

→ 輸入指令 npm init

 → 輸入專案資訊，確認無誤輸入 yes

2. NPM Install johnny-five 
創建好package.json後，我們就可以來安裝最主要的johnny-five了！
輸入指令 npm install johnny-five --save 按下enter，開始安裝吧～ ლ(́◕◞౪◟◕‵ლ)

 → 輸入指令 npm install johnny-five --save

→ 安裝好johnny-five 會長這樣～(❛◡❛✿)

完成！ε٩(๑> ₃ <)۶з
這時候資料夾結構應該會像這樣↓↓↓

環境的安裝是搞比較久一點也比較無聊....
但只要弄好這邊後面就可以來好好的玩啦～(๑•̀ω•́)ノ

J5真的造福了我們這些新手開發者來進入物連網的世界！
但是有一些硬體方面的東西可能對不是本科系的人來說會比較難理解....
我們就繼續慢慢看下去吧～

下篇繼續要用JavaScript來寫程式囉～

本文到這邊先下台一鞠躬了，有錯敬請留言改正，感謝您的閱讀啦～<(_ _)>