Redesign landing page with conversation example and capability overview
Enriches the splash page from a bare title + 4 cards into a full product page: hero SVG illustration, example detect→flash→verify conversation, tabbed install instructions, supported chips table, and capability summary. Frames content around MCP protocol rather than any specific client.
This commit is contained in:
parent
b2ba0cd67a
commit
58f9b3a4df
119
docs-site/src/assets/hero-chip.svg
Normal file
119
docs-site/src/assets/hero-chip.svg
Normal file
@ -0,0 +1,119 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="none">
|
||||
<!-- PCB substrate background -->
|
||||
<rect x="0" y="0" width="200" height="200" rx="16" fill="#0a1a1f" opacity="0.3"/>
|
||||
|
||||
<!-- PCB trace lines (decorative) -->
|
||||
<g stroke="#134e4a" stroke-width="1" opacity="0.5">
|
||||
<path d="M20 60 L50 60 L58 52"/>
|
||||
<path d="M20 80 L45 80 L58 80"/>
|
||||
<path d="M20 100 L50 100"/>
|
||||
<path d="M20 120 L45 120 L58 120"/>
|
||||
<path d="M20 140 L50 140 L58 148"/>
|
||||
<path d="M142 52 L150 60 L180 60"/>
|
||||
<path d="M142 80 L155 80 L180 80"/>
|
||||
<path d="M150 100 L180 100"/>
|
||||
<path d="M142 120 L155 120 L180 120"/>
|
||||
<path d="M142 148 L150 140 L180 140"/>
|
||||
<path d="M60 20 L60 50"/>
|
||||
<path d="M80 20 L80 45"/>
|
||||
<path d="M100 20 L100 50"/>
|
||||
<path d="M120 20 L120 45"/>
|
||||
<path d="M140 20 L140 50"/>
|
||||
<path d="M60 150 L60 180"/>
|
||||
<path d="M80 155 L80 180"/>
|
||||
<path d="M100 150 L100 180"/>
|
||||
<path d="M120 155 L120 180"/>
|
||||
<path d="M140 150 L140 180"/>
|
||||
</g>
|
||||
|
||||
<!-- Chip body -->
|
||||
<rect x="50" y="50" width="100" height="100" rx="4" fill="#0d9488"/>
|
||||
<!-- Chip body inner bevel -->
|
||||
<rect x="52" y="52" width="96" height="96" rx="3" fill="none" stroke="#14b8a6" stroke-width="0.5" opacity="0.4"/>
|
||||
|
||||
<!-- Chip die (center) -->
|
||||
<rect x="68" y="68" width="64" height="64" rx="2" fill="#042f2e"/>
|
||||
<!-- Die detail lines -->
|
||||
<g stroke="#0d9488" stroke-width="0.5" opacity="0.3">
|
||||
<rect x="72" y="72" width="56" height="56" rx="1"/>
|
||||
<line x1="80" y1="72" x2="80" y2="128"/>
|
||||
<line x1="100" y1="72" x2="100" y2="128"/>
|
||||
<line x1="120" y1="72" x2="120" y2="128"/>
|
||||
<line x1="72" y1="85" x2="128" y2="85"/>
|
||||
<line x1="72" y1="100" x2="128" y2="100"/>
|
||||
<line x1="72" y1="115" x2="128" y2="115"/>
|
||||
</g>
|
||||
|
||||
<!-- Corner identification dot (pin 1 marker) -->
|
||||
<circle cx="77" cy="77" r="2.5" fill="#5eead4"/>
|
||||
|
||||
<!-- Die label -->
|
||||
<text x="100" y="103" text-anchor="middle" font-family="monospace" font-size="7" fill="#5eead4" opacity="0.6">ESP32</text>
|
||||
|
||||
<!-- Pins - Left side (5 pins) -->
|
||||
<g fill="#5eead4">
|
||||
<rect x="36" y="58" width="14" height="4" rx="1"/>
|
||||
<rect x="36" y="72" width="14" height="4" rx="1"/>
|
||||
<rect x="36" y="86" width="14" height="4" rx="1"/>
|
||||
<rect x="36" y="100" width="14" height="4" rx="1"/>
|
||||
<rect x="36" y="114" width="14" height="4" rx="1"/>
|
||||
<rect x="36" y="128" width="14" height="4" rx="1"/>
|
||||
<rect x="36" y="138" width="14" height="4" rx="1"/>
|
||||
</g>
|
||||
|
||||
<!-- Pins - Right side (5 pins) -->
|
||||
<g fill="#5eead4">
|
||||
<rect x="150" y="58" width="14" height="4" rx="1"/>
|
||||
<rect x="150" y="72" width="14" height="4" rx="1"/>
|
||||
<rect x="150" y="86" width="14" height="4" rx="1"/>
|
||||
<rect x="150" y="100" width="14" height="4" rx="1"/>
|
||||
<rect x="150" y="114" width="14" height="4" rx="1"/>
|
||||
<rect x="150" y="128" width="14" height="4" rx="1"/>
|
||||
<rect x="150" y="138" width="14" height="4" rx="1"/>
|
||||
</g>
|
||||
|
||||
<!-- Pins - Top (5 pins) -->
|
||||
<g fill="#5eead4">
|
||||
<rect x="58" y="36" width="4" height="14" rx="1"/>
|
||||
<rect x="72" y="36" width="4" height="14" rx="1"/>
|
||||
<rect x="86" y="36" width="4" height="14" rx="1"/>
|
||||
<rect x="100" y="36" width="4" height="14" rx="1"/>
|
||||
<rect x="114" y="36" width="4" height="14" rx="1"/>
|
||||
<rect x="128" y="36" width="4" height="14" rx="1"/>
|
||||
<rect x="138" y="36" width="4" height="14" rx="1"/>
|
||||
</g>
|
||||
|
||||
<!-- Pins - Bottom (5 pins) -->
|
||||
<g fill="#5eead4">
|
||||
<rect x="58" y="150" width="4" height="14" rx="1"/>
|
||||
<rect x="72" y="150" width="4" height="14" rx="1"/>
|
||||
<rect x="86" y="150" width="4" height="14" rx="1"/>
|
||||
<rect x="100" y="150" width="4" height="14" rx="1"/>
|
||||
<rect x="114" y="150" width="4" height="14" rx="1"/>
|
||||
<rect x="128" y="150" width="4" height="14" rx="1"/>
|
||||
<rect x="138" y="150" width="4" height="14" rx="1"/>
|
||||
</g>
|
||||
|
||||
<!-- Antenna element (top-right, like ESP32 modules) -->
|
||||
<g stroke="#14b8a6" stroke-width="1.5" fill="none" opacity="0.5">
|
||||
<path d="M162 28 L172 28 L172 18 L182 18"/>
|
||||
<path d="M165 32 L175 32 L175 22 L185 22"/>
|
||||
<circle cx="178" cy="14" r="2" fill="#14b8a6" opacity="0.4"/>
|
||||
</g>
|
||||
|
||||
<!-- Solder pads (decorative, corners) -->
|
||||
<g fill="#134e4a" opacity="0.4">
|
||||
<circle cx="38" cy="38" r="3"/>
|
||||
<circle cx="162" cy="38" r="3"/>
|
||||
<circle cx="38" cy="162" r="3"/>
|
||||
<circle cx="162" cy="162" r="3"/>
|
||||
</g>
|
||||
|
||||
<!-- Via holes (decorative) -->
|
||||
<g fill="none" stroke="#0d9488" stroke-width="0.5" opacity="0.3">
|
||||
<circle cx="28" cy="170" r="2"/>
|
||||
<circle cx="172" cy="170" r="2"/>
|
||||
<circle cx="28" cy="30" r="2"/>
|
||||
<circle cx="172" cy="30" r="2"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.5 KiB |
@ -3,23 +3,25 @@ title: mcesptool
|
||||
description: ESP32 and ESP8266 development through Model Context Protocol
|
||||
template: splash
|
||||
hero:
|
||||
tagline: ESP32 and ESP8266 development through Model Context Protocol
|
||||
tagline: Flash firmware, manage partitions, burn eFuses, run diagnostics, and deploy OTA updates on ESP32 and ESP8266 — all through natural language.
|
||||
image:
|
||||
file: ../../assets/hero-chip.svg
|
||||
actions:
|
||||
- text: Get Started
|
||||
link: /tutorials/getting-started/
|
||||
icon: right-arrow
|
||||
- text: Tool Reference
|
||||
- text: Capabilities
|
||||
link: /reference/
|
||||
variant: minimal
|
||||
---
|
||||
|
||||
import { CardGrid, Card } from "@astrojs/starlight/components";
|
||||
import { Card, CardGrid, Tabs, TabItem } from '@astrojs/starlight/components';
|
||||
|
||||
<CardGrid stagger>
|
||||
<Card title="40+ Tools" icon="rocket">
|
||||
Complete ESP development toolkit from chip detection to production
|
||||
programming. Flash firmware, manage partitions, read eFuses, run
|
||||
diagnostics, and deploy OTA updates -- all through natural language.
|
||||
<Card title="47 Capabilities" icon="rocket">
|
||||
From chip detection to production programming — just describe what
|
||||
you need. Flash firmware, manage partitions, read eFuses, run
|
||||
diagnostics, and deploy OTA updates through conversation.
|
||||
</Card>
|
||||
<Card title="Zero Hardware" icon="laptop">
|
||||
Full QEMU emulation lets you flash, debug, and test without physical
|
||||
@ -37,3 +39,107 @@ import { CardGrid, Card } from "@astrojs/starlight/components";
|
||||
require explicit intent.
|
||||
</Card>
|
||||
</CardGrid>
|
||||
|
||||
## Example Conversation
|
||||
|
||||
<div class="conversation-block">
|
||||
|
||||
```
|
||||
You: I just plugged in an ESP32 board. Can you detect it and flash
|
||||
the latest firmware?
|
||||
|
||||
Assistant: I'll scan for connected ESP devices first.
|
||||
|
||||
[Using esp_scan_ports]
|
||||
|
||||
Found 1 device:
|
||||
/dev/ttyUSB0 — USB-SERIAL CH340 (1a86:7523)
|
||||
|
||||
Let me identify the chip.
|
||||
|
||||
[Using esp_detect_chip with port="/dev/ttyUSB0"]
|
||||
|
||||
Detected:
|
||||
Chip: ESP32-D0WD-V3 (rev 3.01)
|
||||
Flash: 4 MB
|
||||
MAC: a0:b7:65:cc:58:c4
|
||||
Crystal: 40 MHz
|
||||
|
||||
Now I'll flash your firmware binary.
|
||||
|
||||
[Using esp_flash_firmware with port="/dev/ttyUSB0",
|
||||
firmware_path="build/app.bin", address="0x10000"]
|
||||
|
||||
Flashing... ████████████████████ 100%
|
||||
Hash verified: a3c7f8...
|
||||
|
||||
Verifying the flash contents match.
|
||||
|
||||
[Using esp_verify_flash with port="/dev/ttyUSB0",
|
||||
firmware_path="build/app.bin", address="0x10000"]
|
||||
|
||||
✓ Flash verified — firmware matches source binary exactly.
|
||||
Device is ready.
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
## Quick Install
|
||||
|
||||
<Tabs>
|
||||
<TabItem label="uvx (recommended)">
|
||||
```bash
|
||||
# Run directly — no install needed
|
||||
uvx mcesptool
|
||||
|
||||
# Or install as a persistent tool
|
||||
uv tool install mcesptool
|
||||
```
|
||||
</TabItem>
|
||||
<TabItem label="From source">
|
||||
```bash
|
||||
git clone https://git.supported.systems/warehack.ing/mcp-esptool
|
||||
cd mcp-esptool
|
||||
uv sync
|
||||
uv run mcesptool
|
||||
```
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
### Add to your MCP client
|
||||
|
||||
```bash
|
||||
# Claude Code
|
||||
claude mcp add mcesptool -- uvx mcesptool
|
||||
|
||||
# Or add to any MCP-compatible client's config:
|
||||
# command: uvx
|
||||
# args: ["mcesptool"]
|
||||
```
|
||||
|
||||
## Supported Chips
|
||||
|
||||
| Chip | Architecture | QEMU Support |
|
||||
|------|-------------|--------------|
|
||||
| ESP32 | Xtensa LX6 | Yes |
|
||||
| ESP32-S2 | Xtensa LX7 | — |
|
||||
| ESP32-S3 | Xtensa LX7 | Yes |
|
||||
| ESP32-C3 | RISC-V | Yes |
|
||||
| ESP32-C6 | RISC-V | — |
|
||||
| ESP8266 | Xtensa L106 | — |
|
||||
|
||||
## Capabilities
|
||||
|
||||
| Category | Count | What you can ask for |
|
||||
|----------|------:|-------------|
|
||||
| Chip Control | 7 | Detect devices, scan ports, reset chips, load firmware to RAM |
|
||||
| Flash Operations | 6 | Flash, read back, erase, backup, multi-flash, verify |
|
||||
| Partitions | 3 | Create OTA layouts, custom partition tables, analyze existing |
|
||||
| Security | 4 | Run security audits, enable flash encryption, read and burn eFuses |
|
||||
| Firmware Builder | 3 | Convert ELF to flashable binaries, analyze firmware images |
|
||||
| OTA Management | 3 | Create update packages, deploy over-the-air, rollback |
|
||||
| Production | 3 | Factory program devices, batch operations, run QC checks |
|
||||
| Diagnostics | 3 | Dump memory, profile performance, generate reports |
|
||||
| QEMU Emulation | 5 | Spin up virtual ESPs, flash them, check status |
|
||||
| Server | 3 | Check server health, list available capabilities |
|
||||
| **Total** | **47** | |
|
||||
|
||||
@ -16,6 +16,17 @@
|
||||
--sl-color-black: #0f172a;
|
||||
}
|
||||
|
||||
/* Conversation example block on splash page */
|
||||
.conversation-block .expressive-code {
|
||||
border: 1px solid color-mix(in srgb, var(--sl-color-accent) 30%, transparent);
|
||||
border-radius: 0.75rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.conversation-block .expressive-code pre {
|
||||
background: color-mix(in srgb, var(--sl-color-accent-low) 50%, var(--sl-color-black)) !important;
|
||||
}
|
||||
|
||||
:root[data-theme="light"] {
|
||||
--sl-color-accent-low: #ccfbf1;
|
||||
--sl-color-accent: #0d9488;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user