Fruitback Docs
fruitback.com GitHub
All the docs

Docs

Documentation

Reviewers pin a note on the element itself. Fruitback attaches the page, the screen size, the CSS selector and, in a React app, the source file, and sends the note to your tracker.

Which one are you?

  • I build the site Install the widget A script tag, npm, a React component or a custom element, on Fruitback Cloud or on your own instance. Public modeTeam mode Install →
  • I run the server Run Fruitback yourself Docker Compose, three containers, five lines of .env. From an empty folder to a first pin in seven steps. Self-hostedDocker Self-host →
  • I review a site Review with the extension Leave notes on a site that ships nothing. The extension asks for access to a site only when you switch it on. Private modeChromeFirefox Get the extension →

Does the site ship anything?

Fruitback runs in three modes. Pick one before you install: it decides what goes on the site and who sees the pins. The three modes compares them.

  • Public The site embeds the widget. Good for a public « report a problem ».
  • Private The site embeds nothing. Good for reviewing a client's site, invisibly.
  • Team The site embeds the widget, dormant. Good for a team reviewing its own staging.

All the docs

How a note travels

The widget talks only to your worker.

  1. The widget, on the page. It runs in a Shadow DOM, so the page and the widget do not change each other's styles. It finds the element again on the next visit.
  2. The worker, on your server or on Fruitback Cloud, in Europe. It keeps the key of the tracker out of the page. PostgreSQL and the console run beside it.
  3. Where the note lands. Linear, GitHub Issues, an HTTPS address of yours, or only the workspace.

The widget is MIT. The server, the console and the extension are AGPL-3.0. The source is on GitHub.