byun/webflash
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add full ESP board family support

Browse Source 
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
1 changed files with 39 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
frontend/index.html
View File

@@ -37,7 +37,7 @@
</svg>
ESP32 Web Flasher
</a>
<span class="header-badge">ESP32-S3</span>
<span class="header-badge">ESP / ESP32</span>
</header>
<!-- ═══════════════════════════════════════════════════════════════
@@ -67,8 +67,8 @@
<div class="alert alert-info" style="margin-bottom:16px;">
<span>ℹ</span>
<div>
ESP32S3를 USB 케이블로 PC에 연결한 후 아래 버튼을 눌러 연결 상태를 확인하세요.
<br><small style="color:var(--text-muted);">내장 USB 포트 또는 USB-UART 변환기 모두 지원</small>
ESP 보드를 USB 케이블로 PC에 연결한 후 아래 버튼을 눌러 연결 상태를 확인하세요.
<br><small style="color:var(--text-muted);">내장 USB 포트 또는 USB-UART 변환기(CP2102, CH340, FTDI) 모두 지원</small>
</div>
</div>
@@ -138,10 +138,25 @@
<div class="form-group">
<label>칩 패밀리</label>
<select id="fw-chip">
<option value="ESP32-S3" selected>ESP32-S3</option>
<option value="ESP32-S2">ESP32-S2</option>
<option value="ESP32-C3">ESP32-C3</option>
<option value="ESP32">ESP32</option>
<optgroup label="ESP32 시리즈">
<option value="ESP32-S3" selected>ESP32-S3</option>
<option value="ESP32-S2">ESP32-S2</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>
</div>
@@ -234,7 +249,7 @@
class="btn btn-primary needs-serial"
style="width:100%;justify-content:center;padding:12px;"
>
⚡ ESP32S3 플래시 실행
⚡ 플래시 실행
</button>
<span slot="unsupported" style="color:var(--danger);font-size:13px;">
⚠ 이 브라우저는 Web Serial을 지원하지 않습니다 (Chrome/Edge 필요)
@@ -246,7 +261,7 @@
<div style="font-size:12px;">
<strong>플래시 전 확인 사항:</strong>
<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>플래시 중 USB 케이블을 분리하지 마세요</li>
<li>일부 보드는 BOOT 버튼을 누른 상태로 연결해야 합니다</li>
@@ -288,7 +303,7 @@
<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;">
<li>Arduino IDE 2.x 실행</li>
<li>ESP32S3 보드 선택 후 코드 작성</li>
<li>사용할 ESP 보드 선택 후 코드 작성</li>
<li><strong>Sketch → Export Compiled Binary</strong></li>
<li>스케치 폴더에 <code>.bin</code> 파일 생성됨</li>
<li>위 업로드 탭에서 해당 파일 업로드</li>
@@ -297,12 +312,23 @@
<div>
<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 \
merge_bin \
<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
esptool.py --chip esp32s3 merge_bin \
-o merged.bin \
0x0 bootloader.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;">
병합 후 merged.bin 하나만 업로드하면 됩니다.
</p>