Añadir Google Analytics a Vercel

Vercel proporciona análisis básicos para el rendimiento, pero Google Analytics proporciona información mucho más profunda. Esta entrada de blog le guiará paso a paso para añadir Google Analytics a sus proyectos alojados en Vercel.

Empecemos.

1. Configurar Google Analytics
2. Añadir Google Analytics a su proyecto Vercel
   1. Para proyectos Next.js:
   2. Para otros proyectos:
3. (Opcional) Crear nuevas propiedades
4. Verificación de la integración
5. Reflexiones finales

Antes de entrar en materia quiero mostrarte algo. Prometo que vale la pena...

Google Analytics es grande, pero también complejo y un poco torpe. Si sólo quieres un panel de control sencillo con la información que necesita, GA no es un gran lugar para empezar. Además, a Google no le importa la privacidad y GA requiere un molesto banner de cookies.

Por eso he creado Simple Analytics, una herramienta de análisis sencilla y respetuosa con la privacidad: sin datos personales, sin cookies, sólo la información que necesitas en un panel de control sencillo.

Así es como se ve en comparación con GA. Siéntase libre de comprobar nuestros análisis en vivo para tener una idea de su proyecto. (Por cierto, es gratis)

Muy bien, suficiente sobre nosotros. ¡Ahora vamos a responder a su pregunta!

Configurar Google Analytics

Para integrar GA con su proyecto alojado en Vercel, primero asegúrese de que tiene una cuenta de Google Analytics configurada para su sitio web. A continuación te indicamos cómo empezar:

• Cree una cuenta de Google Analytics: Visite el sitio web de Google Analytics y acceda con su cuenta de Google. Si no dispone de una, deberá crearla.
• Configure una nueva propiedad: Siga las instrucciones para crear una nueva propiedad GA4, eligiendo "Web" como tipo de plataforma.
• Obtenga su ID de medición: Una vez configurada la propiedad, Google le proporcionará un ID de medición (con el formato "G-XXXXXXXXXX"). Este ID es crucial para integrar GA con sus proyectos de Vercel.

Añadir Google Analytics a su proyecto Vercel

La adición de Google Analytics a un proyecto alojado en Vercel varía ligeramente en función del framework o del generador de sitios estáticos que se utilice. A continuación, se muestra un enfoque general para los proyectos Next.js, que suelen alojarse en Vercel:

Para proyectos Next.js:

• Instala la librería GA: puedes utilizar la librería next-ga o un paquete similar para facilitar la integración. Instala la librería ejecutando npm install next-ga o yarn add next-ga en el directorio de tu proyecto.

• Configure el componente GA: Cree un nuevo componente (por ejemplo, Analytics.js) en su proyecto donde importará la biblioteca GA y la inicializará con su ID de medida. Aquí tienes un ejemplo básico:

import React from 'react'; import { useEffect } from 'react'; import ReactGA from 'react-ga'; const Analytics = () => { useEffect(() => { ReactGA.initialize('Your-GA-Measurement-ID'); ReactGA.pageview(window.location.pathname + window.location.search); }, []); return null; }; export default Analytics;

• Incluya el componente Analytics: Añade el componente Analytics a tu _app.js o a páginas individuales para asegurarte de que GA realiza un seguimiento de las páginas vistas en todo tu sitio.

Para otros proyectos:

Para proyectos que no utilicen Next.js, el método consiste en añadir manualmente el script de seguimiento de GA a los archivos HTML o JavaScript. Normalmente, el script de GA se incluye en un componente global o en una plantilla de diseño que se muestra en todo el sitio.

(Opcional) Crear nuevas propiedades

Para realizar el seguimiento de varios sitios web, cree más propiedades de GA y utilice los ID de medición correspondientes. Esto evita que GA confunda los datos.

Verificación de la integración

Después de integrar Google Analytics en su proyecto Vercel:

• Implemente los cambios: Empuje sus cambios a su proyecto Vercel y espere a que se complete el despliegue.
• Compruebe Google Analytics: Visite su sitio web para generar tráfico y, a continuación, acceda a su cuenta de Google Analytics y vaya a la sección "Tiempo real" para comprobar si se realiza un seguimiento de su visita.

Reflexiones finales

Añadir Google Analytics a sus proyectos alojados en Vercel puede proporcionarle información muy valiosa. Sin embargo, pregúntese: ¿es Google Analytics la herramienta adecuada para usted?

GA es una solución demasiado potente para realizar análisis sencillos. Si buscas un panel de control sencillo e intuitivo con la información que necesitas, hay mejores alternativas. Sí, estoy hablando de mi propio producto(Simple Analytics), pero hay otros por ahí también.

Odiaba usar Google Analytics para mis proyectos. Es torpe, hay cientos de paneles de control y no parece atractivo. Además Google no se preocupa por la privacidad o la ética. Es por eso que decidí construir mi propia y más intuitiva herramienta de análisis web.

Si esto te suena, no dudes en darle una vuelta a Simple Analytics. Sólo tienes que añadir el script y ya está. Se tarda aproximadamente un minuto, ¡y también hay una versión gratuita!

¡Que aproveche!