Alex HyettTowards the end of 2021, I started getting into web3 a lot more. Not only did I join the Developer DAO but I also launched my own NFT collection and wrote a few blog posts on the topic.
One of the key components of web3 is the ownership of data. In web 2.0, our data is owned by the likes of Facebook, Google and Apple. We have no control over our own data and in most cases, these companies are profiting from it.
Now my blog is a static website created using Gatsby.js. The lack of an underlying database has meant I have had to rely on 3rd party services for analytics and comments.
Until recently, I have been using Google Analytics for tracking the number of visitors and Disqus for my commenting system. However, both of these companies track their users and are profiting from the data they collect. As a web3 advocate, I felt a bit hypocritical writing about all the benefits but still using these services that are tracking data.
So at the end of 2021, I switched to privacy-focused services that don’t collect identifiable information on visitors.
Plausible Analytics
I don’t know the exact statistic but I imagine the majority of the web has Google Analytics running on it. As a result, Google is able to collect an enormous amount of data on the websites you visit and can track your movements around the web.
Obviously, as a simple user, I am not able to identify individual people on my site but Google can, especially if you have a Google account too.
Google Analytics has a dizzying number of features but ultimately there are only a few data points I care about:
- How many people are visiting my site?
- What posts are they reading?
- Where did they come from?
Possibly in the future when I have products I might want to know how many of my visitors convert into paid users.
Plausible Analytics does all of this without compromising the privacy of the users of my site.
Now Plausible Analytics isn’t free at £9 a month but not only are you protecting your user’s privacy you are also helping out an indie development team. Plausible is developed by a small 2 man team Uku Täht and Marko Saric and it is nice to be able to support them rather hand more money over to Google. Plausible also give you the first 2 months free so you can see whether it is the right tool for you.
I also much prefer the dark dashboard compared to Google Analytics:
I have been really impressed with Plausible. I wish they had a mobile app and widgets but the dashboard is mobile friendly so it isn’t a big loss.
Plausible is simple to set up, it is just a case of adding the javascript to your site. It is also a smaller script than Google Analytics so it will help your website performance as well.
I always found it ironic that Google’s Page Speed was always asking me to fix the Google Analytics script due to its size.
Giscus
When I switched from WordPress to Gatsby, I needed to add a third-party comment system. Disqus is very easy to set up but requires users to sign in and will often try and add adverts if you don’t turn them off. I am sure there is a fair amount of data collection that goes on as well.
The downside of comment systems is they cannot be completely anonymous as otherwise, you will end up with a lot of spam on your website.
When I was hunting around for alternatives I found utterances. Utterances is open-source and uses GitHub to store your comments. It seemed perfect but I wasn’t keen on the fact that conversations were being stored as issues.
I then found Giscus a fork of utternances that uses GitHub discussions for the storage mechanism. If you look at the sites you will see they are basically identical in how they work.
You still need a GitHub account to be able to comment but as a developer-focused site, it is likely the majority of my users probably would have one anyway.
Issues with setup
I did hit a few roadblocks when setting up Giscus. The main issue was with the way I had my website set up.
I currently have my website hosted on AWS with my static website hosted in an S3 bucket and CloudFront as my CDN.
When I first tried to sign in to GitHub to comment I would get redirected back to my website but it will still tell me I needed to sign in. The issue was there was a redirect happening which was causing the query string containing the token to get dropped.
First I made sure I enabled query string forwarding in my CloudFront distribution. That didn’t help by itself but I guessed was needed anyway.
In an S3 website if you visit a page hosted in a folder without specifying the trailing slash it will redirect you to the trailing slash version. When it does this, it drops the query string. To me, this seems like a bug with the way S3 hosted sites work, either way, we need to work around it.
The trick is to add a function to your CloudFront distribution that will add the trailing slash for you before it passed to the S3 bucket.
To do this, you go to the Behaviour section of your CloudFront distribution. I have a default behaviour added already to redirect HTTP to HTTPS so I just added to this. If you scroll to the bottom of your behaviour you will find a section called Function association.
Your lambda needs to be hosted in us-east-1 to be able to use it with CloudFront.
In my case, I only need to add a slash if it wasn’t there. This is what my code looks like:
const path = require('path');
exports.handler = async (event) => {
const { request } = event.Records[0].cf;
const { uri } = request;
const extension = path.extname(uri);
if (extension && extension.length > 0) {
return request;
}
const last_character = uri.slice(-1);
if (last_character === "/") {
return request;
}
const newUri = `${uri}/`;
console.log(`Rewriting ${uri} to ${newUri}...`);
request.uri = newUri;
return request;
};
You can test your lambda in the console before publishing and hooking up to your CloudFront distribution.
A big thank you to Sean Devine for his post on this, Add Trailing Slash to AWS CloudFront Request
