How I used Google Analytics to track unique visitors to my portfolio website.

Recently graduated from a coding Bootcamp? Did you also make a portfolio website? But can you actually know if the recruiter actually saw your portfolio website?

I also made an awesome (that what I think) portfolio website to showcase my projects but there was a problem — I didn’t know if even the recruiters looked at my profile. So being a new software engineer I thought I should come up with a solution to my problem.

I had created my website using REACT which is a Javascript library used to make single-page applications. Below are the steps that I followed to enable google analytics tracking :

STEP 1 :

Create a new Google Analytics account here.

Google Analytics Landing Page for new users

STEP 2:

Setup your google analytics account, start by filling in the account name which can be anything.

Create Account page of Google Analytics

STEP 3:

Choose a platform, for a portfolio be should be fine.

Choose Platform

STEP 4:

Choose a website name, it can be anything, then choose the WEBSITE URL, you can’t use localhost, I kept it as test.test.com, you can change it later.

Industry Category and Reporting Time Zones are not mandatory fields.

Choose the name / Properties of the website you plan to track

STEP 5:

Google Analytics will then create a Tracking ID which you need to save.

I have blurred my Tracking ID.

STEP 6:

Go to your website, and paste the Global Site Tag code in each page that you want to track. I made a react app so the process I followed was a bit different.

STEP 7(FOR REACT APP) :

Install an npm package called ‘react-ga’ using commands:

yarn add react-ga 

or for NPM :

npm i react-ga

STEP 8:

Import ‘react-ga’ in your app go to App.js and insert the below code :

useEffect(() => {
ReactGA.initialize('TRACKING ID');
ReactGA.pageview(window.location.pathname + window.location.search)
},[]);

Hope you saved the Tracking ID in step 5.

STEP 9:

Make sure you also import the below lines in App.js :

import ReactGA from 'react-ga';
import React, {useEffect} from 'react'

DONE!

It's that easy, now go to the Google Analytics page (Dashboard) and run the development server you should see 1 active user as below :

1 Active User in Real-Time Statistics

Hurray, you tracked yourself.

That is it, you may now deploy this app and over a period of time with more data, you can see historical data of the number of visitors or even unique visitors that viewed your portfolio.

Historical Data of user visits to my website

This is just a beginner's guide, you can keep adding more functionality and improve tracking.