diff --git a/src/App.js b/src/App.js index 5cc4e04429253c8e61e8ed46aa29cb1895ea63ec..ced608297dd51f7c0fcd3ecfe928027287ec9d50 100644 --- a/src/App.js +++ b/src/App.js @@ -11,6 +11,7 @@ import Footer from "./components/layout/Footer"; import BodyLayout from "./components/layout/BodyLayout"; import HeaderLogoBar from "./components/layout/HeaderLogoBar"; import SchedulePage from "./pages/SchedulePage"; +import NotFoundPage from "./pages/NotFoundPage"; const App = () => { return ( @@ -29,6 +30,7 @@ const App = () => { /> <Route path="/mypage" element={<MyPage />} /> <Route path="/login" element={<LoginPage />} /> + <Route path="*" element={<NotFoundPage />} /> </Routes> </BodyLayout> <Footer /> diff --git a/src/pages/NotFoundPage.jsx b/src/pages/NotFoundPage.jsx new file mode 100644 index 0000000000000000000000000000000000000000..1612743a87c72c75b47d422d1a30767456af679e --- /dev/null +++ b/src/pages/NotFoundPage.jsx @@ -0,0 +1,28 @@ +import React from "react"; +import { useNavigate } from "react-router-dom"; +import Button from "../components/Button"; // 기존 디자인 시스템의 버튼 컴포넌트 + +const NotFoundPage = () => { + const navigate = useNavigate(); + + const handleGoHome = () => { + navigate("/"); + }; + + return ( + <div className="flex flex-col items-center justify-center min-h-screen text-center bg-gray-50"> + <h1 className="text-6xl font-bold text-primary-500">404</h1> + <p className="mt-4 text-lg text-gray-700"> + 페이지를 찾을 수 없습니다. 잘못된 URL을 입력했거나 페이지가 삭제되었을 + 수 있습니다. + </p> + <div className="mt-6"> + <Button size="lg" theme="indigo" onClick={handleGoHome}> + 홈으로 이동 + </Button> + </div> + </div> + ); +}; + +export default NotFoundPage;