mcpField
F
Faster Fixes

Faster Fixes

Local
faster-fixes.comDeveloper Tools43Updated 2d ago

About Faster Fixes

Faster Fixes is an open-source feedback pipeline that turns client comments left on a website into structured bug reports. It is aimed at development teams delivering web projects to clients. Feedback can be reviewed in a dashboard or consumed directly by a coding agent through MCP.

Key features

  1. 01Feedback widget with automatic context capture
  2. 02Screenshot, page URL and DOM selector capture
  3. 03Dashboard and Markdown export
  4. 04MCP server for reading and updating feedback
  5. 05GitHub issue integration

Use cases

  1. 01Collecting visual client feedback during web review
  2. 02Letting a coding agent fetch feedback and mark it resolved

MCP support

The project ships the @fasterfixes/mcp MCP server, which exposes list_feedbacks and update_feedback_status tools to clients such as Claude Code, Cursor, VS Code, Windsurf, Codex and Zed.

Configuration

Local server config is the same for every client. Copy it into your client’s MCP config file.

mcp.json · Universal config
{
"mcpServers": {
"faster-fixes": {
"command": "npx",
"args": [
"-y",
"@fasterfixes/mcp"
],
"env": {
"FASTER_FIXES_TOKEN": "<FASTER_FIXES_TOKEN>",
"FASTER_FIXES_PROJECT": "<FASTER_FIXES_PROJECT>"
}
}
}
}
Run commandnpx -y @fasterfixes/mcp
Environment variables to set
FASTER_FIXES_TOKENSecret
FASTER_FIXES_PROJECT

Local servers need a runtime on your machine (e.g. Node.js 18+). Config file locations differ by client; see your client’s docs.

Packages
npm@fasterfixes/mcp

Tools

3

Saved tool list · updated 3w ago

ParameterTypeRequiredDescription
formatenumNoResponse format. Use markdown for readable outputjson | markdown
statusenumNoFilter by feedback statusnew | in_progress | resolved | closed
page_urlstringNoFilter by the page URL where feedback was submitted

Details

From the project README

/fasterfixes

Turn messy client feedback into agent-ready bug reports.

Website  •  Docs  •  Twitter

@fasterfixes/widget on npm   @fasterfixes/react on npm   @fasterfixes/vue on npm   @fasterfixes/angular on npm   @fasterfixes/svelte on npm   @fasterfixes/mcp on npm   License


About

During the review phase of a web project, clients send feedback through WhatsApp messages, scattered screenshots, and vague descriptions with no link to the page. Developers then spend time deciphering what was meant, finding the right page, and turning it into something actionable.

Faster Fixes replaces that workflow. Clients leave feedback directly on the website through a lightweight widget. The system captures the full context automatically — screenshot, page URL, DOM selector, browser metadata, and React component tree when available. Developers consume that feedback from a dashboard or directly from their AI coding agent via MCP.

The goal is a short path from client comment to resolved fix:

client feedback → structured context → AI agent fixes it

How It Works

1. Collect feedback with the widget

Add the widget to any website: WordPress, Webflow, static HTML, or an app built with any framework. Paste one tag, replacing the Project ID with your own:

<script
  src="https://cdn.jsdelivr.net/npm/@fasterfixes/widget@1/dist/widget.iife.js"
  data-project-id="proj_your_project_id"
  defer
></script>

In a React application, use the React embed instead. It mounts the same widget:

import { FeedbackProvider } from "@fasterfixes/react";

function App() {
  return (
    <FeedbackProvider projectId="proj_your_project_id">
      <YourApp />
    </FeedbackProvider>
  );
}

In a Vue or Nuxt application, use the Vue embed:

import { createFasterFixes } from "@fasterfixes/vue";

createApp(App)
  .use(createFasterFixes({ projectId: "proj_your_project_id" }))
  .mount("#app");

In an Angular or Analog application, use the Angular embed:

import { provideFasterFixes } from "@fasterfixes/angular";

export const appConfig: ApplicationConfig = {
  providers: [provideFasterFixes({ projectId: "proj_your_project_id" })],
};

In a Svelte or SvelteKit application, use the Svelte embed in the root component or layout:

<script lang="ts">
  import { initFasterFixes } from "@fasterfixes/svelte";

  initFasterFixes({ projectId: "proj_your_project_id" });
</script>

Clients click anywhere on the page to leave feedback. The widget captures the screenshot, element selector, browser info, and the React component tree on React sites automatically, with no setup required from the client. See the script embed, React, Vue, Angular and Svelte docs.

2. Review feedback on the dashboard

Open the Faster Fixes dashboard to see all feedback items organized by project and page. Each item includes the client's comment alongside the captured context. Copy any item as a structured markdown report, ready to paste into your AI coding agent.

