Track Analytic events with Firebase plugin

React Studio
2 min readJul 2, 2020
Events view in ´Google analytics

We’ve published an update to React Studio’s Firebase plugin. This update adds new “Log event” interaction. Logging events is crucial for optimising your app usage.

Logged events are automatically sent to Firebase analytics and Google analytics. You simply need to update your Firebase plugin from React Studio’s Plugin manager and attach events to your app’s buttons.

Make sure you have the “measurementId” property added to your Firebase config. You’ll find it from your Firebase console or your Google analytics. Read more about config settings here https://firebase.google.com/docs/analytics/get-started

Logging events requires that Firebase config contains analytics measurement Id

How to log events from your Web app?

Add new interaction and select Component->Web service -> Log event.

The event text is just a static text but you can make it dynamic with Data slot values by using familiar $slot(‘<data slot name here>’) syntax. In my example I’m tracking events when user clicks restaurant details from list of restaurants. On my analytics I see events “Clicked restaurant <restaurant nam> which is really handy.

Events view in Google analytics

Here’s a quick walk-trough video about event logging

--

--

React Studio

The premium app design tool for the most advanced JavaScript UI library — React JS www.neonto.com/reactstudio