:sparkles routes 구현

src/app.js

@@ -2,27 +2,48 @@ import Error404Page from "./pages/404/404";
 import HomePage from "./pages/home/home-page";
 import LoginPage from "./pages/login/login-page";
 import { ProfilePage } from "./pages/profile/profile-page";
-import { MyRouter } from "./shared/router/router";
 
-function createRouter(routes) {
-  return (path) => {
-    const route = routes[path] || routes["404"];
-    return route;
-  };
-}
-const routes = {
-  "/": HomePage,
-  "/profile": ProfilePage,
-  "/login": LoginPage,
-  404: Error404Page,
-};
+export const routes = {
+  target: (pathname, hash) => {
+    if (pathname === "/" && hash === "") {
+      return HomePage;
+    }
+
+    if (hash === "") {
+      const routeList = {
+        "^/$": HomePage,
+        "^/login": LoginPage,
+        "^/profile": ProfilePage,
+        ".*": Error404Page,
+      };
+
+      return routeList[
+        Object.keys(routeList).find((route) =>
+          new RegExp(route).test(pathname),
+        ) ?? ".*"
+      ];
+    }
 
-const router = createRouter(routes);
+    const routeList = {
+      "^#/$": HomePage,
+      "^#/login": LoginPage,
+      "^#/profile": ProfilePage,
+      ".*": Error404Page,
+    };
+
+    return routeList[
+      Object.keys(routeList).find((route) => new RegExp(route).test(hash)) ??
+        ".*"
+    ];
+  },
+};
 
 export const App = {
   render: () => {
-    const path = MyRouter.pathname;
-    const CurrentPage = router(path);
+    const CurrentPage = routes.target(
+      window.location.pathname,
+      window.location.hash,
+    );
     document.querySelector("#root").innerHTML = CurrentPage();
     CurrentPage.eventFn?.();
   },