io.github.bierlingm/spikes

Registre officiel IA et agents

UI feedback for AI-assisted building. Click elements, rate them, agents triage via MCP.

Installation

Ajoutez ceci à la configuration MCP de votre client (Claude Desktop : claude_desktop_config.json ; Cursor : .cursor/mcp.json ; VS Code et les autres utilisent la même forme « mcpServers »).

NPM package spikes-mcp
Claude Code
claude mcp add spikes -e 'SPIKES_TOKEN=<your spikes_token>' -e 'SPIKES_API_URL=<SPIKES_API_URL>' -- npx -y spikes-mcp@0.4.1
Configuration JSON (Claude Desktop, Cursor, VS Code)
{
    "mcpServers": {
        "spikes": {
            "command": "npx",
            "args": [
                "-y",
                "spikes-mcp@0.4.1"
            ],
            "env": {
                "SPIKES_TOKEN": "<your spikes_token>",
                "SPIKES_API_URL": "<SPIKES_API_URL>"
            }
        }
    }
}

Variables d'environnement

  • SPIKES_TOKEN secret Bearer token for the hosted Spikes API. Required only when using --remote mode against spikes.sh. Local mode reads .spikes/feedback.jsonl and needs no token.
  • SPIKES_API_URL Override the Spikes API base URL. Defaults to https://spikes.sh/api. Useful for self-hosted Spikes workers.

Documentation

Tirée du README du projet sur GitHub, actualisée chaque semaine. Les liens ouvrent GitHub.

Sommaire
  1. / Spikes
  2. What Is This?
  3. Quick Start
  4. CLI Commands
  5. AI Agent Integration
  6. GitHub Action
  7. Widget Attributes
  8. Architecture
  9. Development
  10. Self-Hosting
  11. What's Changed (Recent Overhaul)
  12. Detailed Documentation
  13. Why Spikes
  14. Pricing

/ Spikes

The feedback loop for AI-assisted building

AI can build a prototype in an hour.

Turning feedback into action is still the slow part.

Quick Start · CLI Reference · Widget Docs · Hosted Dashboard · Self-Hosting


What Is This?

Spikes is a feedback tool for AI-assisted development. It lets reviewers leave targeted feedback directly on web pages — no screenshots, no "that button over there", no lost context.

Click any element. Rate it. Comment. Spikes captures the exact CSS selector, bounding box, and page context. Your AI agent gets structured JSON it can act on immediately.

No accounts required. No build step. Works on file://, localhost, anywhere.


Quick Start

1. Install the CLI
curl -fsSL https://spikes.sh/install.sh | sh
# Or: cargo install spikes
2. Initialize your project
spikes init                     # Defaults to hosted spikes.sh
# spikes init --self-host       # Opt out — scaffold a self-hosted config instead

spikes init creates .spikes/config.toml with a [remote] section pointing at https://spikes.sh by default. Pass --self-host (or answer s at the prompt) to skip the hosted defaults.

3. Add the widget to your HTML
spikes inject ./mockups/        # Injects widget script tag (uses configured endpoint)
spikes serve                    # http://localhost:3847
4. Collect and use feedback
spikes list                     # See all feedback
spikes list --json              # Feed to your agent
spikes list --rating no         # Find problems
spikes hotspots                 # Elements with most feedback
spikes resolve <id>             # Mark items done

CLI Commands

CommandDescription
spikes initCreate .spikes/ directory with config (hosted by default; --self-host to opt out)
spikes listList feedback (--json, --page, --reviewer, --rating, --unresolved)
spikes show <id>Show single spike details
spikes exportExport to JSON/CSV/JSONL/Cursor/Claude context
spikes hotspotsElements with most feedback
spikes reviewersList all reviewers
spikes inject <dir>Add/remove widget from HTML files (--endpoint <url> overrides the configured endpoint)
spikes serveLocal dev server (--port, --marked, --cors-allow-origin)
spikes mcp serveStart MCP server for AI agent integration
spikes pull/push/syncSync with remote endpoint
spikes share <dir>Upload to spikes.sh for instant sharing
spikes login/logout/whoamiAuthentication management
spikes upgrade/billingPro tier subscription via Stripe
spikes deploy cloudflareScaffold self-hosted Worker + D1

All commands support --json for scripting. See full CLI reference.

Viewing spikes for a hosted project:

The hosted dashboard at https://spikes.sh/dashboard lists every project you own and lets you drill into individual spikes (filter by page, rating, resolved, toggle resolved inline). Sign in directly in your browser: click Sign in, open the verification page, and confirm via the magic link sent to your email — no CLI required.

You can also hit the JSON API directly with your bearer token ($SPIKES_TOKEN from spikes login):

# GET /me/projects
# List all projects you own (with spike_count + last_activity)
curl -H "Authorization: Bearer $SPIKES_TOKEN" \
  https://spikes.sh/me/projects

# GET /me/projects/:key/spikes
# List spikes for one of your projects (paginated, filterable: page, per_page,
# filter_page, filter_rating, filter_resolved)
curl -H "Authorization: Bearer $SPIKES_TOKEN" \
  "https://spikes.sh/me/projects/my-project/spikes?page=1&per_page=50"

