Quickstart setup for Faro and Frontend Observability
Follow these steps to get started quickly with the Faro Web SDK and Grafana Cloud Frontend Observability:
- Create an Frontend Observability application
- Observe the application in Frontend Observability
Create an Frontend Observability application
To observe Real User Monitoring (RUM) data in Grafana Cloud Frontend Observability create an application in the Grafana Cloud Frontend Observability plugin:
Sign in to Grafana Cloud, register for a Free Grafana Cloud account if required, to get to the Grafana Cloud Portal page.
If the account has access to multiple Grafana Cloud Organizations, select an organization from the top left organization drop-down.
If the organization has access to multiple Grafana Cloud Stacks, navigate to a stack from the left side bar or the main Stacks list.
With a stack selected, or in the single stack scenario, below Manage your Grafana Cloud Stack, click Launch in the Grafana section:
Use the left navigation to expand Frontend and select Frontend Apps.
If this is your first time, the Frontend Observability landing page is displayed. When you are ready, click Start observing on the landing page which takes you to the overview page.
From the overview page, click Create new and to create a Frontend Observability application to hold RUM data for your web application.
An new application requires the following information:
- App Name: Give your app a meaningful name
- CORS Allowed Origin: Domains allowed to access your Frontend Observability application, for local development set the value to
localhost
- Default attributes: Any attributed you’d like added to all signals, if unknown leave empty
After the application is created, copy the pre-configured instrumentation snippet from the Web SDK Configuration page and paste it before the end of the
head
element on every page you’d like to instrument.
Observe the application in Frontend Observability
Run your web application and make some requests to instrumented pages to send data to Grafana Cloud.
Learn how to explore your application in Frontend Observability with the documentation: