← 전체 히스토리
PHASE 3

ESP32 집 온습도 모니터링

ESP32 보드와 온습도 센서로 집 안 온도·습도를 측정해 Raspberry Pi에 모으고, 내 기기에서만 볼 수 있는 대시보드를 만든다.

마지막 업데이트: 2026-10-05 02:40 KST

이 단계의 결과물

목차
    #19 새 단계 시작: ESP32 온습도 모니터링 — 부품·구매처·설계 완료 지시 2026-10-05 02:11 KST → 완료 2026-10-05 02:14 KST

    지시 (원문)

    phase3. ESP32 보드 이용한 집 온습도 모니터링 대쉬보드 구축 프로젝트를 구현하려한다. 물품 구매처 알려줘.

    분석 (Claude가 이해한 내용)

    • 새 주제 → Phase 3 시작. 하드웨어(ESP32·센서)가 아직 없으므로 먼저 무엇을 어디서 살지와 전체 구성을 정함.
    • 부품 선택 기준: 처음 하는 사람도 납땜 없이 바로 연결할 수 있고, 자료가 많고, 측정이 정확할 것.
      • 보드: ESP32-DevKitC(핀헤더 장착, 자료 최다). 작게 만들려면 ESP32-C3 SuperMini.
      • 센서: SHT40/SHT31(I2C, 약 ±0.2°C). 흔히 쓰는 DHT22는 오차가 크고 통신이 불안정해 제외.
    • 구성: ESP32가 1분마다 Wi-Fi로 Pi에 측정값 전송 → Pi가 저장(SQLite) → 대시보드. 집 온습도는 생활 패턴(재실 여부 등)을 드러낼 수 있어 인터넷에 공개하지 않음 — 대시보드는 Pi와 Tailscale에서만, 수집은 집 Wi-Fi에서 받기만.
    • 환경 확인 결과 반영:
      • Pi는 5GHz Wi-Fi에 연결돼 있는데 ESP32는 대부분 2.4GHz만 지원 → 공유기 2.4GHz 대역 필요 (준비물 주의사항에 명시)
      • ESP32 개발 도구는 아직 없음 → 구현 단계에서 설치. Pi 쪽은 Node 내장 SQLite를 쓸 수 있어 추가 설치 불필요. Pi에서 USB로 펌웨어 업로드 가능한 권한 확인.
    • 부품이 오기 전에도 진행 가능하도록 순서 설계: Pi 쪽(수집·저장·대시보드)과 펌웨어를 먼저 만들고 ESP32를 흉내 내는 시뮬레이터로 테스트 → 부품 도착 후 배선·업로드·보정.

    작업 과정

    1. 02:12Pi 환경 확인 — ESP32 도구(arduino-cli·PlatformIO·esptool) 미설치, Node 내장 SQLite 사용 가능, Pi Wi-Fi 대역 5GHz, USB 시리얼 권한 있음.
    2. 02:13부품 목록(필수/선택, 추천 이유), 구매처, 배선표, 주의사항, 시스템 구성도, 진행 순서를 설계 문서로 정리해 캡처.
    3. 02:14문서의 "필수/선택" 표시가 세로로 줄바꿈되는 문제 수정 후 재캡처.
    4. 02:15Phase 3 페이지(history-p3.html) 생성, Phase 2 상태를 "완료"로 변경하고 단계 간 링크 연결.

    결과 / 증거

    • 방 1곳 기준 준비물: ESP32-DevKitC, SHT40(또는 SHT31) 모듈, 점퍼선, 데이터용 USB 케이블, USB 5V 어댑터 (+선택: 브레드보드, OLED, 케이스).
    • 구매처: 국내 — 디바이스마트, 엘레파츠, 아이씨뱅큐, 메카솔루션, 쿠팡 / 해외 — 알리익스프레스. 국내 기준 대략 2~4만 원 (판매처마다 다름).
    Phase 3 설계와 준비물
    20261005_021407_phase3_design.png — 시스템 구성, 준비물·구매처, 배선, 주의사항, 진행 순서
    #20 부품 없이 먼저 구현: 통신 규약 · 수집 서버 · 대시보드 · 펌웨어 · 시뮬레이터 완료 지시 2026-10-05 02:17 KST → 완료 2026-10-05 02:40 KST

    지시 (원문)

    그래 진행해줘. 단 추후 보드 및 실제 센서 연결 시 인터페이스 문제 없도록.
    계속 진행.

    (두 번째 지시는 작업 중 세션이 끊긴 뒤 이어서 진행하라는 지시)

    분석 (Claude가 이해한 내용)

    • 부품이 오기 전에 Pi 쪽과 ESP32 프로그램을 만들되, 나중에 실제 보드·센서를 연결했을 때 서로 맞지 않는 일이 없게 할 것.
    • "인터페이스 문제"가 생기는 세 지점을 각각 막는 방식으로 설계:
      • ESP32 ↔ Pi 데이터 형식 — 먼저 통신 규약(계약)을 문서 + 올바른/잘못된 예시 파일로 고정하고, 서버·펌웨어·시뮬레이터가 모두 이를 따름. 펌웨어가 실제로 만드는 데이터를 서버 검증기에 넣어 통과하는지 자동 확인.
      • ESP32 ↔ 센서 — 라이브러리 대신 Sensirion 데이터시트대로 직접 통신, SHT4x/SHT3x 둘 다 자동 감지(어느 쪽을 사도 동작). 측정값 변환식·오류 검출(CRC)을 데이터시트 예시값으로 테스트.
      • 코드 ↔ 실제 보드 — 실제 ESP32 컴파일러로 ESP32-DevKitC와 ESP32-C3 모두 빌드 확인 (보드별 핀 자동 선택).
    • 실사용에서 생길 일을 규약에 미리 반영: Wi-Fi가 끊긴 동안 측정값 보관 후 한꺼번에 전송, ESP32에 시계가 없어도 측정 시각 계산(age_s), 재전송·재부팅 시 중복 저장 방지, 센서 고장 시 상태만 보고.
    • 보안·개인정보: 집 데이터와 Wi-Fi 비밀번호·기기 토큰은 프로젝트 폴더 밖에만 저장. 수집 API는 집 Wi-Fi 안에서만, 기기별 토큰이 있어야 받고, 대시보드는 Pi와 VPN에서만 열림. 토큰은 화면에 출력하지 않음.

    작업 과정

    1. 02:18환경 확인 후 ESP32 개발 도구(Arduino CLI + ESP32 코어) 설치를 백그라운드로 시작 (용량이 커서 다른 작업과 병행).
    2. 02:19통신 규약 climate/PROTOCOL.md 작성 — 요청 형식, 필드별 범위, 응답 코드별 기기 동작(삭제/재시도/개수 줄이기), 중복 처리. 올바른 예시 6개·잘못된 예시 12개 생성.
    3. 02:20서버 작성 — 규약 검증기(protocol.js), SQLite 저장(db.js, Node 내장), 수집·대시보드 서버(server.js, 수집과 대시보드를 서로 다른 접속 범위로 분리), 기기 등록 도구(admin.js, 토큰은 해시만 저장).
    4. 02:21서버 테스트 5개 작성·실행 → 계약 테스트 2개 통과, 서버 테스트 3개 실패: ① 서버가 실제로 대기하기 전에 "준비 완료"를 출력하는 문제 ② 너무 큰 요청을 바로 끊어 버려 기기가 "개수 줄여서 재시도"(규약) 응답을 못 받는 문제 → 둘 다 수정 후 5개 모두 통과.
    5. 02:22펌웨어 작성 — Arduino 비의존 부분(sht.h 센서 변환·CRC, ringbuf.h 끊김 대비 버퍼, payload.h 전송 데이터·응답 처리)과 Arduino 부분(esp32-climate.ino: Wi-Fi, I2C 센서 자동 감지·재탐색, 1분 주기 측정·전송).
    6. 02:25[중단] 작업 중 세션이 끊김 → "계속 진행." 지시로 재개. 끊기기 직전 저장한 펌웨어 파일이 완전한지 확인하고, 백그라운드 설치가 계속 진행 중임을 확인한 뒤 이어서 작업.
    7. 02:28펌웨어 호스트 테스트(host-test) — 위 Arduino 비의존 코드를 Pi에서 컴파일해 46개 항목 검사 (데이터시트 CRC 예시, 변환식, 버퍼 넘침, 49.7일 후 시간 카운터 넘어감, 오래된 값 처리 등) + 펌웨어가 만든 데이터 4종을 서버 검증기에 통과시킴 → 첫 실행에 모두 통과.
    8. 02:29보드용 스크립트 — build.sh(컴파일 확인), flash.sh(실제 업로드: Wi-Fi 비밀번호·토큰은 임시 폴더에서만 사용 후 삭제).
    9. 02:30시뮬레이터(sim.js: 펌웨어와 똑같이 동작 + 끊김·재부팅·센서 고장 시나리오), 테스트 DB 채우기(seed.js: 실제 DB는 건드리지 못하게 막음).
    10. 02:30대시보드 작성 — 시각화 지침에 따라: 방별 숫자 타일(현재 온습도·이슬점·24시간 최저/최고·상태는 아이콘+글자), 온도와 습도는 단위가 달라 차트를 분리(한 차트에 축 2개 금지), 방마다 고정 색(색약 검사 도구로 밝은/어두운 모드 모두 통과 확인), 선 끝 이름표, 모든 방 값을 보여주는 툴팁, 표 보기, 어두운 모드.
    11. 02:31통합 시험 — 별도 시험용 서버에 7일치 데이터를 채우고 시뮬레이터 3대 가동: 침실 Wi-Fi 끊김(버퍼 4개 → 복구 후 5개 한꺼번에 전송, 손실 0), 거실 재부팅(새 부팅 ID로 정상 저장), 서재 센서 고장(상태만 보고 → 대시보드 "센서 오류").
    12. 02:32ESP32 코어 설치 완료 → 실제 ESP32 컴파일러로 빌드 성공: ESP32-DevKitC(프로그램 79%, 메모리 21%), ESP32-C3(85%, 17%), 경고 없음.
    13. 02:33대시보드 캡처 점검 → 문제 2개 발견: ① 시뮬레이터가 이미 끝난 뒤 찍어 모든 방이 "연결 끊김" ② 채운 데이터와 시뮬레이터의 기후 모델이 달라 그래프 끝이 튐 → 모델을 공용 파일로 합치고, 시뮬레이터를 켠 상태로 재촬영. 7일 보기·툴팁 촬영을 위해 스크린샷 도구가 비동기 동작을 기다리도록 개선.
    14. 02:37전체 테스트 스크립트 climate/test.sh와 부품 도착 후 절차·문제 해결표를 담은 climate/README.md 작성. 첫 실행에서 테스트 경로 지정 방식 오류(게임 때와 같은 문제) → 수정 후 전체 통과.

    결과 / 증거

    • 전체 테스트 통과: 서버·계약 5개, 펌웨어 46개 항목, 펌웨어 ↔ 서버 상호 검증 4종, ESP32·ESP32-C3 빌드.
    • 부품이 오면: 배선 → 기기 등록 → Wi-Fi 정보 입력 → flash.sh로 업로드 (README에 단계별 정리).
    • 대시보드 화면은 모두 시뮬레이션 데이터. 실제 집 데이터는 기록·공개하지 않음.
    • 참고: 그래프 오른쪽 끝의 작은 단차는 시험 데이터(7일치 채움)와 실시간 시뮬레이션의 무작위 변동 시작값 차이로 생긴 것으로, 실제 센서 데이터에서는 생기지 않음.
    전체 테스트 결과
    20261005_023848_climate_tests.png — 전체 테스트: 서버·계약, 펌웨어 호스트 테스트·상호 검증, ESP32/ESP32-C3 실제 빌드
    대시보드 24시간
    20261005_023528_climate_dashboard_24h.png — 대시보드 (시뮬레이션 데이터): 방별 현재값·상태(서재는 센서 고장 시나리오), 온도·습도 24시간
    대시보드 7일과 툴팁
    20261005_023545_climate_dashboard_7d.png — 7일 보기와 툴팁 (한 시점의 세 방 값을 함께 표시)
    모바일 화면
    20261005_023601_climate_dashboard_mobile.png — 휴대폰 화면