diff --git a/package-lock.json b/package-lock.json
index f498eb7..8a81467 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -18,6 +18,7 @@
         "react-router-dom": "^6.21.0",
         "react-scripts": "5.0.1",
         "recoil": "^0.7.7",
+        "recoil-persist": "^5.1.0",
         "styled-components": "^6.1.1",
         "web-vitals": "^2.1.4"
       },
@@ -15291,6 +15292,14 @@
         }
       }
     },
+    "node_modules/recoil-persist": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/recoil-persist/-/recoil-persist-5.1.0.tgz",
+      "integrity": "sha512-sew4k3uBVJjRWKCSFuBw07Y1p1pBOb0UxLJPxn4G2bX/9xNj+r2xlqYy/BRfyofR/ANfqBU04MIvulppU4ZC0w==",
+      "peerDependencies": {
+        "recoil": "^0.7.2"
+      }
+    },
     "node_modules/recursive-readdir": {
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/recursive-readdir/-/recursive-readdir-2.2.3.tgz",
diff --git a/package.json b/package.json
index 5b205b8..061589a 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
     "react-router-dom": "^6.21.0",
     "react-scripts": "5.0.1",
     "recoil": "^0.7.7",
+    "recoil-persist": "^5.1.0",
     "styled-components": "^6.1.1",
     "web-vitals": "^2.1.4"
   },
diff --git a/src/Router.js b/src/Router.js
index 3a926ab..53bd593 100644
--- a/src/Router.js
+++ b/src/Router.js
@@ -11,8 +11,9 @@ import { TestResult5 } from "./pages/TestResult5";
 import { TestResult6 } from "./pages/TestResult6";
 import { TestResult7 } from "./pages/TestResult7";
 import { TestResult8 } from "./pages/TestResult8";
-import KakaoShareButton from './pages/Kakao';
+import KakaoShareButton from "./pages/Kakao";
 import { Frame } from "./pages/Frame";
+import Login from "./pages/Login";
 
 const Router = () => {
   return (
@@ -21,6 +22,7 @@ const Router = () => {
         <Route path="/" element={<Main />} />
         <Route path="/test/:step" element={<TestPage />} />
         <Route path="/loading" element={<Loading />} />
+        <Route path="/login" element={<Login />} />
         <Route path="/one" element={<TestResult1 />} />
         <Route path="/two" element={<TestResult2 />} />
         <Route path="/three" element={<TestResult3 />} />
@@ -30,7 +32,7 @@ const Router = () => {
         <Route path="/seven" element={<TestResult7 />} />
         <Route path="/eight" element={<TestResult8 />} />
         <Route path="/nine" element={<Frame />} />
-        <Route path="/ten" element={<KakaoShareButton/>} />
+        <Route path="/ten" element={<KakaoShareButton />} />
       </Routes>
     </BrowserRouter>
   );
diff --git a/src/components/LoginModal/index.jsx b/src/components/LoginModal/index.jsx
index aa6d0a5..d614ce3 100644
--- a/src/components/LoginModal/index.jsx
+++ b/src/components/LoginModal/index.jsx
@@ -1,5 +1,6 @@
-import React from "react";
-import { useNavigate } from "react-router-dom";
+import React, { useEffect } from "react";
+import axios from "axios";
+import { useNavigate, useLocation } from "react-router-dom";
 import {
   Container,
   GoogleButton,
@@ -11,26 +12,36 @@ import kakao from "../../assets/images/kakao.png";
 
 const LoginModal = () => {
   const navigate = useNavigate();
+  const location = useLocation();
 
   const handleNonmemberButtonClick = () => {
     navigate("/test/0");
   };
 
-  const handleGoogleLogin = () => {
-    window.location.href = `https://www.noonsachin.com/oauth2/authorization/google`;
+  const handleLogin = provider => {
+    window.location.href = `https://www.noonsachin.com/oauth2/authorization/${provider}`;
   };
 
-  const handleKakaoLogin = () => {
-    window.location.href = `https://www.noonsachin.com/oauth2/authorization/kakao`;
-  };
+  useEffect(() => {
+    // Parse the URL to get the JWT
+    const jwt = new URL(window.location.href).searchParams.get("jwt");
+    console.log(jwt);
+    if (jwt) {
+      // If JWT exists, set it in the headers
+      axios.defaults.headers.common["Authorization"] = `Bearer ${jwt}`;
+
+      // Redirect to the home screen
+      navigate("/");
+    }
+  }, [navigate, location.search]);
 
   return (
     <Container>
-      <GoogleButton onClick={handleGoogleLogin}>
+      <GoogleButton onClick={() => handleLogin("google")}>
         <img src={google} alt="google" />
         &nbsp;Google 계정으로 로그인
       </GoogleButton>
-      <KakaoButton onClick={handleKakaoLogin}>
+      <KakaoButton onClick={() => handleLogin("kakao")}>
         <img src={kakao} alt="kakao" />
         &nbsp;카카오톡으로 로그인
       </KakaoButton>
diff --git a/src/pages/Login/index.jsx b/src/pages/Login/index.jsx
new file mode 100644
index 0000000..329727b
--- /dev/null
+++ b/src/pages/Login/index.jsx
@@ -0,0 +1,37 @@
+import React, { useEffect } from "react";
+import axios from "axios";
+import { useNavigate, useLocation } from "react-router-dom";
+import { useSetRecoilState } from "recoil";
+import { loginState } from "../../store/atoms";
+
+const Login = () => {
+  const navigate = useNavigate();
+  const location = useLocation();
+  const setLoginState = useSetRecoilState(loginState);
+
+  useEffect(() => {
+    // Parse the URL to get the JWT
+    const jwt = new URL(window.location.href).searchParams.get("jwt");
+
+    if (jwt) {
+      // If JWT exists, set it in the headers
+      axios.defaults.headers.common["Authorization"] = `Bearer ${jwt}`;
+
+      // Set login state to true
+      setLoginState(true);
+
+      // Redirect to the home screen
+      navigate("/");
+      console.log("로그인!");
+    }
+  }, [navigate, location.search, setLoginState]);
+
+  return (
+    <div>
+      {/* You can add a loading spinner or other UI elements here */}
+      Logging in...
+    </div>
+  );
+};
+
+export default Login;
diff --git a/src/pages/Login/styled.js b/src/pages/Login/styled.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/store/atoms.js b/src/store/atoms.js
index 0071dbe..f9d3a64 100644
--- a/src/store/atoms.js
+++ b/src/store/atoms.js
@@ -1,4 +1,5 @@
 import { atom } from "recoil";
+import { recoilPersist } from "recoil-persist";
 
 export const testState = atom({
   key: "testState",
@@ -12,3 +13,14 @@ export const testState = atom({
     O: 0,
   },
 });
+
+const { persistAtom } = recoilPersist({
+  key: "recoil-persist",
+  storage: sessionStorage,
+});
+
+export const loginState = atom({
+  key: "loginState",
+  default: false,
+  effects_UNSTABLE: [persistAtom],
+});