3. Or let your agent handle it via MCP

Connect the Faster Fixes MCP server to your editor. Your AI coding agent can fetch new feedback, read the full context, locate the relevant code, fix the issue, and mark it as resolved — without leaving the terminal.

claude mcp add faster-fixes -s project \
  --env FASTER_FIXES_TOKEN=ff_agent_xxx \
  --env FASTER_FIXES_PROJECT=proj_xxx \
  -- npx -y @fasterfixes/mcp

The MCP server works with Claude Code, Cursor, VS Code, Windsurf, Codex, and Zed.

Features

  • Visual feedback widget — clients click on elements to leave feedback, no training needed
  • Automatic context capture — screenshot, page URL, DOM selector, component tree, browser info
  • Developer dashboard — organized view of all feedback across projects
  • Markdown export — copy any feedback item as a structured bug report for AI agents
  • MCP server — AI coding agents fetch and resolve feedback programmatically
  • Agent skill — install as a skill for autonomous feedback-to-fix workflows
  • GitHub integration — automatically create issues from feedback items
  • Team collaboration — organizations, projects, and role-based access
  • Review links — share a link with clients so they can leave feedback without an account

Packages

This monorepo publishes seven npm packages:

PackageDescriptionInstall
@fasterfixes/widgetFeedback widget for any websiteScript tag or npm install @fasterfixes/widget
@fasterfixes/reactReact embed of the widgetnpm install @fasterfixes/react
@fasterfixes/vueVue embed of the widgetnpm install @fasterfixes/vue
@fasterfixes/angularAngular embed of the widgetnpm install @fasterfixes/angular
@fasterfixes/svelteSvelte embed of the widgetnpm install @fasterfixes/svelte
@fasterfixes/coreFramework-agnostic client librarynpm install @fasterfixes/core
@fasterfixes/mcpMCP server for AI coding agentsnpx -y @fasterfixes/mcp

MCP Setup

The MCP server exposes two tools: list_feedbacks and update_feedback_status. It connects to the Faster Fixes API using an organization-scoped agent token.

Claude Code

Add to your .mcp.json:

{
  "mcpServers": {
    "faster-fixes": {
      "command": "npx",
      "args": ["-y", "@fasterfixes/mcp"],
      "env": {
        "FASTER_FIXES_TOKEN": "ff_agent_your_token_here",
        "FASTER_FIXES_PROJECT": "proj_your_project_id"
      }
    }
  }
}
Cursor

Add to .cursor/mcp.json:

{
  "mcpServers": {
    "faster-fixes": {
      "command": "npx",
      "args": ["-y", "@fasterfixes/mcp"],
      "env": {
        "FASTER_FIXES_TOKEN": "ff_agent_your_token_here",
        "FASTER_FIXES_PROJECT": "proj_your_project_id"
      }
    }
  }
}
VS Code (GitHub Copilot)

Add to .vscode/mcp.json:

{
  "servers": {
    "faster-fixes": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@fasterfixes/mcp"],
      "env": {
        "FASTER_FIXES_TOKEN": "ff_agent_your_token_here",
        "FASTER_FIXES_PROJECT": "proj_your_project_id"
      }
    }
  }
}
Windsurf

Add to ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "faster-fixes": {
      "command": "npx",
      "args": ["-y", "@fasterfixes/mcp"],
      "env": {
        "FASTER_FIXES_TOKEN": "ff_agent_your_token_here",
        "FASTER_FIXES_PROJECT": "proj_your_project_id"
      }
    }
  }
}
Codex

Add to .codex/config.toml:

[mcp_servers.faster-fixes]
command = "npx"
args = ["-y", "@fasterfixes/mcp"]

[mcp_servers.faster-fixes.env]
FASTER_FIXES_TOKEN = "ff_agent_your_token_here"
FASTER_FIXES_PROJECT = "proj_your_project_id"
Zed

Add to ~/.config/zed/settings.json:

{
  "context_servers": {
    "faster-fixes": {
      "command": "npx",
      "args": ["-y", "@fasterfixes/mcp"],
      "env": {
        "FASTER_FIXES_TOKEN": "ff_agent_your_token_here",
        "FASTER_FIXES_PROJECT": "proj_your_project_id"
      }
    }
  }
}

You can find your agent token and project ID in Organization Settings on the dashboard.

Built With

License

This repository is licensed under the GNU AGPLv3 License.

The widget packages (@fasterfixes/widget, @fasterfixes/react, @fasterfixes/vue, @fasterfixes/angular, @fasterfixes/svelte, @fasterfixes/core) and the MCP server (@fasterfixes/mcp) are licensed under MIT for unrestricted use in your applications.

Comments

Markdown supported

New to MCP?

From what the protocol is to installing your first server, these answers cover most first questions.

An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.