Capturing Views

A short session today. I'll set up the projects and the simplest possible view capturing so I can start getting some data to work with.

I'll use DevJourney to test out the capturing.

Thanks to hatch, the project was up in minutes. Now, the script. I'll ask claude to write it because I'm really tired and can't think.

This is what it came up with:

function sendEvent(type: string, extra: Record<string, any> = {}) {
    const payload = {
        session_id: sessionId,
        type,
        url: window.location.href,
        referrer: document.referrer,
        user_agent: navigator.userAgent,
        timestamp: new Date().toISOString(),2
        ...extra,
    };
    navigator.sendBeacon(backendUrl, JSON.stringify(payload));
}

Never knew this function existed. Pretty cool, let's deploy.

{"level":"WARN","msg":"CORS request from unallowed origin","origin":"https://www.devjourney.io","allowed":{"http://localhost:3000":true,"https://app.barelytics.io":true}}

Oops! Didn't think of that. I'll have to allow all origins for this endpoint.

I'll also use the NextJS rewrites to proxy these so they don't get blocked by adblockers. 🤞

const nextConfig = {
  async rewrites() {
    return [
      {
        source: '/event',
        destination: 'https://api.barelytics.io/event',
      },
    ];
  },
};

Deployed that, couple of clicks, and we're seeing the first data in the production db!