diff --git a/apps/admin/src/App.tsx b/apps/admin/src/App.tsx
index 831a8292..40c6d13b 100644
--- a/apps/admin/src/App.tsx
+++ b/apps/admin/src/App.tsx
@@ -2,6 +2,7 @@ import { QueryClientProvider } from '@boolti/api';
import { createBrowserRouter, RouterProvider, Navigate } from 'react-router-dom';
import ThemeProvider from './styles/ThemeProvider';
import LoginPage from './pages/Login/LoginPage';
+import SignUpCompletePage from './pages/SignUpComplete/SignUpCompletePage';
import 'the-new-css-reset/css/reset.css';
import './index.css';
@@ -14,6 +15,11 @@ const router = createBrowserRouter([
path: '/login',
element: ,
},
+ {
+ path: '/signup/complete',
+ element: ,
+ },
+ { path: '/home', element: <>> },
{
path: '*',
element: ,
diff --git a/apps/admin/src/pages/Login/LoginPage.tsx b/apps/admin/src/pages/Login/LoginPage.tsx
index 4039708b..db3ae5a3 100644
--- a/apps/admin/src/pages/Login/LoginPage.tsx
+++ b/apps/admin/src/pages/Login/LoginPage.tsx
@@ -1,8 +1,11 @@
import Styled from './LoginPage.styles';
import kakaoIconUrl from '../../assets/svg/kakao.svg';
import appleIconUrl from '../../assets/svg/apple.svg';
+import { useNavigate } from 'react-router-dom';
const LoginPage = () => {
+ const navigate = useNavigate();
+
return (
@@ -17,13 +20,21 @@ const LoginPage = () => {
티켓을 불티나게 팔아보세요!
-
+ {
+ navigate('/signup/complete');
+ }}
+ >
카카오톡으로 시작하기
-
+ {
+ navigate('/signup/complete');
+ }}
+ >
diff --git a/apps/admin/src/pages/SignUpComplete/SignUpCompletePage.styles.ts b/apps/admin/src/pages/SignUpComplete/SignUpCompletePage.styles.ts
new file mode 100644
index 00000000..5af028e3
--- /dev/null
+++ b/apps/admin/src/pages/SignUpComplete/SignUpCompletePage.styles.ts
@@ -0,0 +1,72 @@
+import styled from '@emotion/styled';
+import { Link } from 'react-router-dom';
+
+const SignUpCompletePage = styled.div`
+ width: 100vw;
+ height: 100vh;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ background-color: ${({ theme }) => theme.palette.grey.g20};
+`;
+
+const SignUpCompleteContent = styled.div``;
+
+const Card = styled.div`
+ width: 600px;
+ background-color: ${({ theme }) => theme.palette.grey.w};
+ box-shadow: 0px 8px 14px 0px #8b8b8b26;
+ margin-bottom: 40px;
+ border-radius: 8px;
+`;
+
+const CardContent = styled.div`
+ padding: 60px 0;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+`;
+
+const CardContentTitle = styled.h3`
+ ${({ theme }) => theme.typo.h3};
+ color: ${({ theme }) => theme.palette.grey.g90};
+ text-align: center;
+ margin-bottom: 4px;
+`;
+
+const CardContentDescription = styled.p`
+ ${({ theme }) => theme.typo.b3};
+ color: ${({ theme }) => theme.palette.grey.g70};
+ margin-bottom: 40px;
+`;
+
+const CardContentLink = styled(Link)`
+ ${({ theme }) => theme.typo.b3};
+ color: ${({ theme }) => theme.palette.grey.g70};
+ font-weight: 600;
+ text-decoration: underline;
+ margin-bottom: 40px;
+`;
+
+const StartButton = styled.button`
+ width: 388px;
+ height: 48px;
+ display: inline-flex;
+ justify-content: center;
+ align-items: center;
+ background-color: ${({ theme }) => theme.palette.primary.o1};
+ color: ${({ theme }) => theme.palette.grey.w};
+ border-radius: 4px;
+ cursor: pointer;
+`;
+
+export default {
+ SignUpCompletePage,
+ SignUpCompleteContent,
+ Card,
+ CardContent,
+ CardContentTitle,
+ CardContentDescription,
+ CardContentLink,
+ StartButton,
+};
diff --git a/apps/admin/src/pages/SignUpComplete/SignUpCompletePage.tsx b/apps/admin/src/pages/SignUpComplete/SignUpCompletePage.tsx
new file mode 100644
index 00000000..9a70b18d
--- /dev/null
+++ b/apps/admin/src/pages/SignUpComplete/SignUpCompletePage.tsx
@@ -0,0 +1,47 @@
+import { useNavigate } from 'react-router-dom';
+import Styled from './SignUpCompletePage.styles';
+
+const SignUpCompletePage = () => {
+ const navigate = useNavigate();
+
+ return (
+
+
+
+
+ {/* Note: 추후 이미지 교체 */}
+
+ img
+
+ 어서오세요 %사용자명%님!
+
+ 원활한 이용을 위해{' '}
+
+ 서비스 이용약관
+ {' '}
+ 확인 후 동의해주세요.
+
+ {
+ navigate('/home');
+ }}
+ >
+ 약관 동의하고 시작하기
+
+
+
+ {/* Note: 추후 로고로 교체 */}
+ Boolti logo
+
+
+ );
+};
+
+export default SignUpCompletePage;