ESP32로 Wi-Fi 온도 센서 만들기

프로젝트 소개

이번 프로젝트에서는 ESP32 마이크로컨트롤러와 DHT22 온습도 센서를 사용하여 Wi-Fi 기반 온도 모니터링 시스템을 만들어보겠습니다. ESP32는 내장된 Wi-Fi와 Bluetooth 기능으로 IoT 프로젝트에 최적화된 보드입니다.

학습 목표

ESP32의 Wi-Fi 연결, DHT22 센서 데이터 읽기, 웹 서버 구축 방법을 익힙니다.

필요한 부품

ESP32 개발 보드 x 1
DHT22 온습도 센서 x 1
10kΩ 풀업 저항 x 1
브레드보드 x 1
점퍼 와이어
USB 케이블

회로 연결

다음과 같이 부품들을 연결합니다:

DHT22 핀	ESP32 핀	설명
VCC	3.3V	전원 공급
DATA	GPIO 4	데이터 통신
GND	GND	접지

주의사항

DHT22의 DATA 핀과 VCC 사이에 10kΩ 풀업 저항을 연결해야 합니다.

라이브러리 설치

Arduino IDE에서 다음 라이브러리를 설치합니다:

Arduino IDE 메뉴에서 스케치 > 라이브러리 포함하기 > 라이브러리 관리 선택
"DHT sensor library"를 검색하여 Adafruit의 라이브러리 설치
"Adafruit Unified Sensor"도 함께 설치

코드 작성

다음은 ESP32에서 DHT22 센서를 읽고 웹 서버로 데이터를 제공하는 코드입니다:

#include <WiFi.h>
#include <WebServer.h>
#include <DHT.h>

// Wi-Fi 설정
const char* ssid = "YOUR_WIFI_SSID";
const char* password = "YOUR_WIFI_PASSWORD";

// DHT22 센서 설정
#define DHTPIN 4
#define DHTTYPE DHT22
DHT dht(DHTPIN, DHTTYPE);

// 웹 서버 생성 (포트 80)
WebServer server(80);

void setup() {
  Serial.begin(115200);

  // DHT 센서 초기화
  dht.begin();

  // Wi-Fi 연결
  Serial.println("Wi-Fi 연결 중...");
  WiFi.begin(ssid, password);

  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }

  Serial.println("");
  Serial.println("Wi-Fi 연결 완료!");
  Serial.print("IP 주소: ");
  Serial.println(WiFi.localIP());

  // 웹 서버 라우트 설정
  server.on("/", handleRoot);
  server.on("/data", handleData);

  // 웹 서버 시작
  server.begin();
  Serial.println("웹 서버 시작!");
}

void loop() {
  server.handleClient();
}

// 메인 페이지 핸들러
void handleRoot() {
  String html = "<!DOCTYPE html>";
  html += "<html>";
  html += "<head>";
  html += "<meta charset='UTF-8'>";
  html += "<meta name='viewport' content='width=device-width, initial-scale=1.0'>";
  html += "<title>ESP32 온습도 모니터</title>";
  html += "<style>";
  html += "body { font-family: Arial; text-align: center; margin: 50px; }";
  html += ".sensor-box { display: inline-block; margin: 20px; padding: 20px; ";
  html += "border: 2px solid #2563eb; border-radius: 10px; }";
  html += ".value { font-size: 48px; font-weight: bold; color: #2563eb; }";
  html += ".label { font-size: 18px; color: #666; }";
  html += "</style>";
  html += "<script>";
  html += "setInterval(function() {";
  html += "  fetch('/data').then(res => res.json()).then(data => {";
  html += "    document.getElementById('temp').innerHTML = data.temperature + '°C';";
  html += "    document.getElementById('humi').innerHTML = data.humidity + '%';";
  html += "  });";
  html += "}, 2000);";
  html += "</script>";
  html += "</head>";
  html += "<body>";
  html += "<h1>ESP32 온습도 모니터</h1>";
  html += "<div class='sensor-box'>";
  html += "<div class='value' id='temp'>--°C</div>";
  html += "<div class='label'>온도</div>";
  html += "</div>";
  html += "<div class='sensor-box'>";
  html += "<div class='value' id='humi'>--%</div>";
  html += "<div class='label'>습도</div>";
  html += "</div>";
  html += "</body>";
  html += "</html>";

  server.send(200, "text/html", html);
}

