Mike Bifulco

How to add Fathom Analytics to your Remix.run app

Building a website using the Remix.run web app framework? This tutorial will teach you how to add privacy-first analytics to your Remix site with Fathom.

How to set up Fathom on your Remix site

  1. Sign into your account with Fathom, and create a new site.

  2. Open the settings for that site, and look for Script settings. Hit the clipboard icon to copy the Script tag for your site.

    Script settings for one of my sites on Fathom's dashboard
    You site's embed code will be on the script settings page. Hit the clipboard button to copy the code
  3. Open up your Remix site in your IDE of choice. open root.tsx (or root.jsx if you're using JavaScript instead of TypeScript), and paste your embed code right before the <Script /> tag:

return (
<html lang="en">
<Meta />
<Links />
<Outlet />
<ScrollRestoration />
<Scripts />
<LiveReload />

Note: ☝🏽 I've edited the <script> tag here to be self closing, rather than having <script></script>. It should work either way.

  1. Start your site with npm run dev or yarn dev and visit any page (you may have to hit reload if you had the page open already). You should see this reflected in your fathom dashboard in real time!
    You'll know it's working when you see a live visitor on your fathom dashboard
    You'll know it's working when you see a live visitor on your fathom dashboard

Try out Fathom - it's great!

I've been using Fathom for years, and am a happy paying customer. If you'd like to give it a shot, you can get $10 off of Fathom when you use my referral link https://usefathom.com/ref/DPSSYB to get started.

If you enjoyed this video

Mike Bifulco headshot

Get content for developers, designers, and entrepreneurs

Subscribe to get my updates delivered to your inbox. Typically 1-2 emails a month, straight from me to you. 😘 Unsubscribe anytime.

© 2019-2022 Mike Bifulco
Built with Next. Source code on GitHub.
Disclaimer: 👋🏽 Hi there. I work as a Developer Advocate at Stripe. Content on this site contains my own opinions, and does not necessarily reflect the views of my employer.

More great resources

Articles about React.jsArticles about Remix.runArticles about Next.jsArticles for developersArticles for JavaScript developersArticles about CSSArticles about User Experience (UX)Articles about tools I useArticles about productivityBrowse all topics →