From 2a6505bf26985454d245c69ed49824bc788309d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9E=A5=EC=9B=90=EC=A0=95?= <tazoal@tazoal.local>
Date: Tue, 17 Dec 2024 21:00:58 +0900
Subject: [PATCH] =?UTF-8?q?refactor:=20=EC=9D=B4=EB=B2=A4=ED=8A=B8=20?=
 =?UTF-8?q?=ED=95=A8=EC=88=98=20=EB=B6=84=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/main.js                     | 50 ++-------------------------------
 src/utils/clickEventHandler.js  | 19 +++++++++++++
 src/utils/index.js              |  2 ++
 src/utils/submitEventHandler.js | 35 +++++++++++++++++++++++
 4 files changed, 58 insertions(+), 48 deletions(-)
 create mode 100644 src/utils/clickEventHandler.js
 create mode 100644 src/utils/index.js
 create mode 100644 src/utils/submitEventHandler.js

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");
+}