ErrorPage 완성

client/src/App.js

@@ -6,19 +6,22 @@ import SchedulePage from "./pages/SchedulePage";
 import ScheduleEditPage from "./pages/ScheduleEditPage";
 import AdminPage from "./pages/AdminPage";
 import PrivateRoute from "./components/PrivateRoute";
-import Err from "./pages/ErrorPage";
+import ErrorPage from "./pages/ErrorPage";
 
 function App() {
   return (
-    <Router basename={process.env.PUBLIC_URL}>
-      <div id="box" className="mx-sm-auto">
+    <Router basename={process.env.REACT_APP_ROUTE_URL}>
+      <div id="box" className="container mx-sm-auto">
         <Switch>
-          <Route exact path="/" component={Err} />
+          <Route exact path="/" component={LoginPage} />
+          <Route path="/login" component={LoginPage} />
           <Route path="/signup" component={SignupPage} />
           <Route path="/home" component={HomePage} />
           <Route path="/schedule/edit" component={ScheduleEditPage} />
           <Route path="/schedule" component={SchedulePage} />
           <PrivateRoute path="/admin" component={AdminPage} role="admin" />
+
+          <Route component={ErrorPage} />
         </Switch>
       </div>
     </Router>

client/src/pages/ErrorPage.js

 const ErrorPage = () => {
     return (
-        <div className="d-flex bg-white" id="notfound">
-            <div className="notfound">
-                <img src="./ku-tiger.png" />
-                <h1>404</h1>
-                <h2 className="text-center">Oops! Page Not Be Found</h2>
-                <p>Sorry but the page you are looking for does not exist, have been removed. name changed or is temporarily unavailable</p>
-                <a className="text-center" href="/login">Back to login</a>
-            </div>
+        <div className="d-flex flex-column justify-content-center align-items-center vh-100">
+            <img className="mb-5" src={process.env.PUBLIC_URL + '/ku-tiger.png'} alt="어흥이" />
+            <h2>Oops! Page Not Be Found</h2>
+            <p>Sorry but the page you are looking for does not exist, have been removed. name changed or is temporarily unavailable</p>
+            <a href="/login">Back to login</a>
         </div>
     )
 }