[add] 뽀모도로 구현

[hansejun]

• 타이머 구현
• 집중 시간 / 짧은 휴식 / 긴휴식
• 4번 싸이클

[hansejun]

1. useInterval hook 생성

(상태,callback)을 받아 상태가 true라면 1초에 한번씩 callback을 실행하는 hook 생성

2. 뽀모도로 기본 기능 구현

공부시간 / 쉬는 시간을 받아 총 4사이클 실행. (공부시간 4번 쉬는 시간 3번) + (사이클을 고정으로 할 지는 아직 모르겠음.) 공부시간에는 "study" 상태로 변경. 쉬는시간에는 "rest" 상태로 변경 리셋 기능 추후 구현 예정 원형 애니메이션은 추후 구현 예정

[hansejun]

시간을 입력받아 (현재 시각 + 입력받은 시간)을 localStorage 저장하면 목표 시간을 알 수 있다. "목표 시간 - 현재 시간"을 한다면 뽀모도로 총시간을 계산할 수 있어. 브라우저 종료 혹은 페이지 이동을 하더라도 카운트 기능이 초기화되지 않을 듯하다. 하지만 문제점은 stop기능을 눌렀을 때이다. stop 기능을 사용한다고 하더라도 목표 시간은 고정되어 있고 현재 시간은 계속 진행이 된다. (이렇게 되었을 때 새로고침을 하거나 url 이동 후에 다시 렌더링하면 카운트다운이 진행되어있다.) 이 문제를 해결하기 위해서는 stop을 눌렀을 때 시간을 stop 시간을 저장하고, 다시 start를 클릭하였을 때 "목표시간 - 스탑시간"으로 계산하면 될거 같다.