diff --git a/src/main.js b/src/main.js
index bb1c9f17..4c063c52 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,53 +1,7 @@
 import { createRouter } from "@/router/createRouter";
-import UserStore from "@/store/userStore";
+import { submitEventHandler, clickEventHandler } from "./utils";
 
-const { router, navigator } = createRouter();
-
-function submitEventHandler(e) {
-  e.preventDefault();
-  const form = e.target;
-  const formData = new FormData(form);
-  const { id } = form;
-
-  if (id === "login-form") {
-    login(formData);
-  }
-
-  if (id === "profile-form") {
-    updateProfile(formData);
-  }
-}
-
-function login(formData) {
-  const username = formData.get("username");
-  if (username) {
-    new UserStore().setUser({ username, email: "", bio: "" });
-    navigator("/profile");
-  }
-}
-
-function updateProfile(formData) {
-  const username = formData.get("username");
-  const email = formData.get("email");
-  const bio = formData.get("bio");
-  new UserStore().setUser({ username, email, bio });
-  navigator("/profile");
-}
-
-function clickEventHandler(e) {
-  const { id, tagName } = e.target;
-
-  if (tagName === "A") {
-    e.preventDefault();
-    const { href } = e.target;
-    let path = new URL(href).pathname;
-    if (id === "logout") {
-      new UserStore().deleteUser();
-      path = "/login";
-    }
-    navigator(path);
-  }
-}
+const { router } = createRouter();
 
 document.body.addEventListener("submit", submitEventHandler);
 document.body.addEventListener("click", clickEventHandler);
diff --git a/src/utils/clickEventHandler.js b/src/utils/clickEventHandler.js
new file mode 100644
index 00000000..fe00057d
--- /dev/null
+++ b/src/utils/clickEventHandler.js
@@ -0,0 +1,19 @@
+import { createRouter } from "@/router/createRouter";
+import UserStore from "@/store/userStore";
+
+const { navigator } = createRouter();
+
+export function clickEventHandler(e) {
+  const { id, tagName } = e.target;
+
+  if (tagName === "A") {
+    e.preventDefault();
+    const { href } = e.target;
+    let path = new URL(href).pathname;
+    if (id === "logout") {
+      new UserStore().deleteUser();
+      path = "/login";
+    }
+    navigator(path);
+  }
+}
diff --git a/src/utils/index.js b/src/utils/index.js
new file mode 100644
index 00000000..2b5e621f
--- /dev/null
+++ b/src/utils/index.js
@@ -0,0 +1,2 @@
+export * from "./clickEventHandler";
+export * from "./submitEventHandler";
diff --git a/src/utils/submitEventHandler.js b/src/utils/submitEventHandler.js
new file mode 100644
index 00000000..15754df4
--- /dev/null
+++ b/src/utils/submitEventHandler.js
@@ -0,0 +1,35 @@
+import { createRouter } from "@/router/createRouter";
+import UserStore from "@/store/userStore";
+
+const { navigator } = createRouter();
+
+export function submitEventHandler(e) {
+  e.preventDefault();
+  const form = e.target;
+  const formData = new FormData(form);
+  const { id } = form;
+
+  if (id === "login-form") {
+    login(formData);
+  }
+
+  if (id === "profile-form") {
+    updateProfile(formData);
+  }
+}
+
+function login(formData) {
+  const username = formData.get("username");
+  if (username) {
+    new UserStore().setUser({ username, email: "", bio: "" });
+    navigator("/profile");
+  }
+}
+
+function updateProfile(formData) {
+  const username = formData.get("username");
+  const email = formData.get("email");
+  const bio = formData.get("bio");
+  new UserStore().setUser({ username, email, bio });
+  navigator("/profile");
+}