Files
spore/examples/static_web
..
2025-09-16 10:10:23 +02:00
2025-09-15 20:33:15 +02:00

Static Web Server Example

This example demonstrates how to serve static HTML files from LittleFS using the Spore framework.

Features

  • Serves static files from LittleFS filesystem
  • Beautiful web interface with real-time status updates
  • Responsive design that works on mobile and desktop
  • Automatic API endpoint discovery and status monitoring

Files

  • main.cpp - Main application entry point
  • data/index.html - Web interface (served from LittleFS)

Web Interface

The web interface provides:

  • Node Status - Shows uptime and system information
  • Network Status - Displays WiFi connection status
  • Task Status - Shows active background tasks
  • Cluster Status - Displays cluster membership
  • API Links - Quick access to all available API endpoints

Building and Flashing

# Build the firmware
pio run -e d1_mini_static_web

# Flash to device
pio run -e d1_mini_static_web -t upload

Upload Files to LittleFS

After flashing the firmware, you need to upload the HTML files to the LittleFS filesystem:

# Upload data directory to LittleFS
pio run -e d1_mini_static_web -t uploadfs

Usage

  1. Flash the firmware to your ESP8266 device
  2. Upload the data files to LittleFS
  3. Connect to the device's WiFi network
  4. Open a web browser and navigate to http://<device-ip>/
  5. The web interface will load and display real-time status information

API Endpoints

The web interface automatically discovers and displays links to all available API endpoints:

  • /api/node/status - Node status and system information
  • /api/network/status - Network and WiFi status
  • /api/tasks/status - Task management status
  • /api/cluster/members - Cluster membership
  • /api/node/endpoints - Complete API endpoint list

Customization

To customize the web interface:

  1. Modify data/index.html with your desired content
  2. Add additional static files (CSS, JS, images) to the data/ directory
  3. Re-upload the files using pio run -e d1_mini_static_web -t uploadfs

File Structure

data/
├── index.html          # Main web interface
└── (other static files) # Additional web assets

The StaticFileService automatically serves files from the LittleFS root directory, so any files placed in the data/ directory will be accessible via HTTP.