ควบคุม LED ด้วย ESP8266 ผ่าน NETPIE Freeboard

      หลังจากเมื่อบทความที่แล้วที่ได้พูดถึงการใช้ NETPIE.io และทดสอบการเชื่อมต่อกับ ESP8266 แล้ว ในบทความนี้เราจะมาลองนำไปใช้จริงกันบ้างด้วยการใช้ NETPIE Freeboard ควบคุมหลอดไฟ LED ที่เชื่่อมกับ ESP8266

       โดยปกติแล้ว คนส่วนใหญ่ที่ทำโปรเจค IoT จะคุ้นเคยกับการใช้ HTML5 Microgear Library เพื่อควบคุมหรือออกคำสั่งให้กับอุปกรณ์ IoT แต่วันนี้เราจะมาใช้ NETPIE Freeboard กันแทน
        Freeboard คือ Web Application ที่ให้เราสร้างเป็น Dash Board เพื่อใช้สำหรับ IoT ซึ่งเปรียบเสมือนกับกระดานสำหรับแสดงผลหรือออกคำสั่ง IoT ของเราโดยเฉพาะเลย ภายใน NETPIE Freeboard จะสามารถลาก, จับ, วางวัตถุเช่น ปุ่มหรือกราฟได้เลย ซึ่งงานกว่า HTML5 ที่ต้องเขียนโค้ดขึ้นมาเอง

         งั้นเริ่มกันเลยดีกว่า....

ขั้นที่ 1 เตรียมความพร้อมฝั่งอุปกรณ์ (Hardware)
       
           อุปกรณ์ที่เราจะใช้คือ

1. ESP8266 ซึ่งในตัวอย่างนี้ผมจะใช้ Espresso Lite v2.0 ของ Espert 
   
2. Breadboard (Protoboard) 
   
3. FTDI สำหรับอัพโหลดโค้ด ในตัวอย่างผมจะใช้ FT232 
   
4. LED            

ให้เราทำการต่อ LED โดยขาขั้วบวก(ขายาว)กับ Digital PIN และต่อขั้วลบ(ขาสั้น)เข้ากับ GRN PIN (ขา Ground) ดังภาพ 

และนี้คือโค้ดสำหรับ ESP8266 นะครับ
(Update URL Date: 02 Feb 2022)
https://drive.google.com/file/d/0BwEHsMXKRHHlUHBDbDZWWGxKeUk/view?usp=sharing&resourcekey=0-hGgsjZI0ZvOveXVrLTu9UA

