Vercel 배포 후 Google Analytics를 연결하는 과정은?

Q1: Vercel에 배포한 웹사이트에 Google Analytics를 연결하려면 어떻게 시작하나요?
A1: 먼저 Google Analytics 계정을 만들고, 새 속성(Property)을 생성해 추적 ID(Measurement ID)를 확보해야 합니다. 이후 해당 추적 ID를 웹사이트 코드에 삽입하여 연결합니다.

Q2: Google Analytics 추적 ID를 어디서 확인할 수 있나요?
A2: Google Analytics에서 ‘관리’ > ‘속성’ > ‘데이터 스트림’으로 이동해 웹 스트림을 선택하면 Measurement ID(예: G-XXXXXXXXXX)를 확인할 수 있습니다.

Q3: Vercel 사이트의 코드에 Google Analytics 코드를 어떻게 추가하나요?
A3: 보통 `` 태그 안에 Google Analytics 스크립트를 삽입합니다. React, Next.js 등 프레임워크를 사용하는 경우에는 공식 가이드나 맞춤형 방법으로 Analytics를 적용할 수 있습니다.

Q4: Next.js 프로젝트에 Google Analytics를 적용하려면 어떻게 하나요?
A4: 기본적으로 `_app.js` 또는 `_app.tsx` 파일에서 useEffect를 이용해 페이지 이동 시 GA 이벤트를 보내거나 `next/script` 컴포넌트를 이용해 GA 스크립트를 삽입할 수 있습니다. 예를 들어:
```jsx
import { useEffect } from 'react';
import { useRouter } from 'next/router';
import Script from 'next/script';

function MyApp({ Component, pageProps }) {
const router = useRouter();

useEffect(() => {
const handleRouteChange = (url) => {
window.gtag('config', 'G-XXXXXXXXXX', { page_path: url });
}
router.events.on('routeChangeComplete', handleRouteChange);
return () => router.events.off('routeChangeComplete', handleRouteChange);
}, [router.events]);

return (
<>
src={`https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX`}
strategy="afterInteractive"
/>