ESP8266 (ESP-01) + Blynk + LED controller (Thai Version)

ESP8266 (ESP-01) + Blynk + LED controller
โปรแกรมควบคุมการเปิดปิด LED ด้วย ESP8266 และ Blynk ผ่าน WIFI ง่ายๆ

Tutorial นี้จะเป็นการนำ ESP8266 ESP-01 ควบคุมการแสดงผล ปิดเปิด LED ด้วยแอพ Blynk

ESP8266 เป็น WIFI module ที่ราคาถูกมาก ประมาณ 100บาท ($2) และขนาดเล็ก ใช้พลังงานน้อยมาก เป็นที่นิยมในเหล่า Makers ขณะนี้

Blynk application เป็นโปรแกรมบนมือถือที่ทำให้เราสร้างหน้าต่างควบคุมหรือแสดงผลเชื่อมต่อกับพวกไมโครคอนโทรเลอร์(Ardunio, ESP8266, Raspberry Pi) ได้ง่ายๆโดยไม่ต้องเขียนโปรแกรมอะไรให้ซับซ้อนเลย

  1. ขั้นแรกให้เตรียม usb adapter for Arduino (รูปที่1) หรือบางทีจะเห็นเขียนว่า FTDI (Future Technology Devices International) ซึ่งเป็นชื่อบริษัทที่ผลิต Chip เจ้าตัวนี้มาขาย อุปกรณ์ตัวนี้เป็นอุปกรณ์ในการติดต่อสื่อสาร เขียนโปรแกรม ระหว่างคอมพิวเตอร์ และเจ้า Mini Arduino หรือ ESP8266 หรือ ไมโครคอนโทรลเลอร์ตัวอื่นๆ ผ่านพอร์ต USB ลักษณะด้านหนึ่งจะเป็นพอร์ต USB เพื่อเสียบเข้ากับคอมพิวเตอร์ของเรา และอีกด้านหนึ่งจะเป็นขาลอยเพื่อเชื่อมต่อไปยังไมโครคอนโทรลเลอร์

01-08-2015 12-32-15

รูปที่1 USB Adapter for Arduino

  1. รูปที่2แสดงการเชื่อมต่อระหว่าง USB Adapter และ ESP8266 ก่อนที่เราจะทำการเขียนโปรแกรมลงไปก็ให้ทำการเชื่อมต่อโดยใช้สาย Jumper cable (รูปที่2) ต่อตามตารางที่ 1

01-08-2015 12-33-46

รูปที่2 Jumper cable

USB adapter Pin ESP8266 Pin

3.3V

VCC

3.3V

CH_DP
GND

GND

TX

RX

RX

TX

ตารางที่1 แสดงการเชื่อมต่อสายระหว่าง ESP8266 กับ USB Adapter

01-08-2015 12-34-01

รูปที่ 3 แสดงขาของESP8266 (ESP-01)

01-08-2015 12-34-16

