diff --git a/.gitignore b/.gitignore
index fd3dbb5..00bba9b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -27,6 +27,7 @@ yarn-error.log*
# local env files
.env*.local
+.env
# vercel
.vercel
diff --git a/app/layout.tsx b/app/layout.tsx
index ed2a50d..8f3a898 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -3,6 +3,7 @@ import { Inter } from "next/font/google";
import "./globals.css";
import Header from "@/components/header";
import Footer from "@/components/footer";
+import GoogleAnalytics from "@/components/GoogleAnalytics";
const inter = Inter({ subsets: ["latin"] });
@@ -22,6 +23,7 @@ export default function RootLayout({
+
{children}
diff --git a/components/GoogleAnalytics.tsx b/components/GoogleAnalytics.tsx
new file mode 100644
index 0000000..fec3093
--- /dev/null
+++ b/components/GoogleAnalytics.tsx
@@ -0,0 +1,31 @@
+"use client";
+
+import Script from "next/script";
+import * as gtag from "@/lib/gtag";
+
+const GoogleAnalytics = () => {
+ return (
+ <>
+
+
+
+ );
+};
+
+export default GoogleAnalytics;
diff --git a/lib/gtag.ts b/lib/gtag.ts
new file mode 100644
index 0000000..e126bfa
--- /dev/null
+++ b/lib/gtag.ts
@@ -0,0 +1,27 @@
+// https://stackoverflow.com/questions/77063977/implementing-google-analytics-in-nextjs-13-app-directory
+
+export const GA_TRACKING_ID: string | undefined = process.env.GA_TRACKING_ID;
+
+export const pageview = (url: string) => {
+ (window as any).gtag("config", GA_TRACKING_ID, {
+ page_path: url,
+ });
+};
+
+export const event = ({
+ action,
+ category,
+ label,
+ value,
+}: {
+ action: string;
+ category: string;
+ label: string;
+ value: number;
+}) => {
+ (window as any).gtag("event", action, {
+ event_category: category,
+ event_label: label,
+ value: value,
+ });
+};