Tracking outbound clicks
Unanswered
Brown bear posted this in #help-forum
Brown bearOP
I'm trying to figure out how to track when someone clicks a link that leaves my project and into an outside page. My app is a directory of sorts and I want to know if people are clicking to what things. So for example:
I want to use https://getanalytics.io/ to track these clicks. Something like:
But I can't figure out the right way to do it in NextJS. The page is rendered on the server and I'd like to keep it that way if possible.
I can't figure out how to put an onClick event around (or inside) Link. I can't figure out how to do an eventListener. Anyone do this sort thing?
<Link
href={url}
className={'btn w-full bg-blue-500'}
target="_blank"
>
Go to this site
</Link>I want to use https://getanalytics.io/ to track these clicks. Something like:
analytics.track('affiliateClicked', {
source: 'directory'
})But I can't figure out the right way to do it in NextJS. The page is rendered on the server and I'd like to keep it that way if possible.
I can't figure out how to put an onClick event around (or inside) Link. I can't figure out how to do an eventListener. Anyone do this sort thing?
3 Replies
Brown bearOP
OK, if anyone finds this. I'm extracting the Link into it's own client side component. Adds a small bit of complexity I wanted to avoid, but not too bad.
Snowshoe
Yeah you need to do that in a client component as it’s client side interactivity. Client side isn’t bad and this use case fits it exactly - I think the general@concept now is to try and stay server side until you need that client side interactivity.
Brown bearOP
Yeah, my misunderstanding was that I didn't realize I could move the client/server boundary with quite that level of finesse. So yeah, thanks for responding!