diff --git a/frontend/package.json b/frontend/package.json
index ce1e457..984cd55 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -16,7 +16,9 @@
     "@reduxjs/toolkit": "^1.6.1",
     "antd": "^4.16.13",
     "axios": "^0.22.0",
+    "babel-eslint": "^10.1.0",
     "craco-less": "^1.20.0",
+    "history": "4.10.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-icons": "^4.3.1",
@@ -40,6 +42,7 @@
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-react": "^7.25.1",
+    "eslint-plugin-react-hooks": "^4.3.0",
     "file-loader": "^6.2.0",
     "html-webpack-plugin": "^5.3.2",
     "mini-css-extract-plugin": "^2.2.2",
diff --git a/frontend/src/components/auth/sign-in.js b/frontend/src/components/auth/sign-in.js
new file mode 100644
index 0000000..e69de29
diff --git a/frontend/src/components/auth/sign-up.js b/frontend/src/components/auth/sign-up.js
new file mode 100644
index 0000000..c152338
--- /dev/null
+++ b/frontend/src/components/auth/sign-up.js
@@ -0,0 +1,175 @@
+import React, { useState } from 'react';
+import { Input, Checkbox, Button, Alert, message } from 'antd';
+import styled from 'styled-components';
+import {
+  EMAIL,
+  ESSENTIAL,
+  ESSENTIAL_TEXT,
+  NICK_NAME,
+  PASSWORD,
+  PASSWORD_CONFIRM,
+  SIGN_UP,
+  TERMS_OF_USE,
+  USER_INFO,
+  FULL_CONSENT,
+  REQUIRED_CHECK,
+} from '../../constants';
+import { theme } from '../../style/theme';
+
+const CheckboxGroup = Checkbox.Group;
+const plainOptions = [
+  '이용약관동의',
+  '개인정보처리방침 동의',
+  '개인정보 수집 및 이용 동의',
+];
+
+const Wrapper = styled.div`
+  display: flex;
+  width: 100%;
+  height: 100%;
+  justify-content: center;
+  align-items: center;
+`;
+
+const InnerWrapper = styled.div`
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  width: 700px;
+`;
+
+const Title = styled.p`
+  font-family: ${theme.fontNotoSans};
+  font-size: ${theme.fontSizeTitle02};
+  font-weight: ${theme.weightBold};
+`;
+
+const Essential = styled.span`
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-end;
+`;
+
+const EssentialText = styled.span`
+  margin-left: 7px;
+  font-size: ${theme.fontSizeBody03};
+  color: #ff0000;
+`;
+
+const Div = styled.div`
+  padding: 12.5px;
+  padding-top: 21px;
+  width: 550px;
+`;
+
+const TopLine = styled.div`
+  border-top: 1px solid ${theme.colorLine};
+`;
+
+const ButtonAntd = styled(Button)`
+  width: 500px;
+  height: 50px;
+  font-size: ${theme.fontSizeTitle02};
+  border-radius: 6px;
+  margin-top: 10px;
+`;
+
+function SignUp({ handleChange, handleSignUp, emptyValueCheck }) {
+  const [checkedList, setCheckedList] = useState('');
+  const [checkAll, setCheckAll] = useState(false);
+
+  const onChange = (list) => {
+    setCheckedList(list);
+    setCheckAll(list.length === plainOptions.length);
+  };
+
+  const onCheckAllChange = (e) => {
+    setCheckedList(e.target.checked ? plainOptions : []);
+    setCheckAll(e.target.checked);
+  };
+
+  return (
+    <Wrapper>
+      <InnerWrapper>
+        <Title>{SIGN_UP}</Title>
+        <Div>
+          {USER_INFO}
+          <TopLine style={{ marginTop: '10px' }} />
+          <Essential style={{ fontSize: '12px', paddingTop: '4px' }}>
+            *{ESSENTIAL}
+          </Essential>
+        </Div>
+        <Div>
+          <EssentialText>*</EssentialText>
+          {EMAIL}
+          <Input
+            style={{ marginTop: '9px' }}
+            name="email"
+            className="input-area"
+            onChange={handleChange}
+            onBlur={emptyValueCheck}
+            placeholder="이메일 주소를 입력해주세요."
+          />
+        </Div>
+        <Div>
+          <EssentialText>*</EssentialText>
+          {NICK_NAME}
+          <Input
+            style={{ marginTop: '9px' }}
+            name="nickname"
+            onChange={handleChange}
+            onBlur={emptyValueCheck}
+            placeholder="닉네임을 입력해주세요."
+          />
+        </Div>
+        <Div>
+          <EssentialText>*</EssentialText>
+          {PASSWORD}
+          <Input.Password
+            style={{ marginTop: '9px' }}
+            name="password"
+            onChange={handleChange}
+            onBlur={emptyValueCheck}
+            placeholder="비밀번호를 입력해주세요."
+          />
+        </Div>
+        <Div>
+          <EssentialText>*</EssentialText>
+          {PASSWORD_CONFIRM}
+          <Input.Password
+            style={{ marginTop: '9px' }}
+            name="passwordConfirm"
+            onChange={handleChange}
+            onBlur={emptyValueCheck}
+            placeholder="비밀번호 확인을 입력해주세요."
+          />
+        </Div>
+        <Div style={{ marginTop: '65px' }}>
+          {TERMS_OF_USE}
+          <TopLine style={{ marginTop: '10px' }} />
+        </Div>
+        <Div>
+          <Checkbox onChange={onCheckAllChange} checked={checkAll}>
+            {FULL_CONSENT}
+          </Checkbox>
+        </Div>
+        <Div>
+          <CheckboxGroup
+            options={plainOptions}
+            value={checkedList}
+            onChange={onChange}
+          />
+        </Div>
+        <Div>
+          <ButtonAntd type="primary" onClick={handleSignUp}>
+            {SIGN_UP}
+          </ButtonAntd>
+        </Div>
+      </InnerWrapper>
+    </Wrapper>
+  );
+}
+
+export default SignUp;
diff --git a/frontend/src/constants/index.js b/frontend/src/constants/index.js
index 73fb39b..1f05ea6 100644
--- a/frontend/src/constants/index.js
+++ b/frontend/src/constants/index.js
@@ -19,10 +19,17 @@ export const ESSENTIAL = '필수입력항목';
 export const TERMS_OF_USE = '이용약관';
 export const FULL_CONSENT = '전체동의';
 export const ESSENTIAL_TEXT = '*위 항목은 필수항목입니다.';
