Cómo medir el tráfico (visitas) de tu app Next.js con Vercel Analytics

Si estás usando Next.js y haces deploy en Vercel, puedes medir el tráfico de tu app sin scripts externos ni configuraciones complejas. Es una opción simple y útil para validar visitas en tus MVPs o proyectos personales, y funciona en todos los planes de Vercel.

Imagen de tráfico de visitas en Next.js con Vercel Analytics

Pasos para implementarlo:

1. Activa Analytics desde el panel de Vercel

Entra al dashboard de tu proyecto y haz clic en Enable Analytics.

Con eso basta para empezar a registrar visitas. No necesitas configurar nada adicional.

2. Instala el paquete en tu proyecto

npm install @vercel/analytics

3. Agrega el componente Analytics en tu layout

app/layout.tsx

import { Analytics } from '@vercel/analytics/next';

export default function Layout({ children }: { children: React.ReactNode }) {
  return (
    <>
      {children}
      <Analytics />
    </>
  );
}

📚 Si necesitas más opciones, puedes revisar la documentación oficial del componente.

Y listo, con eso ya comienzas a registrar visitas en producción y puedes verlas desde el panel de Vercel.

¿Qué métricas vas a ver?

Desde el panel de Vercel podrás ver: Referencias, Visitas por día, Ubicación por país, dispositivos, entre otras métricas útiles.

Conclusión