6주차_참고 : 간단한 웹서버 구축 코드 설명 - dhryu60/SmartDevice_2025-1 GitHub Wiki

3. 간단한 웹서버 구축 코드 리뷰

이 코드는 ESP32를 이용해 Wi-Fi에 연결하고, 간단한 웹서버를 만들어 클라이언트가 브라우저로 접속했을 때 "Hello from ESP32!"라는 메시지를 보내주는 예제입니다.

#include <WiFi.h>        // ESP32의 Wi-Fi 기능을 사용하기 위한 라이브러리
#include <WebServer.h>   // 간단한 웹서버 기능을 제공하는 라이브러리 (포트, 라우팅 등 처리)

const char* ssid = "YourWiFiSSID";             // 접속할 무선 네트워크 이름
const char* password = "YourWiFiPassword";     // 해당 Wi-Fi의 비밀번호

⚠️ 실제 Wi-Fi 정보를 넣어야 합니다. (예: "KT_GiGA_2G")

WebServer server(80); // 포트 80번으로 서버 개설

• 80번 포트는 웹 브라우저에서 기본적으로 사용하는 포트입니다.
• server는 이후 클라이언트 요청을 처리할 객체입니다.

void handleRoot() {
  server.send(200, "text/plain", "Hello from ESP32!");
}

• 클라이언트가 ESP32 IP로 접속할 때 (/ 루트 경로),
  → HTTP 상태코드 200 (OK) 와 함께
  → **텍스트 타입의 메시지("Hello from ESP32!")**를 응답합니다.

Serial.begin(115200);

• 시리얼 통신 시작 (디버깅용, 시리얼 모니터에 로그 출력)

WiFi.begin(ssid, password);
Serial.println("Connected to WiFi");

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

• Wi-Fi 연결 시작 (WiFi.begin)
• 연결 완료까지 기다리며 .을 출력 (시각적 표시)

server.on("/", handleRoot);

• 클라이언트가 http://ESP32_IP/에 접속했을 때
  → handleRoot() 함수가 실행되도록 설정

Serial.println("");
Serial.println("WiFi connected.");
Serial.println("IP address: ");
Serial.println(WiFi.localIP());

• 연결 성공 시, 할당된 로컬 IP 주소를 시리얼 모니터에 출력합니다.

  ex) 192.168.0.15

server.begin();

• 웹서버 시작
  → ESP32는 이제 클라이언트의 접속을 받을 준비가 된 상태!

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

• 클라이언트가 웹서버에 요청을 보내면 이를 처리함
• loop()는 계속 반복되므로 요청이 있을 때마다 자동으로 응답 가능

1. 시리얼 모니터에서 IP 주소 확인
2. PC/스마트폰 브라우저에서 입력:
   http://[ESP32 IP 주소]
   예) http://192.168.0.15
3. 웹 페이지에 "Hello from ESP32!" 메시지가 표시됩니다.

1. ESP32가 지정된 Wi-Fi에 연결됨
2. 웹서버가 포트 80번에서 대기
3. 클라이언트가 접속 → / 경로 처리
4. 문자열 "Hello from ESP32!" 응답