+export const EMPTY_EMAIL = '이메일 주소를 입력해주세요.';
+export const EMPTY_NICKNAME = '닉네임을 입력해주세요.';
+export const EMPTY_PASSWORD = '비밀번호를 입력해주세요.';
+export const EMPTY_PASSWORD_CONFIRM = '비밀번호 확인을 입력해주세요.';
+export const SIGN_UP_SUCCESS = '회원가입이 완료되었습니다.';
+export const REQUIRED_CHECK = '필수항목을 입력해주세요.';
 
 export const HOME = '홈으로';
 export const ERROR_CONTENT_F = '찾을수 없는 페이지 입니다.';
-export const ERROR_CONTENT_S = '요청하신 페이지가 사라졌거나 잘못된 경로입니다.';
+export const ERROR_CONTENT_S =
+  '요청하신 페이지가 사라졌거나 잘못된 경로입니다.';
 export const ERROR_CODE = '404';
 
 export const POST_SUBMIT = '게시하기';
diff --git a/frontend/src/containers/auth/sign-in-container.js b/frontend/src/containers/auth/sign-in-container.js
new file mode 100644
index 0000000..e69de29
diff --git a/frontend/src/containers/auth/sign-up-container.js b/frontend/src/containers/auth/sign-up-container.js
new file mode 100644
index 0000000..3eada90
--- /dev/null
+++ b/frontend/src/containers/auth/sign-up-container.js
@@ -0,0 +1,73 @@
+import React, { useEffect, useState } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import styled from 'styled-components';
+import { signUp } from '../../store/auth';
+import SignUp from '../../components/auth/sign-up';
+import { message, notification } from 'antd';
+import { REQUIRED_CHECK, SIGN_UP_SUCCESS } from '../../constants';
+
+const Wrapper = styled.div`
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+`;
+
+function SignUpContainer() {
+  const selector = useSelector((state) => state.auth);
+  const dispatch = useDispatch();
+
+  const [info, setInfo] = useState({
+    email: '',
+    nickname: '',
+    password: '',
+    passwordConfirm: '',
+  });
+  const [isEmpty, setIsEmpty] = useState(false);
+
+  const onChangeHandler = (e) => {
+    setInfo({
+      ...info,
+      [e.target.name]: e.target.value,
+    });
+  };
+
+  const onSignUpHandler = (e) => {
+    const res = dispatch({ type: signUp.type, data: info });
+    res !== undefined ? openNotification() : '';
+  };
+
+  const openNotification = () => {
+    notification.success({
+      message: 'CIAT',
+      description: SIGN_UP_SUCCESS,
+    });
+  };
+
+  const emptyError = (e) => {
+    setIsEmpty(true);
+    message.error(REQUIRED_CHECK);
+  };
+
+  const notEmptyError = (e) => {
+    setIsEmpty(false);
+  };
+
+  const emptyValueCheck = (e) => {
+    e.target.name === e.currentTarget.name && e.target.value === ''
+      ? emptyError(e)
+      : notEmptyError(e);
+  };
+
+  return (
+    <Wrapper>
+      <SignUp
+        handleChange={onChangeHandler}
+        handleSignUp={onSignUpHandler}
+        emptyValueCheck={emptyValueCheck}
+      />
+    </Wrapper>
+  );
+}
+
+export default SignUpContainer;
diff --git a/frontend/src/index.js b/frontend/src/index.js
index cb265d0..4916945 100644
--- a/frontend/src/index.js
+++ b/frontend/src/index.js
@@ -7,6 +7,7 @@ import { configureStore } from '@reduxjs/toolkit';
 import logger from 'redux-logger';
 import rootReducer, { rootSaga } from './store';
 import './style/theme.less';
