Setup

This guide will walk you through setting up Mouseflow to work with React Single Page Apps.


1. Install the Mouseflow Tracking code on your React App

Installing Mouseflow on your React app works just like installing Mouseflow on your website - the only difference is that you have to enable the Single Page App integration in Mouseflow to track the URL changes.

2. Automatic setup of URL change tracking

Once you've installed Mouseflow on your React app you need to set up a tracker to detect the URL changes from when a visitor navigates through the app. These changes are important because they define the individual Page Views (these help make Heatmaps, Funnels, Form Analytics and Feedback campaigns possible).

You can set this up automatically by enabling the Single Page App Integration in Mouseflow Settings (see guide below) - or if you prefer you can set it up manually.

A. Log in to your Mouseflow account and go to the Integrations Section

B. Navigate to the Single Page App Integration in the list

C. Toggle the radio button to enable the integration.

Congratulations, your React application should now be submitting all pageviews to Mouseflow as would any traditional HTML website.

Did this answer your question?