- Published on
Cookie-less Website Analytics with Umami
- Authors
- Name
- Cameron Vargas
- Github
- @camvrgs
Table of Contents
Introduction
Website analytics is a must have for improving a site’s performance and user engagement. Although the popular Google Analytics is free, it comes with many drawbacks. One of the being that it collects personal data and uses tracking cookies which means obtaining consent to remain GDPR compliant. Therefore, although it has become the go to service for web analytics, Google Analytics is not always a suitable tool to use.
That’s where Umami comes in. It is a simple and secure and open-source alternative which can be self-hosted for free. In this post we will deploy and set up a self-host instance of Umami on Railway, a cloud infrastructure platform with a free hosting plan.
What is Umami
Umami is an open-source, privacy focused, self-hosted web analytics platform. As an alternative to Google Analytics, Umami provides less metrics than the tech giant’s service. However, Umami is GDPR compliant and does not use any cookies. That means no cookie banners. And the data that is collected is anonymous and lives only on your server.
As a secure simplified open-source analytics solution, Umami is a great alternative to Google Analytics.
Free Hosting on Railway
Railway is a cloud infrastructure platform with which you can provision and deploy infrastructure to the cloud. Railway offers a Trial plan with is free to use under $5 of services or 500 hours of usage per month, whichever comes first. Once the limit is reached, the deployments will be suspended until the next month, when they will need to be manually restarted.
The Railway team has made it easy to deploy preconfigured infrastructures for popular applications with ready-to-deploy templates.
One of these templates is an Umami instance with Postgres. You can deploy this infrastructure for free by using the link or the button below.
To deploy, sign in with GitHub to link the app to your account. Railway will create a new repository for the deployment, with which any updates or pull requests will be automatically redeployed.
You will be asked to set a HASH_SALT environment variable, which will be used to generate unique values for your instance.
Alongside the Umami app, Railway will also provision a PostgreSQL database and will automatically create the needed tables.
Once you set the repo location and HASH_SALT, click Deploy. Both services will take a few minutes to build and deploy.
Once the services have deployed, you will see the application’s new URL in the sidebar of the new Umami service node.
Getting started with Umami
A fresh Umami instance will create a default administrator with the username: admin and password: umami.
After logging in, we will need to update your password to something more secure.
Let’s start. Navigate to your new Railway hosted Umami instance and log in.
Go to Settings in the navigation header.
Navigate to Profile in the sidebar, and select Change password for the admin user.
There is only one admin account per instance. However, in the Accounts section of the Settings, you can create additional accounts for other users so that they can view analytics for their websites.
To create a new account, go to Settings in the navigation header, and then Accounts in the sidebar. Select Add account, and enter the username and password for the new user.
Adding a new website to Umami
Adding a new website to the Umami dashboard is very easy and straight forward. After logging into the admin page, click on Settings in the navigation header.
Go to Websites in the left side pane, and click on Add website.
Fill out a name and enter the website domain. If the data should only be available to a user other than the admin, you can select the user in the Owner field. The Enable share URL enables sharing website metrics via a shareable link with non-users. We won't use this, so leave it unchecked and click Save.
A new record will be made for the website. We now need the tracking code to link our site with Umami. Click on the Get tracking code icon for the website just created.
This code can now be pasted into the <head> section of your site.
If it is the website is built with Next.js, the tracking code should be added to the _app.js file, within a next/script component. For example:
// pages/_app.js
import Script from 'next/script'
// ...
<Script
// paste the tracking code properties here
// for example:
async
defer
data-website-id="" // your website ID
src="" // your Umami instance URL, suffixed with '/umami.js'
/>
That’s it! Visit your website and you should now see new metrics appear in your dashboard.
Out of the box, Umami tracks all pageviews and events. However, you can record additional events by using CSS or JavaScript. See the Umami documentation for how to track additional events. The tracker behavior can also be altered by using tracker configuration (used in the tracker code) and tracker functions (written in JavaScript).
Conclusion
Self-hosting a secure and free analytics application takes only a few minutes when hosting Umami on Railway. And as an open-sourced alternative to Google Analytics and other paid services, it is a great choice for a simple analytics solution.