BeClaude

faro-setup

New
1.1kCommunity RegistryGeneralby Grafana Labs

Auto-instrument any web app with Grafana Faro Web SDK. Detects your framework, generates init code, wires it into your entry point, and opens a PR.

Community PluginView Source

Overview

<p align="left"><img src="docs/faro_logo.png" alt="Grafana Faro logo" width="400"></p>

The Grafana Faro Web SDK can instrument frontend JavaScript applications to collect telemetry and forward it to the [Grafana Alloy][grafana-alloy-docs] (with faro receiver integration enabled), to a Grafana Cloud instance or to a custom receiver. Grafana Alloy can then send this data to [Loki][grafana-logs] or [Tempo][grafana-traces].

The repository consists of multiple packages that can be combined depending on your requirements. For a full reference instrumentation of a real-world app, see [grafana/quickpizza][faro-demo] — the canonical Frontend Observability demo, deployed live at quickpizza.grafana-dev.com and instrumented with the current Faro Web SDK, Web Tracing, and Session Replay packages.

Get started

[!NOTE]

For more information, you can find the Faro documentation in the Grafana Cloud docs for Faro.

See [quick start for web applications][faro-quick-start].

Local development

Contributing to the SDK? See [local development][faro-local-dev] for the three supported paths: the in-repo smoke harness, your own Grafana Cloud free-tier stack, or a local Alloy install.

Packages

Core

[@grafana/faro-core][faro-core] is the main package that provides the core functionality of the SDK. The [README.md][faro-core-readme] file provides an overview of the architecture and the API of library.

Web SDK

[@grafana/faro-web-sdk][faro-web-sdk] provides instrumentations, metas and transports for use in web applications. See the [README.md][faro-web-sdk-readme] for more information.

Web Tracing

[@grafana/faro-web-tracing][faro-web-tracing] provides implementation for tracing web applications. See the [README.md][faro-web-tracing-readme] for more information.

React Support

[@grafana/faro-react][faro-react] is a package that enables easier integration in projects built with React. See the [README.md][faro-react-readme] for more information.

[grafana-alloy-docs]: https://grafana.com/docs/alloy/latest/ [grafana-logs]: https://grafana.com/logs/ [grafana-traces]: https://grafana.com/traces/ [faro-core]: ./packages/core [faro-core-readme]: ./packages/core/README.md [faro-demo]: https://github.com/grafana/quickpizza [faro-local-dev]: ./docs/sources/developer/local-development.md [faro-quick-start]: ./docs/sources/tutorials/quick-start-browser.md [faro-react]: ./packages/react [faro-react-readme]: ./packages/react/README.md [faro-web-sdk]: ./packages/web-sdk [faro-web-sdk-readme]: ./packages/web-sdk/README.md [faro-web-tracing]: ./packages/web-tracing [faro-web-tracing-readme]: ./packages/web-tracing/README.md

Releases

Faro releases follow the Semantic Versioning naming scheme: MAJOR.MINOR.PATCH.

  • MAJOR: Major releases include large new features which will significantly change how Faro operates

and possible backwards-compatibility breaking changes.

  • MINOR: these releases include _new features which generally do not break_ backwards-compatibility.
  • PATCH: patch releases include _bug and security fixes_ which do not break backwards-compatibility.

> NOTE: Our goal is to provide regular releases that are as stable as possible, > and we take backwards-compatibility seriously. As with any software, always read the release notes > and the upgrade guide whenever choosing a new version of Faro to install.

Supported Node versions

Faro supports all active LTS (Long Term Support) and current Node versions. When Node.js versions reach end-of-life, we remove them from our test matrix and add new versions as they are released. You can find a release schedule on nodejs.org


📢 Faro v2 is Live! 🎉

We’re excited to announce that Faro v2 is now available. This version modernizes Faro, simplifies setup, and removes legacy code, to give users a cleaner and better performing experience.

  • Web Vitals v5 – Upgraded to v5 of Web Vitals library to remove FID metric and for improved performance.
  • Cleaner Tracing APIs – Removed redundant/deprecated attributes.
  • Simplified Setup – Simplified the console instrumentation configuration.
  • Leaner Core – Deprecated packages and legacy internals were removed for improved stability.

Upgrading Guide v2 Upgrade Guide

  • Contribute on GitHub
  • Share feedback: Grafana's Community Slack - #faro

Thanks to all contributors and early adopters for helping us shape Faro v2! 💙

Install & Usage

1
Create the skills directory
mkdir -p .claude/skills
2
Download the skill file
mkdir -p .claude/skills && curl -o .claude/skills/faro-setup.md https://raw.githubusercontent.com/grafana/faro-web-sdk/main/SKILL.md
3
Invoke in Claude Code
/faro-setup
View source on GitHub

Frequently Asked Questions

What is faro-setup?

Auto-instrument any web app with Grafana Faro Web SDK. Detects your framework, generates init code, wires it into your entry point, and opens a PR.

How to install faro-setup?

To install faro-setup, create the .claude/skills directory in your project, then run the curl command to download the skill file. Once installed, invoke it in Claude Code with /faro-setup.

What is faro-setup best for?

faro-setup is a community categorized under General. Created by Grafana Labs.