+import history from './lib/router/history';
 
 const sagaMiddleware = createSagaMiddleware();
 
@@ -24,7 +25,7 @@ sagaMiddleware.run(rootSaga);
 
 ReactDom.render(
   <Provider store={store}>
-    <Router />
+    <Router history={history} />
   </Provider>,
   document.getElementById('root')
 );
diff --git a/frontend/src/lib/router/history.js b/frontend/src/lib/router/history.js
new file mode 100644
index 0000000..9937105
--- /dev/null
+++ b/frontend/src/lib/router/history.js
@@ -0,0 +1,3 @@
+import { createBrowserHistory } from 'history';
+
+export default createBrowserHistory();
diff --git a/frontend/src/lib/router/index.js b/frontend/src/lib/router/index.js
index 3fc819e..075c0b6 100644
--- a/frontend/src/lib/router/index.js
+++ b/frontend/src/lib/router/index.js
@@ -19,10 +19,11 @@ import Setting from '../../pages/setting';
 import SignUp from '../../pages/auth/sign-up';
 import FeedDetail from '../../pages/feed-detail';
 import NotFound from '../../pages/error';
+import history from './history';
 
 function index() {
   return (
-    <BrowserRouter>
+    <BrowserRouter history={history}>
       <Switch>
         <Route exact path={SIGN_IN_URL} component={SignIn} />
         <Route exact path={SIGN_UP_URL} component={SignUp} />
diff --git a/frontend/src/pages/auth/sign-up.js b/frontend/src/pages/auth/sign-up.js
index affcec3..07a7356 100644
--- a/frontend/src/pages/auth/sign-up.js
+++ b/frontend/src/pages/auth/sign-up.js
@@ -1,159 +1,11 @@
-import React, { useState } from 'react';
-import { Input, Checkbox, Button } from 'antd';
-import styled from 'styled-components';
+import React from 'react';
 import SiteLayout from '../../components/common/layout';
-import {
-  EMAIL,
-  ESSENTIAL,
-  ESSENTIAL_TEXT,
-  NICK_NAME,
-  PASSWORD,
-  PASSWORD_CONFIRM,
-  SIGN_UP,
-  TERMS_OF_USE,
-  TITLE,
-  USER_INFO,
-  FULL_CONSENT,
-} from '../../constants';
-import { theme } from '../../style/theme';
-
-const CheckboxGroup = Checkbox.Group;
-const plainOptions = [
-  '이용약관동의',
-  '개인정보처리방침 동의',
-  '개인정보 수집 및 이용 동의',
-];
-
-const Wrapper = styled.div`
-  display: flex;
-  width: 100%;
-  height: 100%;
-  justify-content: center;
-  align-items: center;
-`;
-
-const InnerWrapper = styled.div`
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  width: 700px;
-`;
-
-const Title = styled.p`
-  font-family: ${theme.fontNotoSans};
-  font-size: ${theme.fontSizeTitle02};
-  font-weight: ${theme.weightBold};
-`;
-
-const Essential = styled.span`
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: flex-end;
-`;
-
-const EssentialText = styled.span`
-  margin-left: 7px;
-  font-size: ${theme.fontSizeBody03};
-  color: #cb6c6c;
-`;
-
-const Div = styled.div`
-  padding: 12.5px;
-  padding-top: 21px;
-  width: 550px;
-`;
-
-const TopLine = styled.div`
-  border-top: 1px solid ${theme.colorLine};
-`;
-
-const ButtonAntd = styled(Button)`
-  width: 500px;
-  height: 50px;
-  font-size: ${theme.fontSizeTitle02};
-  border-radius: 6px;
-  margin-top: 10px;
-`;
+import SignUpContainer from '../../containers/auth/sign-up-container';
 
 function SignUp() {
-  const [checkedList, setCheckedList] = useState('');
-  const [checkAll, setCheckAll] = useState(false);
-
-  const onChange = (list) => {
-    setCheckedList(list);
-    setCheckAll(list.length === plainOptions.length);
-  };
-
-  const onCheckAllChange = (e) => {
-    setCheckedList(e.target.checked ? plainOptions : []);
-    setCheckAll(e.target.checked);
-  };
-
   return (
     <SiteLayout>
-      <Wrapper>
-        <InnerWrapper>
-          <Title>{SIGN_UP}</Title>
-          <Div>
-            {USER_INFO}
-            <TopLine style={{ marginTop: '10px' }} />
-            {/* <Divider /> --> antd 라인 있음 */}
-            <Essential style={{ fontSize: '12px', paddingTop: '4px' }}>
-              *{ESSENTIAL}
-            </Essential>
-          </Div>
-          <Div>
-            {EMAIL}
-            <EssentialText>{ESSENTIAL_TEXT}</EssentialText>
-            <Input
-              placeholder="이메일 주소를 입력해주세요."
-              style={{ marginTop: '9px' }}
-            />
-          </Div>
-          <Div>
-            {NICK_NAME}
-            <Input
-              placeholder="닉네임을 입력해주세요."
-              style={{ marginTop: '9px' }}
-            />
-          </Div>
-          <Div>
-            {PASSWORD}
-            <Input.Password
-              placeholder="비밀번호를 입력해주세요."
-              style={{ marginTop: '9px' }}
-            />
-          </Div>
-          <Div>
-            {PASSWORD_CONFIRM}
-            <Input.Password
-              placeholder="비밀번호 확인을 입력해주세요."
-              style={{ marginTop: '9px' }}
-            />
-          </Div>
-          <Div style={{ marginTop: '65px' }}>
-            {TERMS_OF_USE}
-            <TopLine style={{ marginTop: '10px' }} />
-          </Div>
-          <Div>
-            <Checkbox onChange={onCheckAllChange} checked={checkAll}>
-              {FULL_CONSENT}
-            </Checkbox>
-          </Div>
-          <Div>
-            <CheckboxGroup
-              options={plainOptions}
-              value={checkedList}
-              onChange={onChange}
-            />
-          </Div>
-          <Div>
-            <ButtonAntd type="primary">{SIGN_UP}</ButtonAntd>
-          </Div>
-        </InnerWrapper>
-      </Wrapper>
+      <SignUpContainer />
     </SiteLayout>
   );
 }
diff --git a/frontend/src/pages/home.js b/frontend/src/pages/home.js
index 9d99887..f90bb07 100644
--- a/frontend/src/pages/home.js
+++ b/frontend/src/pages/home.js
@@ -4,7 +4,7 @@ import { Button, Card, Input, Space } from 'antd';
 import { MinusOutlined, PlusOutlined } from '@ant-design/icons';
 import { getDecrement, getIncrement } from '../store/counter';
 import SiteLayout from '../components/common/layout';
-import { getGoogleLogin } from '../store/auth';
+/* import { getGoogleLogin } from '../store/auth'; */
 
 function Home() {
   const count = useSelector((state) => state.counter.value);
@@ -29,12 +29,12 @@ function Home() {
             >
               <PlusOutlined />
             </Button>
-            <Button
+            {/* <Button
               type="primary"
               onClick={() => dispatch({ type: getGoogleLogin.type })}
             >
               <PlusOutlined />
-            </Button>
+            </Button> */}
           </Space>
         </Card>
       </Space>
diff --git a/frontend/src/saga/auth.js b/frontend/src/saga/auth.js
index 04b3d59..0bccdab 100644
--- a/frontend/src/saga/auth.js
+++ b/frontend/src/saga/auth.js
@@ -1,12 +1,32 @@
 import { put } from 'redux-saga/effects';
 import * as authStore from '../store/auth';
-import { authAPI } from '../utils/api/auth';
+import { SIGN_UP_API } from '../utils/api/auth';
 import axios from 'axios';
+import history from '../lib/router/history';
 
 import { INNER_ERROR } from '../constants';
 import { finishLoading, startLoading } from '../store/loding';
+import { message, notification } from 'antd';
 
-function* googleLoginSaga(action) {
+function* signUpSaga(action) {
+  try {
+    yield put(startLoading(authStore.signUp));
+    const { data } = yield axios.post(SIGN_UP_API, action.data);
+    yield put({ type: authStore.signUp, payload: data });
+  } catch (e) {
+    console.log(e);
+    /* if(axios.isAxiosError(e)) {
+      const { errorMessage } = e.response.data;
+      yield put({
+        type: authStore.
+      })
+    } */
+  } finally {
+    yield put(finishLoading(authStore.signUp));
+  }
+}
+
+/* function* googleLoginSaga(action) {
   try {
     yield put(startLoading(authStore.getGoogleLogin));
     const { data } = yield axios.get(authAPI.GOOGLE_LOGIN(params.payload));
@@ -29,5 +49,5 @@ function* googleLoginSaga(action) {
   } finally {
     yield put(finishLoading(authStore.getGoogleLogin));
   }
-}
-export { googleLoginSaga };
+} */
+export { signUpSaga };
diff --git a/frontend/src/store/auth.js b/frontend/src/store/auth.js
index 88c20e1..ec926f3 100644
--- a/frontend/src/store/auth.js
+++ b/frontend/src/store/auth.js
@@ -1,24 +1,21 @@
 import { takeLatest } from 'redux-saga/effects';
 import { createSlice } from '@reduxjs/toolkit';
-import { googleLoginSaga } from '../saga/auth';
+import { signUpSaga } from '../saga/auth';
 
 const initialState = {
-  googleSignup: {
-    error: null,
+  data: {
+    email: '',
+    nickname: '',
+    password: '',
+    passwordConfirm: '',
   },
 };
 const authSlice = createSlice({
   name: 'auth',
   initialState,
   reducers: {
-    getGoogleLogin: (state) => state,
-    getGoogleLoginSuccess: (state, action) => {
-      state.user.userId = action.payload.userId;
-      localStorage.setItem('user', action.payload.accessToken);
-      return state;
-    },
-    getGoogleLoginFail: (state, action) => {
-      state.googleSignup.error = action.payload;
+    signUp: (state, action) => {
+      state = action.data;
       return state;
     },
   },
@@ -26,11 +23,10 @@ const authSlice = createSlice({
 
 const { actions, reducer: authReducer } = authSlice;
 
-export const { getGoogleLogin, getGoogleLoginSuccess, getGoogleLoginFail } =
-  actions;
+export const { signUp } = actions;
 
-export { authReducer, initialState };
+export { authReducer };
 
 export function* authSaga() {
-  yield takeLatest(getGoogleLogin.type, googleLoginSaga);
+  yield takeLatest(signUp.type, signUpSaga);
 }
diff --git a/frontend/src/utils/api/auth.js b/frontend/src/utils/api/auth.js
index 1fee95f..ac76eab 100644
--- a/frontend/src/utils/api/auth.js
+++ b/frontend/src/utils/api/auth.js
@@ -10,3 +10,6 @@ export const authAPI = {
   GOOGLE_LOGIN: `${API_END_POINT}/test`,
   GET_POST: (id) => `${API_END_POINT}/board/${id}`,
 };
+
+export const SIGN_UP_API =
+  'https://ciat-bakend.choicloudlab.com/api/v1/user/signup';
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 662ed16..877b01e 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -59,6 +59,13 @@
   dependencies:
     "@babel/highlight" "^7.10.4"
 
+"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.16.0":
+  version "7.16.0"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.16.0.tgz#0dfc80309beec8411e65e706461c408b0bb9b431"
+  integrity sha512-IF4EOMEV+bfYwOmNxGzSnjR2EmQod7f1UXOpZM3l4i4o4QNwzjtJAu/HxdjHq0aYBvdqMuQEY1eg0nqW9ZPORA==
+  dependencies:
+    "@babel/highlight" "^7.16.0"
+
 "@babel/code-frame@^7.14.5":
   version "7.14.5"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.14.5.tgz#23b08d740e83f49c5e59945fbf1b43e80bbf4edb"
@@ -101,6 +108,15 @@
     jsesc "^2.5.1"
     source-map "^0.5.0"
 
+"@babel/generator@^7.16.0":
+  version "7.16.0"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.16.0.tgz#d40f3d1d5075e62d3500bccb67f3daa8a95265b2"
+  integrity sha512-RR8hUCfRQn9j9RPKEVXo9LiwoxLPYn6hNZlvUOR8tSnaxlD0p0+la00ZP9/SnRt6HchKr+X0fO2r8vrETiJGew==
+  dependencies:
+    "@babel/types" "^7.16.0"
+    jsesc "^2.5.1"
+    source-map "^0.5.0"
+
 "@babel/helper-annotate-as-pure@^7.0.0", "@babel/helper-annotate-as-pure@^7.14.5", "@babel/helper-annotate-as-pure@^7.15.4":
   version "7.15.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.15.4.tgz#3d0e43b00c5e49fdb6c57e421601a7a658d5f835"
@@ -176,6 +192,15 @@
     "@babel/template" "^7.15.4"
     "@babel/types" "^7.15.4"
 
+"@babel/helper-function-name@^7.16.0":
+  version "7.16.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.16.0.tgz#b7dd0797d00bbfee4f07e9c4ea5b0e30c8bb1481"
+  integrity sha512-BZh4mEk1xi2h4HFjWUXRQX5AEx4rvaZxHgax9gcjdLWdkjsY7MKt5p0otjsg5noXw+pB+clMCjw+aEVYADMjog==
+  dependencies:
+    "@babel/helper-get-function-arity" "^7.16.0"
+    "@babel/template" "^7.16.0"
+    "@babel/types" "^7.16.0"
+
 "@babel/helper-get-function-arity@^7.15.4":
   version "7.15.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.15.4.tgz#098818934a137fce78b536a3e015864be1e2879b"
@@ -183,6 +208,13 @@
   dependencies:
     "@babel/types" "^7.15.4"
 
+"@babel/helper-get-function-arity@^7.16.0":
+  version "7.16.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.16.0.tgz#0088c7486b29a9cb5d948b1a1de46db66e089cfa"
+  integrity sha512-ASCquNcywC1NkYh/z7Cgp3w31YW8aojjYIlNg4VeJiHkqyP4AzIvr4qx7pYDb4/s8YcsZWqqOSxgkvjUz1kpDQ==
+  dependencies:
+    "@babel/types" "^7.16.0"
+
 "@babel/helper-hoist-variables@^7.15.4":
   version "7.15.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.15.4.tgz#09993a3259c0e918f99d104261dfdfc033f178df"
@@ -190,6 +222,13 @@
   dependencies:
     "@babel/types" "^7.15.4"
 
+"@babel/helper-hoist-variables@^7.16.0":
+  version "7.16.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.16.0.tgz#4c9023c2f1def7e28ff46fc1dbcd36a39beaa81a"
+  integrity sha512-1AZlpazjUR0EQZQv3sgRNfM9mEVWPK3M6vlalczA+EECcPz3XPh6VplbErL5UoMpChhSck5wAJHthlj1bYpcmg==
+  dependencies:
+    "@babel/types" "^7.16.0"
+
 "@babel/helper-member-expression-to-functions@^7.15.4":
   version "7.15.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.15.4.tgz#bfd34dc9bba9824a4658b0317ec2fd571a51e6ef"
@@ -270,11 +309,23 @@
   dependencies:
     "@babel/types" "^7.15.4"
 
+"@babel/helper-split-export-declaration@^7.16.0":
+  version "7.16.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.16.0.tgz#29672f43663e936df370aaeb22beddb3baec7438"
+  integrity sha512-0YMMRpuDFNGTHNRiiqJX19GjNXA4H0E8jZ2ibccfSxaCogbm3am5WN/2nQNj0YnQwGWM1J06GOcQ2qnh3+0paw==
+  dependencies:
+    "@babel/types" "^7.16.0"
+
 "@babel/helper-validator-identifier@^7.14.5", "@babel/helper-validator-identifier@^7.14.9":
   version "7.14.9"
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.9.tgz#6654d171b2024f6d8ee151bf2509699919131d48"
   integrity sha512-pQYxPY0UP6IHISRitNe8bsijHex4TWZXi2HwKVsjPiltzlhse2znVcm9Ace510VT1kxIHjGJCZZQBX2gJDbo0g==
 
+"@babel/helper-validator-identifier@^7.15.7":
+  version "7.15.7"
+  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.15.7.tgz#220df993bfe904a4a6b02ab4f3385a5ebf6e2389"
+  integrity sha512-K4JvCtQqad9OY2+yTU8w+E82ywk/fe+ELNlt1G8z3bVGlZfn/hOcQQsUhGhW/N+tb3fxK800wLtKOE/aM0m72w==
+
 "@babel/helper-validator-option@^7.14.5":
   version "7.14.5"
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.14.5.tgz#6e72a1fff18d5dfcb878e1e62f1a021c4b72d5a3"
@@ -308,11 +359,25 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
+"@babel/highlight@^7.16.0":
+  version "7.16.0"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.16.0.tgz#6ceb32b2ca4b8f5f361fb7fd821e3fddf4a1725a"
+  integrity sha512-t8MH41kUQylBtu2+4IQA3atqevA2lRgqA2wyVB/YiWmsDSuylZZuXOUy9ric30hfzauEFfdsuk/eXTRrGrfd0g==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.15.7"
+    chalk "^2.0.0"
+    js-tokens "^4.0.0"
+
 "@babel/parser@^7.15.4", "@babel/parser@^7.15.5":
   version "7.15.5"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.15.5.tgz#d33a58ca69facc05b26adfe4abebfed56c1c2dac"
   integrity sha512-2hQstc6I7T6tQsWzlboMh3SgMRPaS4H6H7cPQsJkdzTzEGqQrpLDsE2BGASU5sBPoEQyHzeqU6C8uKbFeEk6sg==
 
+"@babel/parser@^7.16.0", "@babel/parser@^7.16.3", "@babel/parser@^7.7.0":
+  version "7.16.4"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.16.4.tgz#d5f92f57cf2c74ffe9b37981c0e72fee7311372e"
+  integrity sha512-6V0qdPUaiVHH3RtZeLIsc+6pDhbYzHR8ogA8w+f+Wc77DuXto19g2QUwveINoS34Uw+W8/hQDGJCx+i4n7xcng==
+
 "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@^7.15.4":
   version "7.15.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.15.4.tgz#dbdeabb1e80f622d9f0b583efb2999605e0a567e"
@@ -954,6 +1019,15 @@
     "@babel/parser" "^7.15.4"
     "@babel/types" "^7.15.4"
 
+"@babel/template@^7.16.0":
+  version "7.16.0"
+  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.16.0.tgz#d16a35ebf4cd74e202083356fab21dd89363ddd6"
+  integrity sha512-MnZdpFD/ZdYhXwiunMqqgyZyucaYsbL0IrjoGjaVhGilz+x8YB++kRfygSOIj1yOtWKPlx7NBp+9I1RQSgsd5A==
+  dependencies:
+    "@babel/code-frame" "^7.16.0"
+    "@babel/parser" "^7.16.0"
+    "@babel/types" "^7.16.0"
+
 "@babel/traverse@^7.13.0", "@babel/traverse@^7.15.4", "@babel/traverse@^7.4.5":
   version "7.15.4"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.15.4.tgz#ff8510367a144bfbff552d9e18e28f3e2889c22d"
@@ -969,6 +1043,21 @@
     debug "^4.1.0"
     globals "^11.1.0"
 
+"@babel/traverse@^7.7.0":
+  version "7.16.3"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.16.3.tgz#f63e8a938cc1b780f66d9ed3c54f532ca2d14787"
+  integrity sha512-eolumr1vVMjqevCpwVO99yN/LoGL0EyHiLO5I043aYQvwOJ9eR5UsZSClHVCzfhBduMAsSzgA/6AyqPjNayJag==
+  dependencies:
+    "@babel/code-frame" "^7.16.0"
+    "@babel/generator" "^7.16.0"
+    "@babel/helper-function-name" "^7.16.0"
+    "@babel/helper-hoist-variables" "^7.16.0"
+    "@babel/helper-split-export-declaration" "^7.16.0"
+    "@babel/parser" "^7.16.3"
+    "@babel/types" "^7.16.0"
+    debug "^4.1.0"
+    globals "^11.1.0"
+
 "@babel/types@^7.14.9", "@babel/types@^7.15.4", "@babel/types@^7.4.4":
   version "7.15.4"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.15.4.tgz#74eeb86dbd6748d2741396557b9860e57fce0a0d"
@@ -977,6 +1066,14 @@
     "@babel/helper-validator-identifier" "^7.14.9"
     to-fast-properties "^2.0.0"
 
+"@babel/types@^7.16.0", "@babel/types@^7.7.0":
+  version "7.16.0"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.16.0.tgz#db3b313804f96aadd0b776c4823e127ad67289ba"
+  integrity sha512-PJgg/k3SdLsGb3hhisFvtLOw5ts113klrpLuIPtCJIU+BB24fqq6lf8RWqKJEjzqXR9AEH1rIb5XTqwBHB+kQg==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.15.7"
+    to-fast-properties "^2.0.0"
+
 "@ctrl/tinycolor@^3.4.0":
   version "3.4.0"
   resolved "https://registry.yarnpkg.com/@ctrl/tinycolor/-/tinycolor-3.4.0.tgz#c3c5ae543c897caa9c2a68630bed355be5f9990f"
@@ -1608,6 +1705,18 @@ axios@^0.22.0:
   dependencies:
     follow-redirects "^1.14.4"
 
+babel-eslint@^10.1.0:
+  version "10.1.0"
+  resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-10.1.0.tgz#6968e568a910b78fb3779cdd8b6ac2f479943232"
+  integrity sha512-ifWaTHQ0ce+448CYop8AdrQiBsGrnC+bMgfyKFdi6EsPLTAWG+QfyDeM6OH+FmWnKvEq5NnBMLvlBUPKQZoDSg==
+  dependencies:
+    "@babel/code-frame" "^7.0.0"
+    "@babel/parser" "^7.7.0"
+    "@babel/traverse" "^7.7.0"
+    "@babel/types" "^7.7.0"
+    eslint-visitor-keys "^1.0.0"
+    resolve "^1.12.0"
+
 babel-loader@^8.2.2:
   version "8.2.2"
   resolved "https://registry.yarnpkg.com/babel-loader/-/babel-loader-8.2.2.tgz#9363ce84c10c9a40e6c753748e1441b60c8a0b81"
@@ -2432,6 +2541,11 @@ eslint-plugin-prettier@^4.0.0:
   dependencies:
     prettier-linter-helpers "^1.0.0"
 
+eslint-plugin-react-hooks@^4.3.0:
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.3.0.tgz#318dbf312e06fab1c835a4abef00121751ac1172"
+  integrity sha512-XslZy0LnMn+84NEG9jSGR6eGqaZB3133L8xewQo3fQagbQuGt7a63gf+P1NGKZavEYEC3UXaWEAA/AqDkuN6xA==
+
 eslint-plugin-react@^7.25.1:
   version "7.25.1"
   resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.25.1.tgz#9286b7cd9bf917d40309760f403e53016eda8331"
@@ -2466,7 +2580,7 @@ eslint-utils@^2.1.0:
   dependencies:
     eslint-visitor-keys "^1.1.0"
 
-eslint-visitor-keys@^1.1.0, eslint-visitor-keys@^1.3.0:
+eslint-visitor-keys@^1.0.0, eslint-visitor-keys@^1.1.0, eslint-visitor-keys@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz#30ebd1ef7c2fdff01c3a4f151044af25fab0523e"
   integrity sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==
@@ -2933,7 +3047,7 @@ he@^1.2.0:
   resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
   integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==
 
-history@^4.9.0:
+history@4.10.1, history@^4.9.0:
   version "4.10.1"
   resolved "https://registry.yarnpkg.com/history/-/history-4.10.1.tgz#33371a65e3a83b267434e2b3f3b1b4c58aad4cf3"
   integrity sha512-36nwAD620w12kuzPAsyINPWJqlNbij+hpK1k9XRloDtym8mxzGYl2c17LnV6IAGB2Dmg4tEa7G7DlawS0+qjew==
@@ -4872,7 +4986,7 @@ resolve-pathname@^3.0.0:
   resolved "https://registry.yarnpkg.com/resolve-pathname/-/resolve-pathname-3.0.0.tgz#99d02224d3cf263689becbb393bc560313025dcd"
   integrity sha512-C7rARubxI8bXFNB/hqcp/4iUeIXJhJZvFPFPiSPRnhU5UPxzMFIl+2E6yY6c4k9giDJAhtV+enfA+G89N6Csng==
 
-resolve@^1.14.2, resolve@^1.9.0:
+resolve@^1.12.0, resolve@^1.14.2, resolve@^1.9.0:
   version "1.20.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.20.0.tgz#629a013fb3f70755d6f0b7935cc1c2c5378b1975"
   integrity sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==