From 5a74eaf8851a1417752a36542cb2b86e83658800 Mon Sep 17 00:00:00 2001
From: harinsd404 <lohyen09@gmail.com>
Date: Thu, 31 Jul 2025 12:04:14 +0900
Subject: [PATCH 1/6] =?UTF-8?q?feat:=20=ED=83=80=EC=9D=B4=EB=A8=B8=20?=
 =?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EA=B8=B0=EB=B3=B8=20UI?=
 =?UTF-8?q?=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.jsx                      | 9 ++++-----
 src/components/TimerControls.jsx | 8 ++++++++
 src/components/TimerDisplay.jsx  | 8 ++++++++
 3 files changed, 20 insertions(+), 5 deletions(-)
 create mode 100644 src/components/TimerControls.jsx
 create mode 100644 src/components/TimerDisplay.jsx

diff --git a/src/App.jsx b/src/App.jsx
index 5d62758..a08c748 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -1,15 +1,14 @@
 import { useState } from "react";
-import reactLogo from "./assets/react.svg";
-import viteLogo from "/vite.svg";
 import "./App.css";
+import TimerDisplay from './components/TimerDisplay';
+import TimerControls from './components/TimerControls';
 
 function App() {
-  const [count, setCount] = useState(0);
-  const name = "류승찬";
 
   return (
     <>
-      화이팅
+      <TimerDisplay />
+      <TimerControls />
     </>
   );
 }
diff --git a/src/components/TimerControls.jsx b/src/components/TimerControls.jsx
new file mode 100644
index 0000000..bc69c62
--- /dev/null
+++ b/src/components/TimerControls.jsx
@@ -0,0 +1,8 @@
+export default function TimerControls(){
+    return(
+        <>
+            <button>시작하기</button>
+            <button>공부 📓</button>
+        </>
+    )
+}
\ No newline at end of file
diff --git a/src/components/TimerDisplay.jsx b/src/components/TimerDisplay.jsx
new file mode 100644
index 0000000..2627277
--- /dev/null
+++ b/src/components/TimerDisplay.jsx
@@ -0,0 +1,8 @@
+export default function TimerDisplay(){
+    return (
+        <>
+            <h1>🍅뽀모도로 타이머🍅</h1>
+            <h2>00 : 00</h2>
+        </>
+    );
+}
\ No newline at end of file

From fca3b674c45792db769b76d73add00945bc412c3 Mon Sep 17 00:00:00 2001
From: harinsd404 <lohyen09@gmail.com>
Date: Thu, 31 Jul 2025 13:24:22 +0900
Subject: [PATCH 2/6] =?UTF-8?q?feat:=20=ED=83=80=EC=9D=B4=EB=A8=B8=20?=
 =?UTF-8?q?=EC=8B=9C=EA=B0=84=20=EC=9E=AC=EB=8A=94=20=EA=B8=B0=EB=8A=A5=20?=
 =?UTF-8?q?=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.jsx                     | 14 +++++++++++---
 src/components/TimerDisplay.jsx | 12 ++++++++++--
 2 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/src/App.jsx b/src/App.jsx
index a08c748..ca51621 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -1,14 +1,22 @@
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import "./App.css";
 import TimerDisplay from './components/TimerDisplay';
 import TimerControls from './components/TimerControls';
 
 function App() {
+  const [time, setTime] = useState(1500);
+  useEffect(()=>{
+      const interval = setInterval(()=>{
+        setTime(time=>time-1);
+      }, 1000);
+      if(time===0){
+        setTime(300);
+      }
+  }, [time]);
 
   return (
     <>
-      <TimerDisplay />
-      <TimerControls />
+      <TimerDisplay time={time} />
     </>
   );
 }
