[ Dev Log] 박지훈 / 2021-07-01

## 오늘은 어떻게 프로젝트에 기여했나요?
- 타이머 완성시키기
- timerpage.js(타이머)-> typescript로 리팩토링
- 타이머 폰트 적용 해보기 (typescript)

### styled-component 타입스크립트에 적용시키기
타입스크립트로 파일확장명을 변경할시
import 해온 styled-component 라이브러리 인식오류발생
```$ npm install @types/styled-components``` 모듈을 다운받아 해결
지난번에 만든 타이머에서 분,초 구현은 완성했고 "시"(hours) 부분을 완성
```js
if (hours > 0) {
if (minutes === 0 && seconds === 0) {
setHours(hours - 1);
setMinutes(59);
setSeconds(59);
}
}
```
1시간 이상의 시간을 받고 만약 1시 0분 0초 가될시에
1초뒤 hours에서 시간을 -1 하고 59분 59초가 되게 코드를 작성했다

### 타이머에 폰트 적용
src/fonts 에 ttf확장파일인 폰트 파일 추가 ,
styles/global.css파일에 아래 코드추가
```jsx
@font-face {
font-family: "digital"; // 사용자가 원하는대로 폰트 변수선언
src: url("../src/fonts/DS-DIGIB.TTF"); // 다운받은 폰트경로
}
```
모든 레이아웃을 담당하는 _app.js 파일에서 global.css import
```jsx
import '../styles/globals.css'
```
타이머 페이지로 가서
타이머 컴포넌트에서 font-family속성 추가

이후 typescript로 타이머페이지와 useLocalStorage(커스텀훅스) 리팩토링 진행을 하였는데
font관련 컴파일 에러 가 났다
**해결법**은
src 폴더안에 fonts.d.ts파일 생성후
```declare module '*.ttf'``` 코드추가
tsconfig.json 파일에서
```"include": [ ]```
include 속성 배열안에 "fonts" 추가

### 오늘의 프로젝트에서 힘든 점은 무엇인가요?

- 항목별로 적어주세요.
### js파일로 작성한 커스텀훅스파일을 타입스크립트로 리팩토링 진행,
'Object is possibly 'undefined'에러발생

### 내일은 프로젝트에 기여하기 위해 무엇을 해야 하나요?

- [x] 타입스크립트 스택 사용 관련 팀원들과 회의
- [x] 로그인, 회원가입 구현
- [ ] ui디자인 레퍼런스 리서치, 현재 목업 형태인 레이아웃 본격적으로 다듬기