161일차(2) - 개인 프로젝트, TypeScript

개인프로젝트

금일 진행 내역

• GlobalStyle 설정 (stlye reset 및 주 폰트 설정)
• 헤더 범위 및 로고 제작

개인프로젝트를 본격적으로 시작했다.
아직 전체적인 틀과 기능들을 생각하는 중이여서 오늘은 헤더 틀을 잡고 로고를 만들었다.

개인적으로 공부할때 사용하기 위해서 시작은 전체적으로 눈이 편한 색으로 갈생각이다.
그리고 추가적으로 나중에 테마를 바꿀 수 있게 만들 것이다.

온라인 타이머는 광고가 붙어 있거나, 디지털 타이머로만 되어있어서 내가보기 편한 타이머를 만드는 것이 주 목적이다.

아직은 시작 단계이지만, 차근차근 만들어 볼 계획이다.

TypeScript를 다 배우고 프로젝트를 진행하려면 너무 늦게 시작할 것 같아서 우선 JavaScript로 프로젝트를 작성하고 TypeScript로 리팩토링할 계획이다.

TypeScript

기업에서 TypeScript을 원하는 곳들이 많아서 TypeScript를 공부중이다.
캡틴판교 - TypeScript 이 강의를 듣는 중이다.

GlobalStyle

style-reset으로 스타일을 초기화하고 주 폰트를 정하였다.

import { createGlobalStyle } from 'styled-components';
import reset from 'styled-reset';

const GlobalStyles = createGlobalStyle`
  ${reset}
  @import url('https://fonts.googleapis.com/css2?family=Do+Hyeon&family=Yeon+Sung&display=swap');
  * {
    box-sizing: border-box;
  };

  body {
    font-family: 'Do Hyeon', sans-serif;
    font-size: 20px;
    background-color: rgb(240, 240, 240);
  };
`;

export default GlobalStyles;