รูปที่4 แสดงการเชื่อมสายระหว่าง ESP8266 กับ USB Adapter

  1. ซอฟต์แวร์ในการเขียนโปรแกรมเราใช้ Arduino IDE (สามารถดาวน์โหลดโปรแกรมที่ https://www.arduino.cc/en/main/software)
  2. หลังจากที่ดาวน์โหลดและติดตั่ง Arduino IDE เป็นที่เรียบร้อยแล้ว ให้ทำการเปิดโปรแกรมขึ้นมา โดยขั้นแรกต้องเข้าไปเพิ่มข้อมูลบอร์ด esp8266 ให้กับโปรแกรมก่อน โดยไปที่ เมนู File> Preference

01-08-2015 12-34-26

รูปที่5

  1. กรอกที่อยู่ของ JSON file ของบอร์ด ESP8266 เข้าไปที่ช่อง Additional Boards Manager URLs ดังนี้http://arduino.esp8266.com/package_esp8266com_index.json

01-08-2015 12-34-38

รูปที่6

  1. หลังจากนั้นให้ไปที่เมนู Sketch> Include Library> Manage Libraries เพื่อทำการเพิ่ม Library ของ ESP8266 ในโปรแกรม Arduino IDE

01-08-2015 12-34-49

รูปที่ 7

  1. ที่หน้าต่าง Library Manager ให้พิมพ์ ESP8266 โดยด้านล่างจะปรากฏ Library ที่เกี่ยวข้องขึ้นมาและให้ทำการกด Install ESP8266 Community

01-08-2015 12-35-03

รูปที่ 8

8. สังเกตว่าถ้าไปที่เมนู Tools> Board:> Boards Manager… เราจะเห็นและสามารถเลือกบอร์ด Generic ESP8266 Module ได้แล้ว

01-08-2015 12-35-15

รูปที่ 9

9. เมื่อโปรแกรม Arduino IDE มีข้อมูลของบอร์ด ESP8266 แล้ว ขั้นตอนต่อไปให้เราทำการโหลด app ของ Blynk เพื่อ install ที่มือถือของเรา สามารถเข้าไปดูลิงค์ได้ที่ http://www.blynk.cc/getting-started/ หรือเข้าไปใน app store หรือ google play แล้วค้นหา app ชื่อว่า Blynk ก็ได้ และทำการ Install

01-08-2015 12-35-27

รูปที่ 10

10. หลังจากที่ติดตั้ง app แล้วให้เปิด app ขึ้นมาเลยครับ กดตรง Create Account กรอก email และ password ที่เราต้องการสมัครสมาชิกใช้งาน และกด Sign Up

01-08-2015 12-35-41

รูปที่ 11

11. สร้างโปรเจคงานของเรา โดยทำการกรอกชื่อและเลือก Platform Module ของเรา ในที่นี้เราเลือก ESP8266 จะเห็นว่า app ได้ทำการสร้าง Auth Token ซึ่งเป็นรหัสติดต่อกับ ESP8266 ของเราผ่านระบบWi-Fi ให้ทำการจดไว้หรือ กดปุ่มส่ง Email หาเราเองแล้วค่อย Copy ใส่ในโปรแกรม Arduino IDE ภายหลัง

01-08-2015 12-35-51

รูปที่ 12

  1. เมื่อลง app ในมือถือของเราแล้ว ให้ทำการดาวน์โหลด Blynk library ที่เป็น Source code .zip ลงมาในเครื่องคอมพิวเตอร์ และทำการเพิ่มเข้าไปในโปรแกรม Arduino IDE สามารถโหลดได้ที่ลิงค์ http://www.blynk.cc/getting-started/ โดยกดปุ่มดาวน์โหลด หรือไปโหลดโดยตรงได้ใน GitHub

01-08-2015 12-36-01

รูปที่ 13

  1. ทำการเพิ่ม Blynk library ในโปรแกรม Arduino IDE โดยไปที่เมนู Sketch> Include Library> Add .ZIP Library แล้วทำการเลือกไฟล์ที่ดาวน์โหลดลงมา

01-08-2015 12-36-21

รูปที่ 14

  1. ตอนนี้เราก็พร้อมที่จะทำการเขียนโปรแกรมแล้ว ง่ายที่สุดเราสามารถใช้ไฟล์ตัวอย่างที่ Blynk ให้มาได้เลย โดยไปที่เมนู File> Examples> Blynk> BoardsAndShields> ESP8266_Standalone

01-08-2015 12-36-34

รูปที่ 15

  1. เราก็จะได้โค้ดมาตามด้านล่างนี้ โดยให้เราทำการปรับแต่งโค้ดเล็กน้อย โดยให้นำรหัสที่ลงทะเบียนมา กรอกลงในบรรทัด char auth[] = “YourAuthToken”; เช่น char auth[] = ” 9bb24d48b481485f8203636b6a76b6a7″; และให้กรอกชื่อ Wi-Fi และรหัสผ่าน อินเตอร์เน็ตที่เราทำการเชื่อมต่อเพื่อใช้งาน ในบรรทัด Blynk.begin(auth, “ssid”, “pass”); เช่น Blynk.begin(auth, “MyHomeWIFIName”, “12345678”);

#define BLYNK_PRINT Serial    // Comment this out to disable prints and save space

#include <ESP8266WiFi.h>

#include <BlynkSimpleEsp8266.h>

// You should get Auth Token in the Blynk App.

// Go to the Project Settings (nut icon).

char auth[] = “YourAuthToken”;

void setup()

{

  Serial.begin(9600);

  Blynk.begin(auth, “ssid”, “pass”);

}

void loop()

{

  Blynk.run();

}

  1. ทำการ Verify code และ Upload ไปที่ ESP8266 ของเราได้เลย

**สำคัญมากตอนโหลดข้อมูลเข้าไปที่ESP8266 ต้องต่อขา GPIO0 ลงกราวด์ ดังรูปที่4**

  1. ขั้นตอนนี้เราจะสร้างสวิตช์ควบคุมการเปิดปิดไฟ LED ที่ต่อจากขา GPIO0 และ GPIO2 ของ ESP8266 ให้ทำการต่อวงจรดังภาพ

01-08-2015 12-36-47

รูปที่ 16

  1. เราสามารถเห็นการเชื่อมต่อสำเร็จได้จากหน้าต่าง Serial Monitor
  2. ทำการสร้างสวิตช์ควบคุมหลอดไฟ LED ใน app Blink ดังภาพ โดยกดปุ่มเครื่องหมาย + เพื่อทำการสร้างสวิตช์ หรือหน้าจอแสดงผลข้อมูลต่างๆ

01-08-2015 12-37-05

รูปที่ 17

  1. ทำการเลือก Button จากหน้าต่าง Widget Box

01-08-2015 12-37-14

รูปที่ 18

  1. กดไอคอนปุ่มที่ถูกสร้างมาในหน้า Project เพื่อทำการกำหนดชื่อและขาในการเชื่อมต่อแสดงผล ให้ Select Pin ให้สอดคล้องกับขา GPIO ของ ESP8266 ที่เราต่อกับ LED แสดงผล เช่นเราต่อ LED สีแดงกับขา GPIO0 และต่อ LED สีเขียวกับขา GPIO2 และตรง Mode ให้เราเลือกแบบ Switch เพราะเวลาเรากดปุ่มแล้วให้ค้างสถานะนั้นจนกว่าเราจะกดอีกครั้งเพื่อเปลี่ยนสถานะตรงข้าม เช่นเรากดครั้งแรกไฟจะเปิดค้าง จดกว่าเราจะกดปุ่มเดิมอีกครั้งไฟก็จะปิด

01-08-2015 12-37-27

รูปที่ 19

  1. เมื่อเราสร้างปุ่มควบคุมเสร็จแล้ว ให้ทำการกดปุ่ม สามเหลี่ยม Play เพื่อทำการเชื่อมต่อกับ Wi-Fi และ ESP8266 ของเราที่ทำการเขียนโปรแกรมไว้แล้วและกำลังรันอยู่

01-08-2015 12-37-41

รูปที่ 20

  1. ทดลองทำการกดสวิตช์ใน app บนมือถือของเราและสังเกตไฟLED ว่าติดดับตามหรือไม่

https://youtu.be/ZYYs8aBT-Sk

อ้างอิง References

http://www.instructables.com/id/ESP8266-ESP-12Standalone-Blynk-101/

http://www.blynk.cc/

http://db4linq.blogspot.co.uk/2015/03/esp8266-gpio-http-server.html

http://iot-playground.com/2-uncategorised/38-esp8266-and-arduino-ide-blink-example

http://www.cmmakerclub.com/esp8266

http://www.esp8266.com/viewtopic.php?p=22825

Advertisements

17 thoughts on “ESP8266 (ESP-01) + Blynk + LED controller (Thai Version)

  1. Pingback: โมดูล ESP8266 ตัวใหม่ ESP-14 คราวนี้มีชิป STM8S | Ultimateohm's Blog

  2. Pingback: Using smart phone (Android) to control LED on Raspberry Pi 3 through Bluetooth connection – Spidy Learning & OBSY Development

  3. Nice Tutorial!.. I’ll try this if I have time. By the way, is it alright to do this procedure even when my ESP8266 has NodeMCU loaded on it? Thanks 😀

  4. hello
    thank you for your tutorial.
    i do the same as you but at the end of uploading the code, i cant find my esp8266-01 by my phone?
    what is my problem?
    and after uploading the code to board , i must connect my wifi to esp8266?
    please help me

  5. Good project
    In my case I can not use blynk application I need the browser commands to operate the relay
    Please send which browser commands I should use
    Regards

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s