diff --git a/index.html b/index.html
index d422693..7271468 100644
--- a/index.html
+++ b/index.html
@@ -9,7 +9,7 @@
diff --git a/package.json b/package.json
index 37a264c..8eb6760 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,6 @@
},
"devDependencies": {
"typescript": "^5.0.2",
- "vite": "^4.4.5"
+ "vite": "^4.5.0"
}
}
diff --git a/src/main.ts b/src/main.ts
index e69de29..18d2eab 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -0,0 +1,42 @@
+const $ = (selector: string) => document.querySelector(selector);
+
+const num1Input = $('input[type="number"]:nth-of-type(1)') as HTMLInputElement;
+const num2Input = $('input[type="number"]:nth-of-type(2)') as HTMLInputElement;
+const selectOperator = $('select[name="calculate"]') as HTMLSelectElement;
+const resultDisplay = $("h3") as HTMLHeadingElement;
+const calculateButton = $("button");
+
+function calculateResult() {
+ const num1 = parseFloat(num1Input.value);
+ const num2 = parseFloat(num2Input.value);
+ const operator = selectOperator.value;
+
+ let result: number;
+
+ switch (operator) {
+ case "sum":
+ result = num1 + num2;
+ break;
+ case "sub":
+ result = num1 - num2;
+ break;
+ case "mul":
+ result = num1 * num2;
+ break;
+ case "divide":
+ result = num1 / num2;
+ break;
+ default:
+ result = NaN;
+ }
+
+ if (isNaN(result)) {
+ resultDisplay.textContent = "계산 불가";
+ } else {
+ resultDisplay.textContent = result.toString();
+ }
+}
+
+if (calculateButton) {
+ calculateButton.addEventListener("click", calculateResult);
+}
diff --git a/yarn.lock b/yarn.lock
index d92d861..44bf209 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -181,7 +181,7 @@ typescript@^5.0.2:
resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.2.2.tgz#5ebb5e5a5b75f085f22bc3f8460fba308310fa78"
integrity sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==
-vite@^4.4.5:
+vite@^4.5.0:
version "4.5.0"
resolved "https://registry.yarnpkg.com/vite/-/vite-4.5.0.tgz#ec406295b4167ac3bc23e26f9c8ff559287cff26"
integrity sha512-ulr8rNLA6rkyFAlVWw2q5YJ91v098AFQ2R0PRFwPzREXOUJQPtFUG0t+/ZikhaOCDqFoDhN6/v8Sq0o4araFAw==