diff --git a/src/components/TimerDisplay.jsx b/src/components/TimerDisplay.jsx
index 2627277..00ba685 100644
--- a/src/components/TimerDisplay.jsx
+++ b/src/components/TimerDisplay.jsx
@@ -1,8 +1,16 @@
-export default function TimerDisplay(){
+import {useRef, useEffect} from "react";
+
+export default function TimerDisplay({time}){
+    const timeRef = useRef(null);
+    useEffect(()=>{
+        const timeText = `${String(Math.floor(time / 60)).padStart(2, '0')} : ${String(Math.floor(time%60)).padStart(2, '0')}`;
+        if(timeRef.current)
+            timeRef.current.textContent = timeText;
+    }, [time]);
     return (
         <>
             <h1>🍅뽀모도로 타이머🍅</h1>
-            <h2>00 : 00</h2>
+            <h2 ref={timeRef}>00 : 00</h2>
         </>
     );
 }
\ No newline at end of file

From 5216ccf8126445d0fb5c1ef66a8681218d82ed9a Mon Sep 17 00:00:00 2001
From: harinsd404 <lohyen09@gmail.com>
Date: Thu, 31 Jul 2025 13:26:38 +0900
Subject: [PATCH 3/6] =?UTF-8?q?fix:=20=ED=83=80=EC=9D=B4=EB=A8=B8=20?=
 =?UTF-8?q?=EC=B8=A1=EC=A0=95=EC=9D=B4=20=EC=A0=9C=EB=8C=80=EB=A1=9C=201?=
 =?UTF-8?q?=EC=B4=88=20=EA=B0=84=EA=B2=A9=EC=9D=B4=20=EB=90=98=EB=8F=84?=
 =?UTF-8?q?=EB=A1=9D=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.jsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/App.jsx b/src/App.jsx
index ca51621..63c7bfa 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -12,6 +12,7 @@ function App() {
       if(time===0){
         setTime(300);
       }
+      return () => clearInterval(interval);
   }, [time]);
 
   return (

From 5cedcd6c7b10567247b1b6eb37b2a180801f87ff Mon Sep 17 00:00:00 2001
From: harinsd404 <lohyen09@gmail.com>
Date: Thu, 31 Jul 2025 15:43:05 +0900
Subject: [PATCH 4/6] =?UTF-8?q?=EA=B3=B5=EB=B6=80=20=EB=AA=A8=EB=93=9C,=20?=
 =?UTF-8?q?=ED=9C=B4=EC=8B=9D=20=EB=AA=A8=EB=93=9C=20=EC=83=9D=EC=84=B1=20?=
 =?UTF-8?q?=EB=B0=8F=20=ED=83=80=EC=9D=B4=EB=A8=B8=20=EC=8B=9C=EC=9E=91,?=
 =?UTF-8?q?=20=EB=A9=88=EC=B6=94=EA=B8=B0=20=EA=B8=B0=EB=8A=A5=20=EA=B5=AC?=
 =?UTF-8?q?=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.jsx                      | 22 +++++++++++++++++++---
 src/components/TimerControls.jsx |  6 +++---
 2 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/src/App.jsx b/src/App.jsx
index 63c7bfa..5d09575 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -4,22 +4,38 @@ import TimerDisplay from './components/TimerDisplay';
 import TimerControls from './components/TimerControls';
 
 function App() {
+  const [start, setStart] = useState(false);
   const [time, setTime] = useState(1500);
+  const [mods, setMods] = useState(true);
+
+  
   useEffect(()=>{
+    if(start){
       const interval = setInterval(()=>{
         setTime(time=>time-1);
       }, 1000);
       if(time===0){
-        setTime(300);
+        setMods(!mods);
+        mods?setTime(1500):setTime(300);
       }
       return () => clearInterval(interval);
-  }, [time]);
+    }
+  }, [start, mods]);
+  
+
+  const timerOn = ()=>{
+    setStart(!start);
+  }
+  const changeMods = ()=>{
+    setMods(!mods);
+  }
 
   return (
     <>
       <TimerDisplay time={time} />
+      <TimerControls mods={mods} start={start} timerOn={timerOn} changeMods={changeMods} />
     </>
   );
 }
 
