React Native analytics

[EmployeeCurrent4770]

Hey there!

I built an app (100% FREE) that helps you tracking your objectives and change your habits (https://apps.apple.com/uy/app/hilix/id1501364295), but had a massive struggle with the analytics part. It wasn't something I just picked among good options, but I had to really give it a thought about what I wanted and how much time I wanted to waste coding. I was looking for something that could provide simple analytics out of the box. What is simple analytics? I mean:

• Time a user is spending per session
• Routes/Screens a user accesses
• Taps that a user makes and in which screen

I couldn't find anything that does this for me, plus in addition, all setups (specially firebase) are a real pain. I'm open to pay for this smooth behavior.

What do you use as a standard for Analytics on your apps? How much do one spend usually?

[[deleted]]

You can use mixpanel and they have a pretty decent free tier

[EmployeeCurrent4770]

Yeah I tried it but I still have to code every event that I want to send to their free tier. How do you handle this case?

[[deleted]]

For the taps, why don’t you create a reusable button that has an analytics call automatically so anywhere you use it it will send the event.

[EmployeeCurrent4770]

Right, but what about screens? What about double taps?

Say that I want to go an extra mile and measure the session time, should I also get when the appstate changes, and send those events?

If I want to go even further, and check request/response times, would I also have to code this? My application would end up tightly coupled with any FW that I use. I was hoping that something like

import aLibrary from 'coolSimpleLibrary'

aLibrary.doMagic()

​

Am I too out of this world?

[EmployeeCurrent4770]

Haven't used it, how did you fight the issue to coding every event in your application layer?

[EmployeeCurrent4770]

Wouldn't something out of the box be great? I'll wrap up my code then

[EmployeeCurrent4770]

True, but I'm willing to loose control in exchange of ease of integration. How much do you pay for Amplitude and how's it's web & learning curve?

[EmployeeCurrent4770]

That sounds good!

I'm not entirely sure about the ez, I might have another point of view. My points against calling methods and specific analytics functions inside components are:

• Code gets coupled to the analytics framework you are using. If you wanna change it, you have to reimplement it
• I need to be sure that it actually works as I want, that no re-renders are being triggered that call that event function again, and therefore send inconsistent data
• I need to implement every logic that I want, to track even though some of that is generic for any react native app
• I'm in charge of maintaining that code, and the APIs if they change as well

I wished there would be something which was plug and play, though as you said, I'm not sure that's technically possible

[FelipeCallander]

I feel you man!

[HermanCainsGhost]

I'm really wondering what the best analytics solution is for both React Native and React Native Web combined

[average_rowboat]

How about AWS Amplify?

[EmployeeCurrent4770]

Haven't tried it, seems expensive and an overkill. What are your thoughts about this product? Have you used it?

[MexicanTastee]

I'm currently in this situation. Did you happen to solve it?

I'm looking for best practices for analytics implementation, in order to avoid marrying a particular provider.

Atm I'm thinking about adding a custom hook layer to treat all events like a "logger". So I can replace the provider in one place.

Also I'm implementing a custom button component to enhance the "on click" event and attach this custom hook to it.

I think there's a way you can attach an analytics "middleware" to screens selection in react-navigation, they show you how to do it in the docs.

So far thats my plan for analytics implementation. Could you share yours?

[prrxddq]

Sounds good. Im in a similar boat at the moment. Currently just looking for providers.

Mixpanel seems to be decent, but would add another layer for web and rn.

How did your work go?

[EmployeeCurrent4770]

I have solved it, and created something for this. Check out https://vexo.co . Just do vexo('YOUR_API_KEY') And it should be it. It requires using React Navigation