목적에 맞는 시작 경로

처음이라면 웹끼리 메시지 주고받기부터 시작하세요. 보드 없이 한 컴퓨터에서 확인할 수 있습니다. 코드 몇 줄로 원리를 먼저 배우려면 5분 빠른 시작을 선택하세요.

만들고 싶은 것	준비물	첫 성공의 기준
웹끼리 메시지 주고받기	Node.js·npm, 브라우저	두 탭 사이에 같은 메시지 표시
웹에서 ESP32 제어하기	ESP32, LED·저항, Wi-Fi, Arduino IDE	버튼 명령에 LED가 반응하고 상태 수신
내 서버 운영 시작하기	Node.js·npm, 터미널 3개	내 서버를 거쳐 송신자에서 수신자로 전달

웹끼리 메시지 주고받기

1. 실행 예제 묶음에서 Vanilla 예제를 내려받습니다.
2. 해당 폴더에서 npm ci, npm run dev를 실행합니다. 웹 서버와 IOSignal 서버가 함께 시작됩니다.
3. http://localhost:5175를 두 탭에서 엽니다. 두 탭 모두 ready와 CID가 표시된 뒤 메시지를 보냅니다.
4. 상대 탭에 메시지가 나타나면 성공입니다. 채팅 코드의 흐름을 읽거나 같은 묶음의 React·Svelte 예제로 확장하세요.

막혔다면: 화면이 안 열리면 설치·실행 진단, 화면은 열리지만 연결되지 않으면 연결 진단, 메시지만 안 보이면 수신 진단으로 이동하세요.

웹에서 ESP32 제어하기

1. 보드별 예제에서 보드와 핀을 확인합니다.
2. ESP32 한 대를 CID로 제어하기의 준비·배선·업로드를 진행합니다.
3. 시리얼 모니터의 READY CID:를 확인하고, 웹 실습실과 보드를 같은 서버에 연결합니다.
4. 웹에서 장치를 찾아 on·off를 보냅니다. LED 반응과 장치CID@$state 보고가 일치하면 성공입니다.
5. 다음은 두 대의 그룹 제어입니다.

Arduino 스케치는 위 실습이 지정한 라이브러리 예제를 사용합니다. 웹 채팅 묶음에 ESP32 스케치가 들어 있는 것은 아닙니다.

막혔다면: 장치 검색·출력 진단을 순서대로 확인하세요.

내 서버 운영 시작하기

1. Node.js 서버 만들기에서 서버를 실행합니다.
2. 5분 빠른 시작의 수신자와 송신자를 별도 터미널에서 실행합니다.
3. 수신 터미널에 hello#message와 메시지가 표시되면 로컬 전달이 확인된 것입니다.
4. 연결 환경과 서버 주소에서 다른 기기의 주소·포트를 맞춥니다.
5. 외부에 제공하기 전 서버 인증 설정과 연결 암호화를 확인하세요. 로컬 전달 성공만으로 외부 접속·TLS 구성이 검증되는 것은 아닙니다.

막혔다면: 연결 진단부터 확인하세요.