feat: add full ESP board family support

Add ESP8266, ESP32-C6, ESP32-C2, ESP32-H2 to chip selector with
optgroup layout. Generalize UI text from ESP32-S3-specific to
board-agnostic. Add esptool merge_bin examples for ESP32, ESP32-S3,
and ESP8266.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
root
2026-05-17 05:22:11 +09:00
parent 53c44bd31b
commit cb9df54abb

View File

@@ -37,7 +37,7 @@
</svg> </svg>
ESP32 Web Flasher ESP32 Web Flasher
</a> </a>
<span class="header-badge">ESP32-S3</span> <span class="header-badge">ESP / ESP32</span>
</header> </header>
<!-- ═══════════════════════════════════════════════════════════════ <!-- ═══════════════════════════════════════════════════════════════
@@ -67,8 +67,8 @@
<div class="alert alert-info" style="margin-bottom:16px;"> <div class="alert alert-info" style="margin-bottom:16px;">
<span></span> <span></span>
<div> <div>
ESP32S3를 USB 케이블로 PC에 연결한 후 아래 버튼을 눌러 연결 상태를 확인하세요. ESP 보드를 USB 케이블로 PC에 연결한 후 아래 버튼을 눌러 연결 상태를 확인하세요.
<br><small style="color:var(--text-muted);">내장 USB 포트 또는 USB-UART 변환기 모두 지원</small> <br><small style="color:var(--text-muted);">내장 USB 포트 또는 USB-UART 변환기(CP2102, CH340, FTDI) 모두 지원</small>
</div> </div>
</div> </div>
@@ -138,10 +138,25 @@
<div class="form-group"> <div class="form-group">
<label>칩 패밀리</label> <label>칩 패밀리</label>
<select id="fw-chip"> <select id="fw-chip">
<option value="ESP32-S3" selected>ESP32-S3</option> <optgroup label="ESP32 시리즈">
<option value="ESP32-S2">ESP32-S2</option> <option value="ESP32-S3" selected>ESP32-S3</option>
<option value="ESP32-C3">ESP32-C3</option> <option value="ESP32-S2">ESP32-S2</option>
<option value="ESP32">ESP32</option> <option value="ESP32-S3-BOX">ESP32-S3-BOX</option>
</optgroup>
<optgroup label="ESP32-C 시리즈 (RISC-V)">
<option value="ESP32-C3">ESP32-C3</option>
<option value="ESP32-C6">ESP32-C6</option>
<option value="ESP32-C2">ESP32-C2 (ESP8684)</option>
</optgroup>
<optgroup label="ESP32-H 시리즈 (RISC-V)">
<option value="ESP32-H2">ESP32-H2</option>
</optgroup>
<optgroup label="ESP32 오리지널">
<option value="ESP32">ESP32</option>
</optgroup>
<optgroup label="ESP8266 시리즈">
<option value="ESP8266">ESP8266</option>
</optgroup>
</select> </select>
</div> </div>
@@ -234,7 +249,7 @@
class="btn btn-primary needs-serial" class="btn btn-primary needs-serial"
style="width:100%;justify-content:center;padding:12px;" style="width:100%;justify-content:center;padding:12px;"
> >
ESP32S3 플래시 실행 ⚡ 플래시 실행
</button> </button>
<span slot="unsupported" style="color:var(--danger);font-size:13px;"> <span slot="unsupported" style="color:var(--danger);font-size:13px;">
⚠ 이 브라우저는 Web Serial을 지원하지 않습니다 (Chrome/Edge 필요) ⚠ 이 브라우저는 Web Serial을 지원하지 않습니다 (Chrome/Edge 필요)
@@ -246,7 +261,7 @@
<div style="font-size:12px;"> <div style="font-size:12px;">
<strong>플래시 전 확인 사항:</strong> <strong>플래시 전 확인 사항:</strong>
<ul style="margin:4px 0 0 16px;line-height:1.8;"> <ul style="margin:4px 0 0 16px;line-height:1.8;">
<li>ESP32S3가 USB로 연결되어 있어야 합니다</li> <li>ESP 보드가 USB로 연결되어 있어야 합니다</li>
<li>다른 프로그램(Arduino IDE, esptool)이 해당 포트를 사용 중이면 안 됩니다</li> <li>다른 프로그램(Arduino IDE, esptool)이 해당 포트를 사용 중이면 안 됩니다</li>
<li>플래시 중 USB 케이블을 분리하지 마세요</li> <li>플래시 중 USB 케이블을 분리하지 마세요</li>
<li>일부 보드는 BOOT 버튼을 누른 상태로 연결해야 합니다</li> <li>일부 보드는 BOOT 버튼을 누른 상태로 연결해야 합니다</li>
@@ -288,7 +303,7 @@
<h3 style="font-size:14px;margin-bottom:10px;color:var(--accent);">Arduino IDE에서 .bin 내보내기</h3> <h3 style="font-size:14px;margin-bottom:10px;color:var(--accent);">Arduino IDE에서 .bin 내보내기</h3>
<ol style="font-size:13px;line-height:2;color:var(--text-muted);padding-left:18px;"> <ol style="font-size:13px;line-height:2;color:var(--text-muted);padding-left:18px;">
<li>Arduino IDE 2.x 실행</li> <li>Arduino IDE 2.x 실행</li>
<li>ESP32S3 보드 선택 후 코드 작성</li> <li>사용할 ESP 보드 선택 후 코드 작성</li>
<li><strong>Sketch → Export Compiled Binary</strong></li> <li><strong>Sketch → Export Compiled Binary</strong></li>
<li>스케치 폴더에 <code>.bin</code> 파일 생성됨</li> <li>스케치 폴더에 <code>.bin</code> 파일 생성됨</li>
<li>위 업로드 탭에서 해당 파일 업로드</li> <li>위 업로드 탭에서 해당 파일 업로드</li>
@@ -297,12 +312,23 @@
<div> <div>
<h3 style="font-size:14px;margin-bottom:10px;color:var(--accent);">병합 바이너리(merged.bin) 생성</h3> <h3 style="font-size:14px;margin-bottom:10px;color:var(--accent);">병합 바이너리(merged.bin) 생성</h3>
<pre style="font-size:11px;background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:10px;overflow:auto;color:var(--text-muted);">esptool.py --chip esp32s3 \ <pre style="font-size:11px;background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:10px;overflow:auto;color:var(--text-muted);"># ESP32-S3 / S2 / C3 / C6 / H2
merge_bin \ esptool.py --chip esp32s3 merge_bin \
-o merged.bin \ -o merged.bin \
0x0 bootloader.bin \ 0x0 bootloader.bin \
0x8000 partitions.bin \ 0x8000 partitions.bin \
0x10000 app.bin</pre> 0x10000 app.bin
# ESP32 (오리지널)
esptool.py --chip esp32 merge_bin \
-o merged.bin \
0x1000 bootloader.bin \
0x8000 partitions.bin \
0x10000 app.bin
# ESP8266
esptool.py --chip esp8266 \
-o merged.bin 0x0 app.bin</pre>
<p style="font-size:12px;color:var(--text-muted);margin-top:8px;"> <p style="font-size:12px;color:var(--text-muted);margin-top:8px;">
병합 후 merged.bin 하나만 업로드하면 됩니다. 병합 후 merged.bin 하나만 업로드하면 됩니다.
</p> </p>