Introduction
Are you tired of relying solely on Google Analytics to track your website's performance? Look no further! Introducing Umami , a powerful and privacy-focused alternative that puts you in control of your analytics data. Umami was founded by three brothers, Mike, Brian and Francis Cao as they were frustarted with using Google Analytics, which dominated and still does the industry of analytics despite of privacy concerns. As it is open-source, Umami quickly started being popular open-source project while still respecting privacy of users. My personal opinion, is that Umami is really easy to setup and use, for smaller projects as my personal website it is of great use. It does not many tracking as GA but it really does its job.
In this post, we'll explore the benefits of using Umami over Google Analytics, how to set it up, and some catchy variations for its name.
Why you should choose Umami
Privacy: As I mentioned in the introduction section, unlike Google Analytics, which collects and stores user data on Google's servers, Umami can be self-hosted, giving you full ownership and control of your data. Say goodbye to third-party tracking and privacy concerns! You can host umami on your servers and really be owner of analytics data.
-
Open Source: Umami is open-source software, meaning you can inspect, modify, and customize it to suit your needs. No more black-box analytics solutions—take control of your analytics stack.
This can be real advantage as you can tailor Umami for your needs, as well as I did with dockerizing Umami. If you are interested in self hosting Umami which unlocks you many more possibilites than free plan you can check my post on Simplicity: Umami provides a clean, intuitive and modern interface for analyzing your website traffic without overwhelming you with unnecessary features. I dont say it is useless, but many thing from GA I personally dont use and havent used at least once. It's lightweight, fast, and focused on delivering actionable insights.
Real-Time Tracking: With Umami, you can monitor your website traffic in real-time, gaining instant visibility into visitor behavior and trends as they unfold. Say hello to up-to-the-second analytics reporting! You can track real time user activity, views and events.
Setting Up Umami
As mention above you can use Umami on two ways, Cloud (umami cloud free plan) and Self-hosted (hosted on your machine).
Umami Cloud
- Visit Umami website and Sign Up or Login if you already have account.
After you login you should be able to see screen like this
Click on + Add Websiteand you will be prompted to enter websitesNameandDomain.
After entering go to Saveand you will be able to see your newly made website under Websites Menu.Now when we have website created we must add tracking code we get from Umami for our website and add it in our applications header. It is important to add to our header in order to Umami be able to stream statistics data to Umami cloud. Go to
Editand you will seeTracking codetab click on that and you will get script code which you need to add in your application.
You should be able to see somthing like this
<script defer src="https://eu.umami.is/script.js" data-website-id="XXXXXX-XXXX-XXXX-XXX-XXXXX"></script>
Copy that code provided by Umami and paste in your application <header>, in this example I am using Next.js so i added it into _document.js
import Document, { Html, Head, Main, NextScript } from 'next/document'
class MyDocument extends Document {
static async getInitialProps(ctx) {
const initialProps = await Document.getInitialProps(ctx)
return { ...initialProps }
}
render() {
return (
<Html lang="en">
<Head>
<script defer src="https://analytics.eu.umami.is/script.js" data-website-id="XXXXX-XXXX-XXXX-XXXX-XXXXX"></script>
</Head>
<body>
<div id={'globalLoader'} >
</div>
<Main />
<NextScript />
</body>
</Html>
)
}
}
export default MyDocument
or if you want in plain html, you should add it like following
<head>
<script defer src="https://analytics.eu.umami.is/script.js" data-website-id="XXXXX-XXXX-XXXX-XXXX-XXXXX"></script>
</head>
- Now that we have tracking script in our application we are ready to deploy it (in my case that is on Vercel). After deploy is done we should be able to see data streamed to our Umami Analytics.
You are able to track events as well in Umami and it is pretty straight forward, just add it to desired button, link, etc. like in example below
<button id="signup-button" data-umami-event="Signup button">Sign up</button>
Self-Hosted
If you want to host Umami on your machines, you are free to do so. Easisest way which i used many times is that I use dockerized Umami and run it in docker containers on my desired machine.
Easiest way to do so is to go to the so is to follow this guide Dockerizing Umami .
Basically, you need docker compose file, and Docker installed on your machine. When you have all prerequisites you can run
docker compose up -d
This will start docker server in one container and database in the other which is needed in order to Umami stores data of your analytics.
Pretty straight forward steps and you are ready to go, visit specified port for Umami you set and thats it. Afterwards you can host it on your server wherever you want.
Conclusion
In conclusion, Umami offers a refreshing alternative to Google Analytics, providing privacy, openness, simplicity, and real-time tracking—all while putting you in control of your analytics destiny. Give Umami a try today and unlock the true potential of your website analytics.
Keep in mind that you dont have to option only one analytics tool, you have options and ability to use multiple analytics for the same website for whatever purpose you choose. On my website, I personally use Umami, Google Analytics, Vercel Analytics and Splitbee (later aquired by Vercel).
Note: Remember to always comply with applicable data protection laws and regulations when collecting
and processing user data.
Feel free to checkout my original post
Top comments (0)