SKRF-132 로그인 api 서버에 요청

src/apis/auth/kakaoLogin.ts

@@ -0,0 +1,10 @@
+import { User } from '@/types/user';
+
+import { END_POINTS } from '@constants/api';
+
+import { axiosClient } from '../axiosClient';
+
+export const kakaoLogin = async (code: string) => {
+  const { data } = await axiosClient.post<User>(END_POINTS.KAKAO_LOGIN, { code });
+  return data;
+};

src/apis/axiosClient.ts

@@ -0,0 +1,12 @@
+import axios from 'axios';
+
+import { NETWORK_TIMEOUT, SPACECLUB_BASE_URL } from '@constants/api';
+
+export const axiosClient = axios.create({
+  baseURL: SPACECLUB_BASE_URL,
+  headers: {
+    'Content-Type': 'application/json',
+  },
+  withCredentials: true,
+  timeout: NETWORK_TIMEOUT,
+});

src/constants/api.ts

@@ -0,0 +1,9 @@
+const SPACECLUB_BASE_URL = 'https://spaceclub.site';
+
+const NETWORK_TIMEOUT = 10000;
+
+const END_POINTS = {
+  KAKAO_LOGIN: '/login/kakao',
+};
+
+export { SPACECLUB_BASE_URL, NETWORK_TIMEOUT, END_POINTS };

src/pages/OauthRedirectPage.tsx

@@ -1,9 +1,20 @@
+import { kakaoLogin } from '@/apis/auth/kakaoLogin';
+
 import { useEffect } from 'react';
 
 const OauthRedirectPage = () => {
   const authCode = new URL(window.location.href).searchParams.get('code');
 
-  useEffect(() => {}, []);
+  useEffect(() => {
+    if (!authCode) {
+      throw new Error('인증 코드가 없습니다.');
+    }
+
+    kakaoLogin(authCode).then(({ accessToken }) => {
+      localStorage.setItem('accessToken', accessToken);
+      window.location.href = '/';
+    });
+  });
 
   return <div>OauthRedirectPage</div>;
 };

src/types/user.ts

@@ -0,0 +1,5 @@
+interface User {
+  accessToken: string;
+}
+
+export { User };

tsconfig.json

@@ -11,24 +11,24 @@
     "lib": ["DOM", "DOM.Iterable", "ESNext"],
     "jsx": "react-jsx",
     "allowJs": true,
-    "baseUrl": "./",
+    "baseUrl": ".",
     "paths": {
-      "@/*": ["src/*"],
-      "@components/*": ["src/components/*"],
-      "@type/*": ["src/types/*"],
-      "@hooks/*": ["src/hooks/*"],
-      "@pages/*": ["src/pages/*"],
-      "@styles/*": ["src/styles/*"],
-      "@constants/*": ["src/constants/*"],
-      "@assets/*": ["src/assets/*"],
-      "@api/*": ["src/api/*"],
-      "@router/*": ["src/router/*"],
-      "@store/*": ["src/store/*"],
-      "@utils/*": ["src/utils/*"]
+      "@/*": ["./src/*"],
+      "@components/*": ["./src/components/*"],
+      "@types/*": ["./src/types/*"],
+      "@hooks/*": ["./src/hooks/*"],
+      "@pages/*": ["./src/pages/*"],
+      "@styles/*": ["./src/styles/*"],
+      "@constants/*": ["./src/constants/*"],
+      "@assets/*": ["./src/assets/*"],
+      "@api/*": ["./src/api/*"],
+      "@router/*": ["./src/router/*"],
+      "@store/*": ["./src/store/*"],
+      "@utils/*": ["./src/utils/*"]
     },
     "jsxImportSource": "@emotion/react",
     "allowSyntheticDefaultImports": true
   },
   "exclude": ["node_modules"],
-  "include": ["src", "**/*.ts", "**/*.tsx"]
+  "include": ["**/*.ts", "**/*.tsx"]
 }