LikeLion-12th-SKHU · SuKyeong2002 · Jul 24, 2024 · Jul 21, 2024 · Jul 21, 2024 · Jul 22, 2024
diff --git a/.gitignore b/.gitignore
@@ -69,4 +69,8 @@ sketch
 .history
 .ionide
 
-# End of https://www.toptal.com/developers/gitignore/api/react,macos,visualstudiocode
+# End of https://www.toptal.com/developers/gitignore/api/react,macos,visualstudiocode
+
+
+# 환경 변수 파일
+.env
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -3,8 +3,9 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@react-oauth/google": "^0.12.1",
     "@reduxjs/toolkit": "^2.2.6",
-    "@tanstack/react-query": "^5.51.1",
+    "@tanstack/react-query": "^5.51.11",
     "@tanstack/react-query-devtools": "^5.51.1",
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^13.4.0",
@@ -15,12 +16,15 @@
     "react-redux": "^9.1.2",
     "react-router-dom": "^6.24.1",
     "react-scripts": "5.0.1",
+    "recoil": "^0.7.7",
     "redux": "^5.0.1",
-    "styled-components": "^6.1.11",
+    "styled-components": "^6.1.12",
     "styled-reset": "^4.5.2",
     "web-vitals": "^2.1.4"
   },
   "scripts": {
+    "format": "prettier --write .",
+    "lint": "eslint .",
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
@@ -45,6 +49,7 @@
     ]
   },
   "devDependencies": {
+    "eslint": "^8.57.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.1.3",
     "prettier": "^3.3.3"

diff --git a/public/favicon.ico b/public/favicon.ico
@@ -0,0 +1,19 @@
+server {
+    listen 80;
+    server_name moodfriend.site;
+
+    location / {
+        root /path/to/your/site;
+        index index.html index.htm;
+    }
+
+    location = /favicon.ico {
+        root /path/to/your/site/public;
+    }
+
+    location / {
+        try_files $uri /index.html;
+    }
+
+    # 다른 설정들...
+}
diff --git a/public/index.html b/public/index.html
@@ -2,9 +2,9 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <!-- <link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> -->
+    <link rel="icon" href="/favicon.ico" />
     <!-- 리셋 css 추가 -->
-    <link rel="stylesheet" href="%PUBLIC_URL%/reset.css" />
+    <link rel="stylesheet" href="/reset.css" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <title>React App</title>

diff --git a/src/App.js b/src/App.js
@@ -2,6 +2,10 @@
 
 import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
 import GlobalStyle from "./styles/GlobalStyle";
+import Login from "./pages/auth/Login";
+import KakaoLogin from "./pages/auth/KakaoLogin";
+import GoogleLogin from "./pages/auth/GoogleLogin";
+import Signup from "./pages/auth/Signup";
 import { Main } from "./pages/Main";
 import Chat from "./pages/chat/Chat";
 import Friends from "./pages/friends/Friends";
@@ -13,6 +17,10 @@ function App() {
     <Router>
       <GlobalStyle />
       <Routes>
+        <Route path="/auth/login" element={<Login />} />
+        <Route path="/auth/callback/kakao" element={<KakaoLogin />} />
+        <Route path="/auth/callback/google" element={<GoogleLogin />} />
+        <Route path="/auth/signUp" element={<Signup />} />
         <Route path="/" element={<Main />} />
         <Route path="/chat" element={<Chat />} />
         <Route path="/friends" element={<Friends />} />

diff --git a/src/api/api.js b/src/api/api.js
@@ -0,0 +1,4 @@
+const K_REST_API_KEY = process.env.REACT_APP_K_REST_API_KEY;
+const K_REDIRECT_URL = process.env.REACT_APP_REDIRECT_URL;
+
+export const kakaoURL = `https://kauth.kakao.com/oauth/authorize?client_id=${K_REST_API_KEY}&redirect_uri=${K_REDIRECT_URL}&response_type=code`;
diff --git a/src/assets/icons/AngryHoya.svg b/src/assets/icons/AngryHoya.svg
diff --git a/src/assets/icons/Dialog.svg b/src/assets/icons/Dialog.svg
diff --git a/src/assets/icons/Google.svg b/src/assets/icons/Google.svg
diff --git a/src/assets/icons/HeartObj.svg b/src/assets/icons/HeartObj.svg
diff --git a/src/assets/icons/Kakao.svg b/src/assets/icons/Kakao.svg
diff --git a/src/assets/icons/Lock.svg b/src/assets/icons/Lock.svg
diff --git a/src/assets/icons/Mileage.svg b/src/assets/icons/Mileage.svg
diff --git a/src/assets/icons/Obj.svg b/src/assets/icons/Obj.svg
diff --git a/src/assets/icons/Window.svg b/src/assets/icons/Window.svg
diff --git a/src/components/KakaoCallback.jsx b/src/components/KakaoCallback.jsx
diff --git a/src/index.js b/src/index.js
@@ -1,12 +1,19 @@
-// index.js
-
 import React from "react";
 import ReactDOM from "react-dom/client";
 import App from "./App";
+import { ThemeProvider } from "styled-components";
+import theme from "./styles/theme";
+import { GoogleOAuthProvider } from "@react-oauth/google";
+
+const clientId = process.env.REACT_APP_G_CLIENT_ID;
 
 const root = ReactDOM.createRoot(document.getElementById("root"));
 root.render(
   <React.StrictMode>
-    <App />
+    <GoogleOAuthProvider clientId={clientId}>
+      <ThemeProvider theme={theme}>
+        <App />
+      </ThemeProvider>
+    </GoogleOAuthProvider>
   </React.StrictMode>
 );