# PATCH /me/projects/:key/spikes/:id
# Toggle the `resolved` flag on one spike
curl -X PATCH -H "Authorization: Bearer $SPIKES_TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"resolved": true}' \
  https://spikes.sh/me/projects/my-project/spikes/<spike_id>

# POST /projects
# Create a new project (user bearer only)
curl -X POST -H "Authorization: Bearer $SPIKES_TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"key": "my-project", "allowed_origins": ["https://example.com"]}' \
  https://spikes.sh/projects

# Single-line variant (copy-paste friendly)
curl -H "Authorization: Bearer $SPIKES_TOKEN" https://spikes.sh/me/projects

All /me/* endpoints are user-scoped: you only ever see projects and spikes you own. Cross-tenant requests return 404 PROJECT_NOT_FOUND (enumeration-proof).

Security note: API keys (sk_spikes_*) and the admin SPIKES_TOKEN are not accepted on /me/* endpoints or POST /projects — those require a user bearer token from spikes login. The POST /spikes collect endpoint enforces a per-project origin allowlist and per-project rate limits; rejected widget requests surface as a small red #spikes-error-dot indicator on the widget button (404 / 403 / 429).


AI Agent Integration

Spikes speaks agent natively. Your AI coding assistant can read, write, and manage feedback without ever leaving its workflow.

npx spikes-mcp            # Zero-install MCP server — just works
# or: spikes mcp serve    # If you have the CLI installed
MCP Server — 16 Tools

spikes mcp serve starts a Model Context Protocol server that exposes 16 tools:

ToolPurpose
get_spikesList feedback with filters (page, rating, unresolved, url_prefix, since)
get_element_feedbackGet feedback for a specific CSS selector
get_hotspotsFind elements with the most feedback
submit_spikeCreate feedback programmatically
resolve_spikeMark feedback as addressed
delete_spikeRemove a spike
create_shareUpload files, get a shareable URL
list_sharesSee your active shares
get_usageCheck usage stats, limits, and spend
reply_to_spikeAnswer a reviewer on the page, optionally with a status and version (hosted)
set_spike_statusMark a spike open, addressed, or won't do (hosted)
list_versions / add_versionDeclare review versions and see counts per version (hosted)
list_questions / ask_question / get_question_answersAsk reviewers questions and read answers (hosted)

Supports stdio and HTTP transports, local and remote data modes:

spikes mcp serve                              # stdio, local JSONL
spikes mcp serve --remote                     # stdio, hosted API
spikes mcp serve --transport http --port 3848 # HTTP for sandboxed agents
API Keys

Agents get their own identity. No email, no magic link, no human step:

spikes auth create-key --name "my-agent"   # → sk_spikes_...
spikes auth list-keys                       # See all keys
spikes auth revoke-key <key_id>            # Revoke

Keys support read/write/full scopes and optional budget caps.

Agent-Tier Billing

Consumption-based pricing for agent-scale usage. Pay per spike, not per seat:

spikes usage    # See current spend and limits

Budget enforcement returns 429 BUDGET_EXCEEDED when caps are hit — agents can check before they burn.

Context Exports

Export structured markdown optimized for agent consumption:

spikes export --format cursor-context > cursor-feedback.md
spikes export --format claude-context > claude-feedback.md
Discovery
  • llms.txt — All 9 MCP tools, parameters, agent quickstart
  • agents.md — Machine-readable landing page for agents
  • Smithery — Listed in the MCP server registry
  • spikes mcp install — Generates config for Claude Desktop / Cursor

Full details: llms.txt · agents.md


GitHub Action

Gate CI on feedback quality. The spikes-action fails builds when unresolved negative feedback exceeds your threshold.

name: CI
on: [push, pull_request]

jobs:
  feedback-gate:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: bierlingm/spikes/action@v0.3.1
        with:
          threshold: 0           # Fail if any blocking spikes
          ignore-paths: ""     # Optional: pages to ignore
          require-resolution: false

See action/README.md for full documentation.


Widget Attributes

Simple setup — just add your project key and you're ready to collect feedback:

<script src="https://spikes.sh/spikes.js" data-project="my-app"></script>

When you set data-project, feedback syncs automatically to https://spikes.sh/spikes. No need to configure an endpoint unless you're self-hosting.

Full configuration — all available attributes:

<script src="https://spikes.sh/spikes.js"
  data-project="my-app"
  data-position="bottom-right"
  data-color="#e74c3c"
  data-theme="dark"
  data-reviewer="Pat"
  data-collect-email="true"
  data-admin="true">
</script>

Self-hosting — point to your own backend:

<script src="/spikes.js"
  data-project="my-app"
  data-endpoint="https://my-worker.workers.dev/spikes">
</script>
AttributeDescriptionDefault
data-projectGroup feedback by project keylocation.hostname
data-positionButton corner: bottom-right, bottom-left, top-right, top-leftbottom-right
data-colorAccent color (any CSS color)#e74c3c
data-themeModal theme: dark or lightdark
data-reviewerPre-set reviewer name(prompts user)
data-endpointBackend URL for multi-reviewer sync. Optional — defaults to https://spikes.sh/spikes when data-project is set.https://spikes.sh/spikes (with data-project), /spikes (local dev)
data-collect-emailShow email field in promptfalse
data-adminEnable review mode featuresfalse
data-offset-x/yButton offset from edge—

See Widget Attributes Reference for complete documentation.


Architecture

Spikes has three components that work together or standalone:

┌─────────────┐     ┌─────────────┐     ┌─────────────┐
│   CLI       │────▶│   Widget    │◄────│   Worker    │
│  (Rust)     │     │  (Vanilla   │     │ (Cloudflare │
│             │     │    JS)      │     │  + D1)      │
└─────────────┘     └─────────────┘     └─────────────┘
     │                                            │
     │          spikes.sh (hosted)                │
     └────────────────────────────────────────────┘

CLI — Rust binary for local development, spike management, and deployment. Stores spikes in ~/.local/share/spikes/.

Widget — 14KB gzipped vanilla JS. Captures element selectors, bounding boxes, ratings, and comments. Works offline via localStorage.

Worker — Optional Cloudflare Worker + D1 backend for multi-reviewer sync, sharing, and hosted deployments. Lives in spikes-hosted/.


Development

CLI
cd cli
cargo build --release
cargo test              # 160+ tests
cargo run -- --help
Widget
cd widget
# Edit src/spikes.js
# Test by running: spikes serve from the project root
Widget Regression Tests

CI suite that catches the silent-data-loss bug class (e.g., widget loaded on a non-allowed origin failing to sync without surfacing the error):

cd tests/widget
npm install
npx playwright install chromium    # one-time
npm test                           # 23 tests: marker checks + happy/reverse/boundary specs (<60s)

Also wired into local agent-ci:

npx agent-ci run --workflow workflows-local/widget.yml
Worker

The Worker backend lives in the private spikes-hosted repo. To test it:

cd ../spikes-hosted/worker
npm test              # Worker test suite (vitest)
npx wrangler dev

Self-Hosting

Want your own backend? One command:

spikes deploy cloudflare    # Creates spikes-worker/ directory
cd spikes-worker && npx wrangler deploy

See Self-Hosting Guide for full setup with D1 database, authentication, and Stripe billing integration.

Share vs. Deploy Cloudflare: Which to Choose?

Use spikes share when you want instant sharing without any setup — files are uploaded to spikes.sh and served from our infrastructure. Great for quick reviews, client feedback, or when you don't want to manage a backend.

Use spikes deploy cloudflare when you need data isolation (feedback stays in your Cloudflare account), a custom domain, or want full control over the infrastructure. Self-hosting requires a Cloudflare account and a one-time deployment setup.


What's Changed (Recent Overhaul)

  • Security: PBKDF2 password hashing, path traversal fixes, XSS protection
  • Auth: Magic link authentication (no passwords to forget)
  • Billing: Stripe integration with Pro tier support
  • Testing: CLI test suite (Rust) + Worker test suite (in ../spikes-hosted/worker)
  • Architecture: Modular worker with clean separation of concerns
  • CI/CD: Automated testing and deployment pipelines

Detailed Documentation


Why Spikes

Zero frictionOne script tag, no signup required, no build step
Works anywherefile://, localhost, any domain
PreciseElement-level feedback with exact CSS selectors
Agent-nativeJSON everywhere, pipes, queryable CLI
Your infrastructureSelf-host or use hosted — your choice
TinyWidget is 14KB gzipped
PrivateNo tracking, your data stays yours

Pricing

Free forever. Pro if you want more.

No accounts required to start. Login when you need Pro features.

FreePro
Price$0 foreverPay what you can
Shares5Unlimited
Spikes per share1,000Unlimited
Widget + CLIFullFull
Self-hostingYesYes
Password protection—Yes
Webhooks—Yes
Badge removal—Yes

MIT licensed. Payment is appreciation, not access.

spikes upgrade when you're ready. No pressure.


Website · Docs · GitHub · Issues

MIT License · Built for builders who work with AI.

Questions fréquentes

Qu'est-ce que io.github.bierlingm/spikes ?

UI feedback for AI-assisted building. Click elements, rate them, agents triage via MCP.

Comment installer io.github.bierlingm/spikes ?

Il s'exécute sur votre machine. Dans Claude Code : claude mcp add spikes -e 'SPIKES_TOKEN=<your spikes_token>' -e 'SPIKES_API_URL=<SPIKES_API_URL>' -- npx -y spikes-mcp@0.4.1. Pour les autres clients, collez la configuration JSON de cette page dans leurs réglages MCP.

Faut-il une clé API pour io.github.bierlingm/spikes ?

Oui. Il attend SPIKES_TOKEN, à renseigner dans sa configuration.

io.github.bierlingm/spikes est-il open source ?

Oui. Son code est sur GitHub sous licence MIT.

Qui maintient io.github.bierlingm/spikes ?

Il est publié par bierlingm. AI.tn le référence sans le maintenir ni le recommander.

Issu du registre MCP officiel. Être listé n'est pas une recommandation : vérifiez le code et les permissions d'un serveur avant de lui donner accès à vos données.