Why Your Website Should Know Where Every Lead Came From

How I used Next.js and an AI coding agent to build first-party lead attribution in under 30 minutes

When a new lead arrived through my client's website, I could see their lead details. What I could not reliably see was the information that mattered to the business: where did this person actually come from?

• Was it an organic lead from Google?
• Did the visitor click a paid Google Ads campaign?
• Did they discover the business through Facebook or Instagram?
• Did they visit the website directly?
• And if the conversation moved to WhatsApp, could we still preserve the original marketing source?

This was the real pain point I wanted to solve for my client. I was not trying to build a sophisticated analytics platform. I simply wanted to separate their leads into three useful categories:

• Paid
• Organic
• Direct.

I also wanted to identify the channel behind each lead, such as Google, Meta or another referring website.

Website analytics can tell a business how many people visited a page and which campaigns generated traffic. Advertising platforms can report clicks and conversions. But when an actual lead reaches the sales team, that marketing context is often missing. The business receives the person, but loses the journey that brought them there.

That gap makes everyday marketing decisions harder. If a business cannot connect a campaign to individual leads, it cannot confidently compare lead quality, understand which channel deserves more budget or distinguish genuine organic growth from paid acquisition.

The customer journey is no longer simple

A prospective customer may click a Google advertisement, browse several pages and submit a form later. Another person may find the business through an organic Google result and immediately open WhatsApp. Someone else may click a Meta ad that sends them directly into a WhatsApp conversation.

These journeys do not all produce the same attribution signals.

Paid website visits may include tracking values such as gclid, fbclid and UTM parameters. Organic visits may have no query parameters, but the browser's document.referrer can still indicate that the visitor came from Google. Direct visits may contain neither.

Click-to-WhatsApp advertising introduces another measurement path. When someone messages a business directly from a Meta Click-to-WhatsApp ad, Meta can include referral metadata such as the ad source and ctwa_clid in the first inbound WhatsApp webhook. This is different from ordinary website URL tracking and needs to be captured by the WhatsApp Business provider or backend receiving that webhook.

The business goal, however, remains simple: preserve enough context to understand which marketing activity produced each lead.

Turning the website into part of the marketing system

My client's website is built with Next.js. That mattered because it was not only a collection of pages. The same application could run code in the visitor's browser, process a form securely on the server, store information in a database and send structured data to automation or CRM systems.

I asked an AI coding agent to help me connect those pieces. This was the initial instruction I gave it:

Please build a comprehensive traffic attribution tracker for our Next.js application.

1. Create a client-side component/utility that runs when a page loads. It must capture the entire raw URL query string (everything after the '?') as well as the document.referrer value.
2. Store this combined data string into a secure, first-party cookie named attribution_data that expires in 30 days.
3. Update our form submission flow. When a user submits a form, read the attribution_data cookie and pass its text string alongside the standard form input data to our backend Server Action.

Because the agent could inspect the existing Next.js codebase, it was able to understand how the client's forms already worked and follow a lead from the landing page to the backend. In roughly half an hour, I had the core tracking flow implemented and tested for the client.

The speed did not come from asking AI to produce an isolated snippet of code. It came from giving the agent access to a structured application where browser behavior, form handling, server validation, database storage and webhooks could be understood as one connected journey.

How the attribution works

When a visitor first arrives, a lightweight client-side component records two pieces of evidence: the complete query string after the ? and the browser's document.referrer value.

That information is stored for 30 days in a secure first-party cookie. If the visitor explores the website and submits a form on another page, the original source information is still available. The form sends it to the backend together with the normal lead details.

The server then validates and interprets the attribution data. It can classify the lead as Paid, Organic or Direct; identify a likely channel such as Google or Meta; retain UTM and click identifiers; and store the referrer's origin.

Keeping the original raw value is important. Marketing rules change, and no classification system is perfect. By storing both the raw evidence and the interpreted fields, we can review or improve the logic later without losing what the browser originally supplied.

There are also sensible safeguards. The server limits the attribution string to 2,048 characters and accepts only valid URL-query characters before parsing it. If the attribution is missing or invalid, the lead can still be submitted. Tracking should add context to a lead, not prevent a genuine person from contacting the business.

What this means for SEO

This tracker does not directly improve search rankings, and it would be misleading to claim otherwise. Its value is that it makes organic performance more meaningful.

Instead of knowing only that Google Search delivered sessions, the client can see which leads appear to have come through organic search. That gives SEO a clearer connection to business outcomes.

The implementation is also intentionally lightweight. It does not change the page's visible content, metadata or server-rendered HTML. When carefully implemented, it should have negligible effect on crawling, indexing and page performance.

Attribution still has limits. Browsers and apps may remove referrer information, visitors may reject cookies, and cross-device journeys are difficult to connect. The result is better evidence, not perfect certainty. Consent and privacy requirements must also be considered before using attribution cookies or sending conversion data to advertising platforms.

The next stage

This first version gives the client a dependable foundation. When a paid lead contains a Google or Meta click identifier, a future phase can send a qualified conversion back to the appropriate advertising platform using privacy-conscious server-side integrations. Names and phone numbers can be normalized and hashed where the platform requires them, while organic and direct leads remain in internal reporting rather than being sent back as paid conversions.

The system can also connect website-to-WhatsApp clicks with the client's attribution records and separately capture the native referral metadata supplied by Meta for direct Click-to-WhatsApp campaigns.

The larger lesson is that a modern website should do more than attract traffic and collect contact details. It should preserve the context behind every lead.

For me, that is the marketing advantage of building a client's website with Next.js. It gives the business ownership of the path from first click to real lead. For a freelancer, combining that flexibility with an AI coding agent creates an opportunity to deliver practical, testable improvements in hours or even minutes, and to provide value well beyond designing pages.

The question is no longer only, "How much traffic did this campaign generate?" It becomes the question that helps a client make better marketing decisions: which part of our marketing produced this lead?