목차(클릭하세요)
이 방식은 다른 네트워크에서도 사용가능한 방식
Blynk 2.0 어플을 이용해 스마트폰과 웹에서
아두이노 IOT WeMos D1 R1 보드에 연결된 LED를 WIFI 무선으로 제어하기
[참고 사이트]
두 방식 비교표
항목 | 웹 서버 방식 | Blynk 클라우드 방식 |
네트워크 | 같은 WiFi 필수 | 서로 다른 네트워크 OK |
접속 범위 | 로컬 네트워크만 | 전 세계 어디서든 |
외부 접속 | 불가능 | 가능 |
데이터 사용 | 없음 | 소량 사용 |
서버 | 아두이노가 서버 | Blynk 클라우드 서버 |
UI | HTML로 직접 작성 | Blynk 위젯 사용 |
복잡도 | 중간 | 쉬움 |
1. Blynk란?
1-1. IoT 프로젝트를 위한 앱 빌더 플랫폼
•
스마트폰 앱으로 아두이노/ESP32 같은 하드웨어를 원격 제어할 수 있게 해주는 클라우드 기반 IoT 플랫폼
•
기존 예제와의 차이점?
◦
Blynk = 미리 만들어진 방(버튼, 슬라이더, 그래프)을 끌어다 놓기만 하면 완성
1-2. Blynk의 주요 구성 요소
•
Blynk App & Web Dashboard (인터페이스): 사용자가 스마트폰이나 PC 화면에서 버튼을 누르거나 그래프를 보는 곳
◦
'스위치'나 'LED' 위젯을 배치하여 제어 패널을 구성할 수 있음
•
Blynk Cloud (서버): 사용자의 스마트폰과 아두이노 사이에서 데이터를 중계해 주는 역할
◦
사용자가 만든 '템플릿' 정보가 이곳에 저장됨
•
Blynk Libraries (하드웨어 코드): 아두이노에 업로드하는 코드
◦
하드웨어가 인터넷을 통해 Blynk 클라우드와 통신할 수 있게 함
1-3.특이점_템플릿과 데이터스트림
•
템플릿(Template): 어떤 하드웨어를 쓰고, 어떤 통신 방식(WiFi 등)을 쓸지 정의해 둔 '설계도'
◦
하드웨어를 등록하기 전에 웹에서 먼저 템플릿을 생성해야 함
•
데이터스트림(Datastream): 앱과 하드웨어 사이를 연결하는 '가상의 전선'
◦
'가상 핀(Virtual Pin)'이라고도 부르며, 예를 들어 디지털 핀(D4, D5)이 아닌 V1, V2와 같은 가상 채널을 통해 데이터를 주고 받을 수 있음
◦ 예시: 앱의 슬라이더(V1)를 움직이면 → 클라우드(V1)를 거쳐 → 아두이노 코드의 BLYNK_WRITE(V1) 함수로 값이 전달됨
1-4.작동과정 요약(기초)
[스마트폰 앱]
(WiFi/LTE)
[Blynk 클라우드 서버]
(WiFi)
[아두이노/ESP32]
[LED, 센서, 모터 등]
[작동 시나리오]
1.
Blynk 앱에서 "LED ON" 버튼 터치
2.
Blynk 서버로 신호 전송
3.
서버가 아두이노/ESP32에게 명령 전달
4.
아두이노/ESP32가 LED 켜기 실행
2. 작업순서
1. 웹 설정: Blynk 웹사이트에서 회원가입 후 템플릿과 데이터스트림을 생성
2. 화면 구성: 웹 대시보드나 앱에서 위젯(버튼, 슬라이더 등)을 배치하고 데이터스트림과 연결
3. 코드 업로드: Blynk에서 발급받은 **인증 토큰(Auth Token)**과 템플릿 ID를 아두이노 코드에 복사해 넣고 업로드
4. 원격 제어: 기기가 인터넷(WiFi)에 연결되면 스마트폰으로 어디서든 제어
2-1. 웹설정
•
데이터스트림(Datastreams) 구성
◦ Datastreams 탭 → + New Datastream → Virtual Pin 선택.
◦ V1 (제어용):
◦ V2 (피드백용):
2-2.화면구성
•
위젯 배치 (Edit Mode)
◦ Web Dashboard 탭 클릭
◦ Slider 위젯을 드래드 방식으로 추가:
◦ Label/Gauge Display 위젯 추가:
◦ Save 클릭하여 저장.
•
디바이스 생성 및 정보 복사
◦ 이후 왼쪽 메뉴에서 다시 Developer Zone 를 클릭한 다음 → add first Device선택
◦ 생성한 템플릿 선택 → 생성된 Device Info 화면에서 아래 3가지 정보 복사하여 기록해두기
[주의 ]BLYNK_AUTH_TOKEN은 한번생성 후 조회가 잘 안되니 조심
2-3.코드 업로드
•
필수 라이브러리 설치
◦ 라이브러리 매니저(Ctrl+Shift+I) 실행.
◦ Blynk 검색 및 설치 (BlynkSimpleWifi.h 포함됨).
[주의] 우노 R4 WiFi의 와이파이 기능을 담당하는 WiFiS3.h 라이브러리는 보드 패키지를 설치할 때 자동으로 포함되므로 별도로 라이브러리 매니저에서 설치할 필요없고, Blynk라이브러리만 설치하면 OK!
•
코드 작성 (R4 WiFi 기준)
◦ 헤더 파일: <WiFiS3.h>와 <BlynkSimpleWifi.h> 사용
◦ WiFi 설정: 2.4GHz 대역의 SSID와 비밀번호 입력 (5GHz 지원 불가).
◦ 핵심 로직
#define BLYNK_TEMPLATE_ID "내_템플릿_ID"
#define BLYNK_DEVICE_NAME "내_장치_이름"
#define BLYNK_AUTH_TOKEN "내_인증_토큰"
#define BLYNK_PRINT Serial
#include <WiFiS3.h> // 우노 R4 WiFi 필수 라이브러리 [2]
#include <BlynkSimpleWifi.h> // 일반 WiFi용 Blynk 라이브러리
#include <Servo.h>
Servo myServo;
char auth[] = BLYNK_AUTH_TOKEN;
char ssid[] = "와이파이_이름"; // 2.4GHz 와이파이만 가능
char pass[] = "와이파이_비번";
const int servoPin = 10; // 서보모터 핀
void setup() {
Serial.begin(9600);
// 서보 설정
myServo.attach(servoPin);
myServo.write(0);
// Blynk 연결 시도
Blynk.begin(auth, ssid, pass);
}
void loop() {
Blynk.run();
}
// 슬라이더 제어 및 피드백 로직 (이전 답변과 동일)
BLYNK_WRITE(V1) {
int angle = param.asInt();
myServo.write(angle);
int currentAngle = myServo.read();
Blynk.virtualWrite(V2, currentAngle);
}
Arduino
복사
•
업로드 설정
◦ Board: Arduino UNO R4 WiFi 선택.
◦ Port: 인식된 COM 포트 선택.
◦ 업로드 버튼(→) 클릭.
◦
이후 시리얼 모니터창에 아무 반응이 없다면 아두이노의 Reset버튼을 눌러 시리얼 모니터창이 아래와 같이 출력되는지 확인필수
◦
2-2.원격제어
•
연결 상태 확인
◦ 시리얼 모니터(9600 baud)를 열어 Blynk 로고와 Ready 메시지 확인.
◦ 보드의 IP 주소가 출력되면 정상 연결됨.
•
제어 및 피드백 테스트,
◦ Blynk 웹 대시보드 또는 모바일 앱 접속.
◦ **슬라이더(V1)**를 움직여 실제 서보모터가 회전하는지 확인.
◦ 모터가 움직인 직후 **디스플레이(V2)**에 현재 각도 값이 업데이트되는지 확인
실제 웹페이지에서 18로 제어했지만, 시리얼 모니터에는 17이 출력(완벽하지 않은 듯)
3. [심화]초음파센서를 통한 엄크 감지기 웹버전 만들기
3-1.가상핀 구성
핀 | 위젯 | 용도 |
V1 | Value Display,Gauge | 거리 숫자 표시, 거리 게이지 |
V3 | LED | 근접 경고등 (20cm 이하) |
V4 | slider | 경고 거리 조정 |
3-2.작동 시나리오
•
1초마다 자동 측정
◦
초음파 발사 → 반사파 수신 → 거리 계산
•
Blynk 앱으로 전송
◦
V1: "35 cm" 표시
◦
V3: LED 꺼짐 (35 > 20(임계값)
◦
V4: 경고 거리 조정
•
근접 경고
◦
물체가 15cm로 가까워짐
◦
V3: LED 빨간색 켜짐 
◦
시리얼: "
WARNING: Object too close!"
3-3.작업순서(4단계)
3-3-1.웹 설정(새 템플릿 생성)
•
기존의 템플릿은 놔두고 새로운 템플릿 셋팅하기
•
프로젝트 이름
◦
"UltrasonicMonitor"
◦
Device: "Arduino UNO R4 WiFi" 선택
◦
Connection: "WiFi" 선택
•
데이터스트림(Datastreams) 구성
◦ Datastreams 탭 → + New Datastream → Virtual Pin 선택.
•
v1: 거리관련 가상핀 설정
•
v3:웹 페이지 대시보드의 근접 경고등작동을 위한 가상핀
•
v4: 경고 거리 조정을 위한 가상핀
•
거리 단위를 5로 제어 가능
3-3-2.위젯 배치 및 디바이스 설정
•
Web Dashboard 탭 클릭하여 4가지 위젯을 배치
•
각 위젯의 설정(톱니바퀴)를 사용하여 위젯과 가상핀 연결
◦
초깃값 설정이 잘못되면 save불가능
•
디바이스 생성 및 정보 복사
◦ 이후 왼쪽 메뉴에서 다시 Developer Zone 를 클릭한 다음 → add first Device선택
•
이후 디바이스 네임을 설정한 뒤, BLYNK_TEMPLATE_ID, BLYNK_TEMPLATE_NAME, BLYNK_AUTH_TOKEN를 복사하여 코드에 넣기
3-3-3.코드 업로드
/*
Blynk Ultrasonic Sensor Distance Monitor
초음파 센서(HC-SR04)로 거리를 측정하여
Blynk 앱으로 실시간 모니터링하는 IoT 프로젝트
Circuit:
* 초음파 센서 TRIG: 8번 핀
* 초음파 센서 ECHO: 9번 핀
* VCC: 5V, GND: GND
Blynk 앱 설정:
* V1: Value Display + Gauge (거리 표시 - 두 위젯 모두 V1에 연결)
* V3: LED Widget (근접 경고)
* V4: Slider (경고 거리 조정)
Created by Yangphago
*/
#define BLYNK_TEMPLATE_ID "내_템플릿_ID"
#define BLYNK_DEVICE_NAME "UltrasonicMonitor"
#define BLYNK_AUTH_TOKEN "내_인증_토큰"
#define BLYNK_PRINT Serial
#include <WiFiS3.h>
#include <BlynkSimpleWifi.h>
// WiFi 설정
char auth[] = BLYNK_AUTH_TOKEN;
char ssid[] = "와이파이_이름"; // 2.4GHz 와이파이만 가능
char pass[] = "와이파이_비번";
// 초음파 센서 핀 설정
const int TRIG_PIN = 8;
const int ECHO_PIN = 9;
// 측정 관련 변수
float distance = 0;
int warningDistance = 20; // 경고 거리 (초기값 20cm, 앱에서 조정 가능)
unsigned long lastMeasureTime = 0;
const int MEASURE_INTERVAL = 500; // 0.5초마다 측정
// Blynk 타이머
BlynkTimer timer;
void setup() {
Serial.begin(9600);
// 초음파 센서 핀 모드 설정
pinMode(TRIG_PIN, OUTPUT);
pinMode(ECHO_PIN, INPUT);
// Blynk 연결
Serial.println("Connecting to Blynk...");
Blynk.begin(auth, ssid, pass);
// 타이머 설정: 1초마다 센서 읽기
timer.setInterval(1000L, sendSensorData);
Serial.println("Setup complete!");
}
void loop() {
Blynk.run();
timer.run();
}
// 거리 측정 함수
float measureDistance() {
// 1. TRIG 핀을 LOW로 초기화
digitalWrite(TRIG_PIN, LOW);
delayMicroseconds(2);
// 2. TRIG 핀에 10μs 펄스 발생
digitalWrite(TRIG_PIN, HIGH);
delayMicroseconds(10);
digitalWrite(TRIG_PIN, LOW);
// 3. ECHO 핀에서 펄스 지속 시간 측정 (μs)
long duration = pulseIn(ECHO_PIN, HIGH, 30000); // 타임아웃 30ms
// 4. 거리 계산 (cm)
// 거리 = (시간 × 음속) / 2
// 음속 = 340m/s = 0.034cm/μs
// 거리(cm) = duration(μs) × 0.034 / 2
float dist = duration * 0.034 / 2;
// 5. 유효 범위 체크 (2cm ~ 400cm)
if (dist < 2 || dist > 400) {
return -1; // 측정 실패
}
return dist;
}
// 센서 데이터를 Blynk로 전송
void sendSensorData() {
// 거리 측정
distance = measureDistance();
if (distance > 0) {
// 시리얼 모니터 출력
Serial.print("Distance: ");
Serial.print(distance);
Serial.println(" cm");
// V1: 거리 값 전송 (Value Display + Gauge 모두 연결됨)
Blynk.virtualWrite(V1, distance);
// V3: 근접 경고 LED
if (distance <= warningDistance) {
Blynk.virtualWrite(V3, 255); // LED 켜기 (빨간색)
Serial.println("⚠️ WARNING: Object too close!");
} else {
Blynk.virtualWrite(V3, 0); // LED 끄기
}
} else {
Serial.println("❌ Measurement failed - Out of range");
Blynk.virtualWrite(V1, "Error");
}
}
// Blynk 앱에서 경고 거리 조정
// V4: 슬라이더로 경고 거리 설정 (10-100cm)
BLYNK_WRITE(V4) {
warningDistance = param.asInt();
Serial.print("⚙️ Warning distance updated to: ");
Serial.print(warningDistance);
Serial.println(" cm");
// 현재 설정된 경고 거리를 앱에 다시 표시 (확인용)
Blynk.virtualWrite(V4, warningDistance);
}
// 앱 연결 시 실행
BLYNK_CONNECTED() {
Serial.println("✅ Connected to Blynk!");
// 초기값 전송
Blynk.virtualWrite(V1, 0);
Blynk.virtualWrite(V3, 0);
Blynk.virtualWrite(V4, warningDistance); // 현재 경고 거리 전송
}
Arduino
복사
•
업로드 설정
◦ Board: Arduino UNO R4 WiFi 선택.
◦ Port: 인식된 COM 포트 선택.
◦ 업로드 버튼(→) 클릭.
◦
이후 시리얼 모니터창에 아무 반응이 없다면 아두이노의 Reset버튼을 눌러 시리얼 모니터창이 아래와 같이 출력되는지 확인필수
3-3-4.원격제어 확인
•
Devices를 클릭하면 현재 활성화 되어있는 디바이스가 online으로 표시되어 있음
•
클릭하여 결과 모니터링 가능
•
실시간 확인 가능
4. Row Data를 저장할 순 없을까?
1.
다시 데이터 스트림으로 이동→ edit클릭
•
우리는 v1가상핀에 연결된 값을 저장하는 것이 목적
2.
v1을 클릭한 다음, 고급 설정을 보니.. 돈 달라고..
3.
결론: 다른 방법을 찾자!




