หลังจากนั้นเราก็สร้าง Application ID ใน NETPIE.io และนำค่าต่างๆใส่เข้าไปในโค้ดทั้ง AppID, Key, Secret, Alias
(สำหรับใครที่ยังสร้าง AppID, Key, Secret ไม่เป็น ให้มาอ่านที่ตรงนี้ได้ครับ http://kongrawi.blogspot.com/2016/07/netpieio-esp8266.html )

APP ID

Alias, Key, Secret ตามลำดับ

แล้วนำโค้ดนี้เอาอัพโหลดใน ESP8266 (อย่าลืมเปลี่ยน SSID กับ Password ด้วยนะครับ)

เมื่ออัพโหลดเสร็จให้ลองดูที่ Serial Monitor (Ctrl+Shift+M)

ถ้าหากเชื่อมกับ NETPIE สำเร็จจะขึ้นแบบนี้ครับ

ขั้นที่ 2 เตรียมความพร้อมฝั่ง NETPIE Freeboard

เริ่มแรกให้เราดาวน์โหลด NETPIE Freeboard ที่เว็บนี้ https://github.com/netpieio/netpie-freeboard

          ซึ่งหลังจากแตกไฟล์แล้วจะเจอไฟล์ต่างๆจำนวนมากทั้ง HTML และ JavaScript ที่ทางทีมพัฒนา NETPIE ได้ทำไว้ให้แล้ว

          ตัว NETPIE Freeboard นั้นเป็น Web Application ซึ่งสามารถเปิดได้ด้วย Web Browser (IE, Google Chrome, Firefox) ให้เราเปิดไฟล์ index.html จะเจอหน้าดังภาพ

          หลังจากเราเปิด NETPIE Freeboard ขึ้นมา ซึ่งก่อนที่เราจะลงมือทำมารู้จัก Data Source ก่อนดีกว่าครับ
          NETPIE Freeboard เป็นหน้าเว็บที่ไว้แสดงข้อมูลๆต่างๆ ซึ่งตัวอุปกรณ์ (Thing) ภายใน App ID เดียวกันจะมีการส่งข้อมูลสื่อสารกันด้วยการ chat เช่น ค่าอุณหภูมิหรือค่าความชื้น รวมไปถึงก็กดปุ่มออกคำสั่งต่างๆ โดยตัว Freeboard ทำหน้าที่เป็น Thing ตัวหนึ่งเช่นกันเพื่อไว้สื่อสารกับอุปกรณ์อื่นๆหรือรับข้อมูลมาจาก Things อื่นๆด้วยเช่นกัน เพราะงั้นจึงต้องมี Data Source เพื่อเป็นตัวกลางในการรับส่งข้อมูล
          ตัว NETPIE Freeboard เองมี NETPIE Microgear เป็น Data Source ซึ่งที่จริงแล้ว Data Source นั้นมีหลากหลายประเภทให้เราเลือกใช้เช่น JSON, Payback, Clock เป็นต้น
          ในตัวอย่างนี้ผมจะทำด้วย NETPIE Microgear นะครับ
เริ่มสร้าง Data Source
           ให้เรากดปุ่ม ADD ที่ด้านบนขวาในส่วนของ Data Source

            เลือก Type เป็น NETPIE Microgear

            จากนั้นให้เราใส่ข้อมูลต่างๆลง

            ซึ่งในส่วนของ Device Alias และ Microgear Reference นั้นก็เปรียบเสมือนตัวแทนของแต่ละอุปกรณ์ซึ่งจะเป็นชื่อที่เราไว้ติดต่อกันระหว่าง Things ซึ่ง Device Alias เป็นตัวแทนของ Freeboard ที่มีอ้างอิงตอนรับข้อความจาก ESP8266 และ Microgear Reference ก็เป็นตัวแทนของ Freeboard ในการส่งข้อความไปหา ESP8266 ครับ

             จากนั้้นก็กด Save ครับ

            แล้วเราก็ไปเพิ่มค่าให้ในโค้ดของ Arduino IDE ด้วยนะครับ

ขั้นที่ 3 สร้างปุ่มใน panel
            ตอนนี้เราก็มี Thing 2 แล้วนะครับที่ AppID เดียวกันนั้นคือ NETPIE Freeboard และ ESP8266 ซึ่งตอนนี้ NETPIE.io จะทำให้อุปกรณ์สองตัวนี้ ทีนี้เราต้องการให้ตัว freeboard สามารถสั่งให้ตัว LED ของเราเปิดปิดไฟได้ ดังนั้นเราจึงต้องมีปุ่มเพื่อที่ chat ไปหา ESP8266 ว่าให้เปิด-ปิดไฟ

             เริ่มด้วยการกดปุ่ม Add Pane ทางด้านซ้าย จะมี Pane เปล่าๆขึ้นมา

             จากนั้นให้เรากด + เพื่อที่จะเพิ่ม Widget (ปุ่มหรือกราฟแสดงผล) เมื่อกดแล้วจะเจอหน้าต่าง Widget ขึ้นมา

             ให้เราเลือก Type เป็น Button

             จากนั้นให้ข้อมูลต่างๆให้กับปุ่มตามภาพ

(ในตัวอย่างนี้เราจะไม่ได้ใช้ ONCREATED ACTION นะครับ ปล่อยว่างได้เลย)          

ตัวอย่างภาพปุ่ม ON (เปิดไฟ)

             ทีนี้เรามีดูในส่วนของ Java Script ซึ่งจะเป็นโค้ดที่เราเอาไว้ส่งข้อมูลไปหา ESP8266 จากบน NETPIE Freeboard โดยตัวโค้ดนั้นจะมีลักษณะดังนี้

             microgear["ชื่อผู้ส่งนั้นคือ Microgear Reference"].chat("ชื่อผู้รับนั้นคือ Alias","ข้อความ")

ตัวชื่อ Microgear Reference ก็คือ ชื่อผู้ส่งนั้นคือ free_mg1 ที่เราเคยใส่ใน Data Source

ส่วน Alias คือ ชื่อที่เราตั้งไว้ให้กับอุปกรณ์ของเรา

และข้อความก็คือคำสั่งที่เป็น String หรือข้อความที่ส่งไปหาตัว ESP8266 นั้นเอง ในที่นี้จะมีแค่คำสั่ง ON และ OFF เท่านั้น (เปิดไฟกับปิดไฟ)

ในส่วนของ Java Script ของปุ่ม ON คือ

microgear["free_mg1"].chat("lednode555","ON")

ซึ่งความหมายของ Java Script นี้คือให้ free_mg1 (ตัว NETPIE Freeboard) ส่งข้อความ "ON" ไปหา lednode555 (ตัว ESP8266)

จากนั้นเราก็สร้างปุ่มปิดไฟหรือ OFF ครับ โดยให้กดปุ่ม + เพื่อเพิ่มปุ่ม

ดังนั้นเ
ขั้นตอนเหมือนเดิมกับตอนทำปุ่ม ON เลยครับ แค่เราเปลี่ยนในส่วนของ Java Script จาก

.chat("lednode555","ON") เป็น .chat("lednode555","OFF") แทน

จากนั้นกด Save ก็จะได้ปุ่ม OFF มาครับ

เมื่อเราสามารถเปิดสั่งไปหาตัวบอร์ดให้เปิดไฟได้แล้ว แต่เราอยากจะเช็คว่าไฟเปิดได้รึเปล่า ดังนั้นเราจึงต้องมีตัวเช็คการเปิดปิดไฟนั้นคือ Indicator Light

ให้เรากด + ที่บน pane เหมือนเดิม แล้วเลือก Indicator Light

จากนั้นใส่ข้อมูลต่างๆลงไป

ในส่วน ของ value นั้นจะเป็นโค้ดที่เราบอกว่าเงือนไขอะไรถึงไฟถึงเปิดนะครับ ให้เราทำตามนี้

1. กด + ที่ Datasource

2. เลือก datasource

3. หลังจากเราเลือก datasource แล้ว จะมี Alias ให้เราเลือก ซึ่งมันหมายถึงให้เราเลือกว่าจะให้ Alias ไหนเป็น "ตัวรับค่า" จาก ESP8266 มา ให้เราเลือก free_ledtest ซึ่ง Device Alias ที่เราสร้างไว้ใน datasource เพื่อรับข้อความนั้นเอง

4. จากนั้นให้เราเข้า JS Editor จะเจอโค้ดนี้

ซึ่งทั้งโค้ดในรูปข้างบนนี้คือ 1 ตัวแปร นั้นคือ free_ledtest ครับ

5. การเช็คค่า Value จะเช็คจากการเป็นจริงหรือเท็จครับ ซึ่งในโค้ดนี้ต้องการให้ใส่เงื่อนไขที่เป็นจริงครับ เพื่อให้ Indicator Light บอกว่าเปิดไฟได้ ให้เราทำการเติม =="ON" ต่อท้ายไปครับ

กล่าวคือ เมื่อเรากดปุ่ม ON ไป free_mg1 จะส่งข้อความ ON ไปให้ lednode555 จากนั้น lednode555 ก็จะส่งข้อความ ON กลับไปหา free_ledtest เพื่อบอกว่าไฟเปิดแล้ว ซึ่งจะมีเงื่อนไขตรงกับ java script ตามภาพบนครับ จะทำให้ Indicator Light แสดงสถานะเปิดไฟได้นั้นเอง แต่ในทางกลับกัน ถ้าเรากดปุ่ม OFF จะทำให้ free_ledtest ส่งข้อความ OFF กลับมาแทน ทำให้ไม่ตรงเงื่อนไขและ Indicator Light จะแสดงสถานะปิดไฟ

จากนั้นกด close แล้วก็กด save ครับ

เพียงเท่านี้ก็เป็นอันเสร็จสิ้นครับ เราก็สามารถเปิด-ปิดไฟจาก NETPIE Freeboard ได้เรียบร้อยแล้วครับ

การเชื่อมต่อ NETPIE.io ด้วย ESP8266 เบื้องต้น

ในบทความนี้ เราจะมาทดลองการเชือมต่อ ESP8266 กับ NETPIE.io โดยใช้ Arduino IDE

        NETPIE.io คือ Cloud Platform รูปแบบหนึ่งที่ให้บริการ platform as a service เพื่ออำนวยความสะดวกให้นักพัฒนา สามารถพัฒนาให้อุปกรณ์ตัวเองเชื่อมต่อและแลกเปลี่ยนข้อมูลกันได้ในแบบ Internet of Thing (IoT)
        เมื่อนำ NETPIE library ไปเชื่อมกับอุปกรณ์ NETPIE จะทำหน้าที่ในการเชื่อมต่อและประมวลผลโดยใช้ software microgear library ทำให้อุปกรณ์ต่างๆเชื่อมต่อเข้าด้วยกัน
     
 ขั้นตอนการเริ่มต้นใช้งาน
         ในตอนนี้เราจะมาทดสอบตัว ESP8266 กันว่าสามารถเชื่อมต่อ NETPIE ได้มั้ย สิ่งที่เราต้องเตรียมคือ
      1) ESP8266 เช่น Node MCU หรือ Espresso lite v2.0
      2) FTDI ใช้สำหรับอัพโหลดโค้ด
      3) Arduino IDE