// 센서 데이터 API 핸들러
void handleData() {
  float temperature = dht.readTemperature();
  float humidity = dht.readHumidity();

  if (isnan(temperature) || isnan(humidity)) {
    server.send(500, "application/json", "{\"error\": \"센서 읽기 실패\"}");
    return;
  }

  String json = "{";
  json += "\"temperature\":" + String(temperature, 1) + ",";
  json += "\"humidity\":" + String(humidity, 1);
  json += "}";

  server.send(200, "application/json", json);
}

코드 설명

1. Wi-Fi 연결

ESP32는 WiFi.begin() 함수를 사용하여 무선 공유기에 연결합니다. 연결이 완료되면 IP 주소가 시리얼 모니터에 출력됩니다.

2. 웹 서버 구축

WebServer 라이브러리를 사용하여 포트 80에서 HTTP 서버를 실행합니다. 두 개의 엔드포인트를 제공합니다:

/ - 웹 인터페이스를 제공하는 HTML 페이지
/data - 센서 데이터를 JSON 형식으로 반환하는 API

3. 센서 데이터 읽기

dht.readTemperature()와 dht.readHumidity() 함수로 센서 값을 읽습니다. 값이 유효하지 않으면 에러를 반환합니다.

4. 실시간 업데이트

웹 페이지의 JavaScript는 2초마다 /data API를 호출하여 최신 센서 값을 가져와 화면을 업데이트합니다.

업로드 및 테스트

코드에서 YOUR_WIFI_SSID와 YOUR_WIFI_PASSWORD를 실제 Wi-Fi 정보로 변경
ESP32 보드를 선택하고 코드를 업로드
시리얼 모니터를 열어 IP 주소 확인 (예: 192.168.0.100)
웹 브라우저에서 해당 IP 주소로 접속
실시간으로 온도와 습도가 표시되는지 확인

테스트 성공!

웹 페이지에서 센서 값이 2초마다 업데이트되면 프로젝트가 정상 작동하는 것입니다.

확장 아이디어

이 프로젝트를 더욱 발전시킬 수 있는 아이디어들입니다:

데이터 로깅: SD 카드에 센서 데이터를 저장하여 장기간 모니터링
클라우드 연동: ThingSpeak, Firebase 등의 서비스에 데이터 전송
알림 기능: 특정 온도/습도 범위를 벗어나면 이메일이나 푸시 알림 발송
그래프 표시: Chart.js를 사용하여 시간별 데이터를 그래프로 시각화
다중 센서: 여러 개의 센서를 연결하여 여러 위치 동시 모니터링

트러블슈팅

센서 값이 NaN으로 표시되는 경우

풀업 저항(10kΩ)이 제대로 연결되어 있는지 확인
DHT22 센서의 전원과 접지가 올바르게 연결되어 있는지 확인
센서 읽기 간격을 2초 이상으로 설정 (DHT22는 최소 2초 간격 필요)

Wi-Fi 연결이 안 되는 경우

SSID와 비밀번호를 정확히 입력했는지 확인
2.4GHz Wi-Fi 네트워크인지 확인 (ESP32는 5GHz 지원 안 함)
공유기와의 거리가 너무 멀지 않은지 확인

웹 페이지가 열리지 않는 경우

시리얼 모니터에서 IP 주소를 정확히 확인
ESP32와 같은 네트워크에 연결되어 있는지 확인
방화벽이 연결을 차단하고 있지 않은지 확인

결론

이 프로젝트를 통해 ESP32의 Wi-Fi 기능과 웹 서버 구축 방법을 배웠습니다. 온습도 센서 데이터를 실시간으로 모니터링하는 간단하면서도 실용적인 IoT 시스템을 만들었습니다.

이 기본 구조를 바탕으로 더 복잡한 홈 자동화 시스템이나 스마트팜 프로젝트로 확장할 수 있습니다. 계속해서 다양한 센서와 액추에이터를 추가하며 실력을 키워보세요!