-export default App;
+export default App;
\ No newline at end of file
diff --git a/src/components/TimerControls.jsx b/src/components/TimerControls.jsx
index bc69c62..9d0a6a3 100644
--- a/src/components/TimerControls.jsx
+++ b/src/components/TimerControls.jsx
@@ -1,8 +1,8 @@
-export default function TimerControls(){
+export default function TimerControls({mods, start, timerOn, changeMods}){
     return(
         <>
-            <button>시작하기</button>
-            <button>공부 📓</button>
+            <button onClick={timerOn}>{start?'멈추기':'시작하기'}</button>
+            <button onClick={changeMods}>{mods?'공부 📓':'휴식 🎈'}</button>
         </>
     )
 }
\ No newline at end of file

From 61db3c7b7a41ac6eab4b8013721b6ea1163abb3a Mon Sep 17 00:00:00 2001
From: harinsd404 <lohyen09@gmail.com>
Date: Thu, 31 Jul 2025 15:51:05 +0900
Subject: [PATCH 5/6] =?UTF-8?q?fix:=20=EB=AA=A8=EB=93=9C=20=EB=B3=80?=
 =?UTF-8?q?=EA=B2=BD=20=EC=8B=9C=20=ED=83=80=EC=9D=B4=EB=A8=B8=20=EC=8B=9C?=
 =?UTF-8?q?=EA=B0=84=EC=9D=B4=20=EC=A0=9C=EB=8C=80=EB=A1=9C=20=EC=A0=81?=
 =?UTF-8?q?=EC=9A=A9=EB=90=98=EC=A7=80=20=EC=95=8A=EB=8A=94=20=EB=B6=80?=
 =?UTF-8?q?=EB=B6=84=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.jsx                      | 2 ++
 src/components/TimerControls.jsx | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/App.jsx b/src/App.jsx
index 5d09575..7dc94d1 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -27,7 +27,9 @@ function App() {
     setStart(!start);
   }
   const changeMods = ()=>{
+    setStart(false);
     setMods(!mods);
+    mods?setTime(1500):setTime(300);
   }
 
   return (
diff --git a/src/components/TimerControls.jsx b/src/components/TimerControls.jsx
index 9d0a6a3..494375b 100644
--- a/src/components/TimerControls.jsx
+++ b/src/components/TimerControls.jsx
@@ -1,7 +1,7 @@
 export default function TimerControls({mods, start, timerOn, changeMods}){
     return(
         <>
-            <button onClick={timerOn}>{start?'멈추기':'시작하기'}</button>
+            <button onClick={timerOn}>{start?'끝내기':'시작하기'}</button>
             <button onClick={changeMods}>{mods?'공부 📓':'휴식 🎈'}</button>
         </>
     )

From 14161371454ec16c2001e0a15d1b20e520881bb8 Mon Sep 17 00:00:00 2001
From: harinsd404 <lohyen09@gmail.com>
Date: Thu, 31 Jul 2025 19:53:06 +0900
Subject: [PATCH 6/6] =?UTF-8?q?refactor:=20mod=20=EB=B3=80=ED=99=98=20?=
 =?UTF-8?q?=EC=8B=9C=20=EC=8B=9C=EA=B0=84=20=EC=84=A4=EC=A0=95=EC=9D=B4=20?=
 =?UTF-8?q?=EB=A8=BC=EC=A0=80=20=EB=90=98=EB=8F=84=EB=A1=9D=20=EC=BD=94?=
 =?UTF-8?q?=EB=93=9C=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/App.jsx b/src/App.jsx
index 7dc94d1..c32b438 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -28,8 +28,8 @@ function App() {
   }
   const changeMods = ()=>{
     setStart(false);
+    mods ? setTime(300) : setTime(1500);
     setMods(!mods);
-    mods?setTime(1500):setTime(300);
   }
 
   return (