diff --git a/QandA/frontend/src/Header.tsx b/QandA/frontend/src/Header.tsx
index 80e2934..7f88f95 100644
--- a/QandA/frontend/src/Header.tsx
+++ b/QandA/frontend/src/Header.tsx
@@ -1,13 +1,23 @@
 import React from 'react';
 import { UserIcon } from './Icons';
 
-export const Header = () => (
-  <div>
-    <a href="./">Q & A</a>
-    <input type="text" placeholder="Search ..." />
-    <a href="./signin">
-      <UserIcon />
-      <span>Sign In</span>
-    </a>
-  </div>
-);
+export const Header = () => {
+  const handleSearchInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    console.log(e.currentTarget.value);
+  };
+
+  return (
+    <div>
+      <a href="./">Q & A</a>
+      <input
+        type="text"
+        placeholder="Search ..."
+        onChange={handleSearchInputChange}
+      />
+      <a href="./signin">
+        <UserIcon />
+        <span>Sign In</span>
+      </a>
+    </div>
+  );
+};