เมื่อมีทุกอย่างพร้อมแล้วก็เริ่มสมัครใช้บริการ NETPIE.io ได้เลย (https://netpie.io/)

หลังจากที่เราสมัครเรียบร้อย ให้เรา login แล้วเข้า application

เมื่อเข้ามาแล้วจะเจอหน้านี้

Application คือ Application ID ที่เราสร้างไว้

Things คือ อุปกรณ์ที่เราเคยเชื่อมต่อไว้กับ Application ID ที่เราสร้างไว้ Things ในสามารถเป็นทั้ง ESP8266 (ที่ติดตั้งกับเครื่องใช้ไฟฟ้าต่างๆ) หรือ HTML5 หรือ Mobile Application ก็ได้

ในการที่เราจะเชื่อมกันกับ NETPIE.io ได้นั้น เราจำเป็นต้องสร้าง Application ของเราเอง ซึ่งสามารถทำได้ด้วยการ กด + ที่ Application จะมีหน้าต่างปรากฏขึ้น ให้เราทำการกำหนด Application ID

เมื่อเราสร้าง Application ID แล้วจะปรากฏหน้านี้ขึ้น

ในขั้นตอนต่อไปให้เราทำการสร้าง Application Key และ Application Secret ซึ่งทั้งสองค่านี้จะ unique ไม่ซ้ำกับใคร โดยในการสร้างให้กด + ที่ Application Key จะมีหน้าต่างปรากฏขึ้น

ในช่องแรกคือชื่อ อุปกรณ์ หรือ gear หรือ ALIAS
ช่องถัดมาคือเลือกประเภทของ Key ซึ่งมีสองประเภท

• Device Key เป็น key ที่ไม่มีวันหมดอายุ ใช้กับอะไรก็ได้
• Session Key เป็น key ที่ไว้ใช้สำหรับ html5 มีอายุขัยการใช้งาน 

การ key นั้นให้เลือกตามความต้องการของเราได้เลยครับ อย่างในตัวอย่างผมจะเลือก Device Key

ในตัวอย่างผมตั้งชื่อ ALIAS ว่า NetpieAlias1 ถ้าเราคลิกที่ตัวนี้จะปรากฏ Key และ Secret ให้ดู

ซึ่งค่าต่างๆเหล่ามีไว้ใช้เชื่อมต่อ Things ต่างๆของเรากับ NETPIE.io Cloud Service ในรูปแบบของการ Authentication ซึ่งค่าต่างๆเหล่านี้จะมีความเป็น unique ที่จะไม่ซ้ำใครเลย

***ข้อมูลต่างๆทั้ง App ID, App Key และ App Secret ห้ามนำไปเปิดเผยให้ใครโดยเด็ดขาดเพื่อความปลอดภัยในข้อมูล เพราะอาจมีผู้ประสงค์ร้ายนำไปใช้ได้

ซึ่งในตัวอย่างตอนนี้จะมีค่าต่างๆดังนี้

• App ID = NETPIEBasic
• App Key = jlIoBeurGfr6ddH
• App Secret = qqXdMEoTMSKrzx3jRxl2EEls
• Alias = NetpieAlias1

ค่าเหล่านี้จะถูกใช้เวลาเราเขียนโค้ดต่างๆทั้งในฝั่ง ESP8266, HTML5 หรือ Mobile Application

เมื่อเราเตรียมค่าต่างๆพร้อมแล้ว เรามาดูในส่วนของฝั่ง Arduino IDE

ก่อนที่เราจะใช้ NETPIE.io เราจำเป็นต้องที่มี Library ของ Microgear สำหรับ Arduino ก่อนจาก https://github.com/netpieio แล้วเลือก microgear-esp8266-arduino

หลังจากคลิกเข้าไปให้เลือก Clone or download ต่อด้วย Download ZIP

จากนั้นให้เราแตกไฟล์ microgear-esp8266-arduino-master ไปไว้ในตำแหน่ง libraries ของโปรแกรม Arduino IDE เช่น C:\Users\OS\Documents\Arduino\libraries

หลังจากติดตั้ง microgear library เสร็จแล้ว เรามาลองเชื่อมต่อ ESP8266 กับ NETPIE.io กันเลย

ให้เราทำการนำ FTDI เชื่อมต่อกันกับ USB และ ESP8266 แล้วเปิด Arduino IDE

จากนั้นให้เข้า Files > Examples > ESP8266 Microgear > Basic

โค้ดที่โชว์ขึ้นมาคือโค้ดสำหรับทดลองต่อ NETPIE.io ให้เราใส่ค่าต่างๆตามรูปดังนี้

ให้เราทำการใส่ข้อมูลต่างๆตามนี้

 จากนั้นให้เรากด verify เพื่อตรวจความถูกต้องของโค้ดเรา จากนั้นกด upload เพื่ออัพโค้ดไปยัง ESP8266

เมื่อเราอัพโหลดเสร็จ ให้เปิด Serial Monitor ของ ESP8266

ถ้าขึ้นว่า Connect to NETPIE หมายความเราสามารถนำ ESP8266 เชื่อมกับ NETPIE ได้สำเร็จ

**กรณีไม่สำเร็จเช่น ESP8266 ทำการ reset ตัวเองอัตโนมัติ อาจจะเกิดจาก port ที่ใช้อยู่ไม่สามารถเชื่อมต่อกับได้หรือใส่ค่าต่างๆไม่ถูกต้อง

Arduino Mini Pro คู่มือการใช้เบื้องต้น

Arduino Mini Pro คู่มือการใช้เบื้องต้น

    Arduino Mini Pro เป็น micro-controller ขนาดเล็กเมื่อเทียบกับบอร์ด arduino รุ่นอื่นๆ
โดยลักษณะพิเศษของ Arduino mini pro มีดังนี้

• ATmega328 running at 16MHz with external resonator (0.5% tolerance)
• 0.8mm Thin PCB
• USB connection off board
• Supports auto-reset
• 5V regulator
• Max 150mA output
• Over current protected
• Weighs less than 2 grams!
• DC input 5V up to 12V
• On board Power and Status LEDs
• Analog Pins: 8
• Digital I/Os: 14

Hardware
1. Breadboard

2. USB to UART Module
    เช่น FTDI, CP2102, PL-2303HX ซึ่งอุปกรณ์เหล่านี้เสียบขากับ Mini Pro ตรงๆไม่ได้เพราะตำแหน่งขาไม่ตรงกัน จึงต้องใช้ตัวช่วยเช่นใช้ Breadboard เชื่อมกันหรือ Female-to-Female jumper wire
                - FT232

                 - CP2102

3. Arduino Mini Pro

Software
    Arduino IDE

เริ่มต้นใช้งาน
1. ทำการบัดกรีตัวบอร์ด Arduino mini pro ดังรูป
2. นำบอร์ด Arduino mini pro ต่อเข้ากับอุปกรณ์ USB to UART
          ให้ต่อขาแต่ละขาให้ตรงกันตามนี้
FTDI                             Mini Pro
GND             >              GND
CTS              >              ไม่ต้องต่อกับขาไหน
VCC             >               VCC
TX                >               RX
RX                >               TX
DTR             >               GND

3. ติดตั้งโปรแกรม Arduino IDE
       เมื่อเชื่อต่ออุปกรณ์เสร็จแล้ว สิ่งต่อไปที่ต้องทำมีดังนี้
       a. Install Arduino IDE เวอร์ชั่นล่าสุด
       b. Tools > Board > Arduino Pro or Pro Mini

       หลังจากตั้งค่าเรียบร้อยแล้ว มาลองทดสอบอัพโหลดโค้ด
       a. Files > Examples > Basics > Blink

       b. กด verify
       c. กด upload ***หลังจากกด upload ให้ทำการกดปุ่ม reset 1 ครั้งทันที ไม่ต้องรอให้อัพโหลดเสร็จ              ก่อน

ถ้าหากอัพโหลดสำเร็จ จะมีไฟกระพริบบนตัวบอร์ด

เพียงเท่านี้ Arduino Mini Pro ของเราก็พร้อมที่จะใช้งานแล้ว