Matthew Palmer Top Articles Vanilla Rocket Kubernetes Book Standing Invitation

Getting Started With, Analytics.js and Mixpanel

I was watching Jack Dorsey (creator of Twitter) do an interview the other day, and he said that the number one tip he’d give to aspiring developers was to develop and implement meaningful and custom analytics. I decided to look into that.

For this, we’ll let (with Analytics.js) and Mixpanel do most of the heavy lifting, leaving us to just implement the things that are custom. Everything pretty much works perfectly - the guys at have done a great job - but it can be a little confusing to put the pieces together initially.

We’ll start with this: has Analytics.js kind of built in, though you can use Analytics.js without Anyway, sign up for and create a new project. Do the stuff they tell you in the setup guide, but don’t worry too much if you don’t fully understand the adding events page. We’ll sort that out later.

Create a free Mixpanel account, then link your account to it by going to Integrations on the dashboard, clicking Mixpanel and pasting in your token (from Mixpanel).

When you’re done, you should have something like this:

Tracking Page Views

While and Mixpanel each have their pageviews, we’d like to have one that works across both. Add the following in the head tag, but below the other scripts we’ve added. Now if you refresh, you should have a new event in both and Mixpanel. Perfect. Every time you call analytics.track a new event is create automatically in Mixpanel. This automation is the real value of; you can do this with all the other analytics services too!

Now if you refresh and then click ‘Check’ in the set up stage of Mixpanel it should say the event was received. Good job - you’re now tracking page views in Mixpanel.

Tracking Custom Events

To track custom events, you need to use the Analytics.js (which comes with API. It’s super easy. Basically, you just call a function whenever you want an event to be tracked. So every time the link is clicked, analytics.track runs and will send the data to the events in and Mixpanel. Awesome. You can include more data with the track call, but that’s for another day.

Mixpanel also provides some insanely useful features like Funnels and Streams, but I’d recommend watching the videos on their site to get comfortable.

It’s likely that I’ve made some code errors here, so if you’re having trouble feel free to contact me on Twitter. As always, for a better and more powerful understanding check out the and Mixpanel docs.

If you’re wondering, here’s the full code.

My products
💅 Vanilla – hide icons from your Mac menu bar for free
🚀 Rocket – super-fast emoji shortcuts everywhere on Mac… :clap: → 👏
Horo – the best free timer app for Mac
📂 FastFolderFinder – a lightning-fast launchbar app for folders and apps
📖 Kubernetes – my book on Kubernetes for web app developers
😄 Emoji Bullet List – easily emojify your bullet point lists (like this one!)

Jump on my email list to get sent the stuff that’s too raunchy for the blog.
(Seriously though, it’s an occasional update on apps I’ve built and posts I’ve written recently.)