구글 애널리틱스 삽입 (#641)

feat: 구글 애널리틱스 추가
woowacourse-teams · Oct 10, 2023 · af8d9a9 · af8d9a9
1 parent c290f45
commit af8d9a9
Show file tree

Hide file tree

Showing 3 changed files with 77 additions and 4 deletions.
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/package.json b/frontend/package.json
@@ -21,8 +21,10 @@
     "@types/react-dom": "^18.2.6",
     "core-js": "^3.31.1",
     "dotenv": "^16.3.1",
+    "history": "^5.3.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-ga": "^3.3.1",
     "react-router-dom": "^6.14.2",
     "styled-components": "^6.0.4"
   },

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -8,6 +8,20 @@ import LoadingPage from './pages/LoadingPage';
 import ModalProvider from './contexts/ModalContext';
 import { QueryClientProvider } from '@tanstack/react-query';
 import { queryClient } from './hooks/query/queryClient';
+import ReactGA from 'react-ga';
+import { createBrowserHistory } from 'history';
+
+const gaTrackingId = process.env.REACT_APP_GA_TRACKING_ID;
+if (gaTrackingId) {
+  ReactGA.initialize(gaTrackingId);
+}
+
+const history = createBrowserHistory();
+history.listen((response: { location: { pathname: string } }) => {
+  console.log(response.location.pathname);
+  ReactGA.set({ page: response.location.pathname });
+  ReactGA.pageview(response.location.pathname);
+});
 
 const App = () => {
   ChannelService.loadScript();