diff --git a/.github/workflows/front-build.yaml b/.github/workflows/front-build.yaml
index 17c6acd..a560863 100644
--- a/.github/workflows/front-build.yaml
+++ b/.github/workflows/front-build.yaml
@@ -38,6 +38,7 @@ jobs:
         run: |
           echo "VITE_NAVER_MAP_ID=${{ secrets.VITE_NAVER_MAP_ID }}" >> .env
           echo "VITE_SERVER_ADDRESS=${{ secrets.VITE_SERVER_ADDRESS }}" >> .env
+          echo "VITE_GA_TRACKING_ID=${{ secrets.VITE_GA_TRACKING_ID }}" >> .env
 
       - name: react build
         run: npm run build
diff --git a/package-lock.json b/package-lock.json
index e370eaa..1470208 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -27,6 +27,7 @@
         "lodash": "^4.17.21",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
+        "react-ga4": "^2.1.0",
         "react-naver-maps": "^0.1.3",
         "react-router-dom": "^7.1.1",
         "react-table": "^7.8.0",
@@ -4185,6 +4186,12 @@
         "react": "^18.3.1"
       }
     },
+    "node_modules/react-ga4": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/react-ga4/-/react-ga4-2.1.0.tgz",
+      "integrity": "sha512-ZKS7PGNFqqMd3PJ6+C2Jtz/o1iU9ggiy8Y8nUeksgVuvNISbmrQtJiZNvC/TjDsqD0QlU5Wkgs7i+w9+OjHhhQ==",
+      "license": "MIT"
+    },
     "node_modules/react-is": {
       "version": "18.3.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
diff --git a/package.json b/package.json
index eaf7658..30b45af 100644
--- a/package.json
+++ b/package.json
@@ -29,6 +29,7 @@
     "lodash": "^4.17.21",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
+    "react-ga4": "^2.1.0",
     "react-naver-maps": "^0.1.3",
     "react-router-dom": "^7.1.1",
     "react-table": "^7.8.0",
diff --git a/src/App.tsx b/src/App.tsx
index 0863e18..e7c1f95 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -5,6 +5,9 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import GlobalStyle from './styles/globalStyle';
 import './styles/font.css';
 import { NotificationProvider } from './components/NotificationProvider';
+import { NavermapsProvider } from 'react-naver-maps';
+import { BrowserRouter } from 'react-router-dom';
+
 function App() {
   const queryClient = new QueryClient();
   return (
@@ -12,7 +15,13 @@ function App() {
       <QueryClientProvider client={queryClient}>
         <ThemeProvider theme={theme}>
           <GlobalStyle />
-          <Router />
+          <NavermapsProvider
+            ncpClientId={`${import.meta.env.VITE_NAVER_MAP_ID}`}
+          >
+            <BrowserRouter>
+              <Router />
+            </BrowserRouter>
+          </NavermapsProvider>
         </ThemeProvider>
       </QueryClientProvider>
       <NotificationProvider />
diff --git a/src/Router.tsx b/src/Router.tsx
index ef2e222..d16290a 100644
--- a/src/Router.tsx
+++ b/src/Router.tsx
@@ -1,5 +1,6 @@
-import { NavermapsProvider } from 'react-naver-maps';
-import { BrowserRouter, Routes, Route } from 'react-router-dom';
+import { Routes, Route, useLocation } from 'react-router-dom';
+import { useEffect } from 'react';
+import ReactGA from 'react-ga4';
 import LoginPage from './pages/LoginPage/LoginPage';
 import MapPage from './pages/MapPage/MapPage';
 import ManagePage from './pages/ManagePage/ManagePage';
@@ -11,33 +12,46 @@ import Home from './pages/ManagePage/Home';
 import SteepSlopeDup from './pages/ManagePage/StepSlope/StepSlopeOutlier/SteepSlopeDup';
 import SteepSlopeEmpty from './pages/ManagePage/StepSlope/StepSlopeOutlier/SteepSlopeEmpty';
 const Router = () => {
+  const location = useLocation();
+
+  useEffect(() => {
+    ReactGA.initialize(import.meta.env.VITE_GA_TRACKING_ID, {
+      gtagOptions: {
+        debug_mode: import.meta.env.DEV,
+      },
+    });
+  }, []);
+
+  useEffect(() => {
+    ReactGA.send({
+      hitType: 'pageview',
+      page: location.pathname + location.search,
+      title: document.title,
+    });
+  }, [location]);
   return (
-    <NavermapsProvider ncpClientId={`${import.meta.env.VITE_NAVER_MAP_ID}`}>
-      <BrowserRouter>
-        <Routes>
-          <Route path="/" element={<LoginPage />} />
-          <Route path="/map" element={<MapPage />} />
-          <Route path="/manage" element={<ManagePage />}>
-            <Route index element={<Home />} />
-            <Route path="home" element={<Home />} />
-            <Route path="slope">
-              <Route path="list" element={<SteepSlopeLookUp />} />
-              <Route path="add" element={<SteepSlopeAdd />} />
-            </Route>
-            <Route path="outlier">
-              <Route path="empty" element={<SteepSlopeEmpty />} />
-              <Route path="dup" element={<SteepSlopeDup />} />
-              <Route path="location" element={<SteepSlopeDup />} />
-            </Route>
-            <Route path="member">
-              <Route path="list" element={<UserLookUp />} />
-              <Route path="edit" element={<UserModi />} />
-            </Route>
-            <Route path="map" element={<MapPage />} />
-          </Route>
-        </Routes>
-      </BrowserRouter>
-    </NavermapsProvider>
+    <Routes>
+      <Route path="/" element={<LoginPage />} />
+      <Route path="/map" element={<MapPage />} />
+      <Route path="/manage" element={<ManagePage />}>
+        <Route index element={<Home />} />
+        <Route path="home" element={<Home />} />
+        <Route path="slope">
+          <Route path="list" element={<SteepSlopeLookUp />} />
+          <Route path="add" element={<SteepSlopeAdd />} />
+        </Route>
+        <Route path="outlier">
+          <Route path="empty" element={<SteepSlopeEmpty />} />
+          <Route path="dup" element={<SteepSlopeDup />} />
+          <Route path="location" element={<SteepSlopeDup />} />
+        </Route>
+        <Route path="member">
+          <Route path="list" element={<UserLookUp />} />
+          <Route path="edit" element={<UserModi />} />
+        </Route>
+        <Route path="map" element={<MapPage />} />
+      </Route>
+    </Routes>
   );
 };
 export default Router;