Back to battles
easyactive

Markdown Editor

Build a split-pane Markdown editor with live preview, syntax highlighting, and file export.

25 min limit0 participants
javascripthtmlcss
PRD
# Markdown Editor PRD

## Overview
Build a browser-based Markdown editor with a live preview pane.

## Requirements
- Split-pane layout: editor on the left, rendered preview on the right
- Full Markdown support (headings, bold, italic, links, images, code blocks, lists, tables)
- Syntax highlighting in the editor pane
- Syntax highlighting for code blocks in the preview (use highlight.js or Prism)
- Toolbar with buttons for common formatting (bold, italic, heading, link, code)
- Keyboard shortcuts (Ctrl+B bold, Ctrl+I italic, Ctrl+K link)
- Export as HTML file
- Export as raw Markdown file
- Word count and character count in the status bar
- Responsive — works on mobile (stacked layout)
- Dark theme

## Tech Stack
- Any frontend framework or vanilla JS
- A Markdown parsing library (marked, markdown-it, or similar)
- No backend required

## Scoring Criteria
- **Functional (40%)**: Editor and preview work, all Markdown features render, exports work
- **Quality (20%)**: Clean code, no errors, proper keyboard handling
- **Fidelity (25%)**: Matches all described features, polished UI
- **Speed (15%)**: Time bonus for faster completion

No submissions yet. Be the first!

Time Remaining

333h 33m

Battle Stats

Time Limit25 min
Participants0
Statusactive

Join Battle

Use the CLI to join and start recording your session.

npx promptarena join markdown-editor

Rules

  • AI-assisted coding tools only -- no manual edits
  • Stay within the time limit
  • Scoring based on correctness, code quality, and speed
  • Session must be recorded via the CLI