feat: routes lazy loading 적용

src/App.tsx

@@ -1,6 +1,10 @@
 import './App.css';
 import { RecoilRoot } from 'recoil';
-import { createBrowserRouter, RouterProvider } from 'react-router-dom';
+import {
+  createBrowserRouter,
+  RouteObject,
+  RouterProvider,
+} from 'react-router-dom';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import DetailPetPage from 'pages/detailPet/DetailPetPage';
 import ProfileListPage from 'pages/profileList/ProfileListPage';
@@ -11,65 +15,73 @@ import RegisterPage from 'pages/register/RegisterPage';
 import ShelterInfoPage from 'pages/shelterInfo/ShelterInfoPage';
 import SignupPage from 'pages/signUp/SignupPage';
 import UrgentListPage from 'pages/profileList/urgentList/UrgentListPage';
-import UpdatePage from 'pages/update/UpdatePage';
-import HomePage from 'pages/home/HomePage';
 import ValidateCheckLayout from 'layouts/ValidateCheckLayout';
 import EditProfilePage from 'pages/editProfile/EditProfilePage';
 import GNB from 'layouts/GNB';
 import NotFound from 'pages/notFound/NotFound';
+import HomePage from 'pages/home/HomePage';
+import UpdatePage from 'pages/update/UpdatePage';
 
 const queryClient = new QueryClient({
   defaultOptions: {
     queries: { refetchOnWindowFocus: false, refetchOnMount: false },
   },
 });
 
-const router = createBrowserRouter([
+const routes = [
   {
     element: <GNB />,
     children: [
       {
         element: <ValidateCheckLayout />,
-
         children: [
           {
             path: '/',
             element: <HomePage />,
           },
           {
             path: '/pet/:id',
+            lazy: () => import('pages/detailPet/DetailPetPage'),
             element: <DetailPetPage />,
           },
           {
             path: '/profile',
+            lazy: () => import('pages/profileList/ProfileListPage'),
             element: <ProfileListPage />,
           },
           {
             path: '/shelter/:id/:page',
+            lazy: () => import('pages/shelterInfo/ShelterInfoPage'),
             element: <ShelterInfoPage />,
           },
           {
             path: '/profile/urgent/:page',
+            lazy: () => import('pages/profileList/urgentList/UrgentListPage'),
             element: <UrgentListPage />,
           },
           {
             path: '/profile/new/:page',
+            lazy: () => import('pages/profileList/newList/NewListPage'),
             element: <NewListPage />,
           },
           {
             path: '/register',
+            lazy: () => import('pages/register/RegisterPage'),
             element: <RegisterPage />,
           },
           {
             path: '/find-shelter',
+            lazy: () => import('pages/map/MapPage'),
             element: <MapPage />,
           },
           {
             path: '/pet-update/:id',
+            lazy: () => import('pages/update/UpdatePage'),
             element: <UpdatePage />,
           },
           {
             path: '/shelter/:id/edit',
+            lazy: () => import('pages/home/HomePage'),
             element: <EditProfilePage />,
           },
           {
@@ -92,7 +104,9 @@ const router = createBrowserRouter([
       },
     ],
   },
-]);
+];
+
+const router = createBrowserRouter(routes as RouteObject[]);
 
 function App() {
   return (

src/pages/signUp/components/SignupInputForm.tsx

@@ -79,6 +79,7 @@ const SignupInputForm = () => {
 
   // 이메일 중복 검사 api
   const duplicateCheck = async () => {
+    setErrors({});
     setIsLoading((prev) => ({ ...prev, duplicateCheckIsLoading: true }));
     await fetch(`${process.env.REACT_APP_URI}/account/email`, {
       method: 'POST',
@@ -219,11 +220,11 @@ const SignupInputForm = () => {
    * 유효성 검사 시행
    * userFetch가 동작하는 동안 Loader를 보여주기 위해 isLoading state 사용
    */
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
-    validationCheck();
+    await validationCheck();
     setIsLoading((prev) => ({ ...prev, submitIsLoading: true }));
-    userFetch();
+    await userFetch();
   };
 
   const SignupInputFormProps = {