todo-webapp

Deploy a local TODO web app that reads and writes a Markdown TODO.md file. Serves a beautiful dark-themed, glassmorphism UI on the LAN (no HTTPS needed). Features live SSE auto-refresh, click-to-toggle checkboxes, and an "Archive Done" button that moves completed items to TODO-done.md. Auto-starts on boot via launchd (macOS). Use when a user wants a web UI to view and manage their OpenClaw TODO list from any device on their LAN.

Safety Notice

This listing is from the official public ClawHub registry. Review SKILL.md and referenced scripts before running.

Copy this and send it to your AI assistant to learn

Install skill "todo-webapp" with this command: npx skills add jwhowa/todo-webapp

todo-webapp

A zero-dependency Node.js web app that turns your TODO.md into a live, interactive task board.

Preview

What it does

  • Serves a dark glassmorphism UI at http://<hostname>.local:3456 (LAN only)
  • Reads TODO.md directly — ## headings become section cards, ### become subheadings, - [ ]/- [x] become clickable items
  • Live updates via Server-Sent Events: any change to TODO.md (by the agent or anyone else) pushes instantly to all open browser tabs
  • Click to toggle: checking an item off saves immediately to TODO.md
  • Archive Done button: moves all [x] items to TODO-done.md with a date stamp and removes them from TODO.md
  • Auto-starts on boot and self-restarts on crash via macOS launchd

Setup

1. Copy the server script

Copy scripts/server.js to your desired app directory (e.g. ~/.openclaw/workspace/todo-app/server.js).

The server expects:

  • TODO.md at ../TODO.md relative to the script (i.e. one directory up)
  • TODO-done.md at ../TODO-done.md (created automatically if missing)
  • bg.jpg in the same directory as the script (optional background image)

2. Add a background image (optional)

Drop any bg.jpg into the same folder as server.js. It will be rendered at ~22% opacity behind the UI. Works best with abstract or dark imagery.

3. Install the launchd agent

Copy assets/com.todo.plist.template to ~/Library/LaunchAgents/com.todo.plist.

Edit the plist and update these two values:

  • The path to node (run which node to find it)
  • The path to server.js

Then load it:

launchctl load ~/Library/LaunchAgents/com.todo.plist

4. Open in browser

Navigate to http://<your-mac-hostname>.local:3456 from any device on your LAN.

Restart command

If you update server.js, restart with:

kill $(lsof -ti :3456) && sleep 1 && launchctl kickstart -k gui/$(id -u)/com.todo

TODO.md format

The app parses standard OpenClaw-style markdown:

## Section Name

### Subheading

- [ ] Open task
- [x] Completed task
- **Bold text** is rendered in item labels

Any section added to TODO.md appears automatically. No app restart needed.

Port

Default port is 3456. To change it, edit the PORT constant at the top of server.js.

Source Transparency

This detail page is rendered from real SKILL.md content. Trust labels are metadata-based hints, not a safety guarantee.

Related Skills

Related by shared tags or category signals.

General

Neural Memory

Associative memory with spreading activation for persistent, intelligent recall. Use PROACTIVELY when: (1) You need to remember facts, decisions, errors, or...

Registry SourceRecently Updated
General

kai-slide-creator

Create beautiful, zero-dependency HTML presentations that run entirely in the browser — no npm, no build tools. 21 curated style presets with named layout va...

Registry SourceRecently Updated
General

Chronos

通用周期任务管理器 - 支持6种周期类型、每月N次配额、自动cron、统一视图,适用于所有定时任务场景

Registry SourceRecently Updated
General

AIN - AI Node Plugin

Integrates AIN providers into OpenClaw with intelligent model routing and tools for prompt execution and task classification.

Registry SourceRecently Updated