[osod] 2023년 2월 1일 수요일

오늘 한 것

• 초기 세팅 (api, image, font, color, router 폴더 나눔)

• 헤더 찔끔

 

참고

• React + TypeScript 프로젝트 생성
  참고 : https://www.kenrhee.com/blog/getting-started-with-typescript-with-react

npx create-react-app [프로젝트명] --template typescript

• React.FC 사용 지양 (아래와 같은 형태로 작성 추천)
  참고 : https://react.vlpt.us/using-typescript/02-ts-react-basic.html

import React from 'react';

type GreetingsProps = {
  name: string;
  mark: string;
};

const Greetings = ({ name, mark }: GreetingsProps) => (
  <div>
    Hello, {name} {mark}
  </div>
);

Greetings.defaultProps = {
  mark: '!'
};

export default Greetings;

• svg 사용 (용량이 적으면서 출력이 빠르고, 수정과 애니메이션이 가능하며, 깨지지 않음)
  참고 : https://velog.io/@devstefancho/typescript-react-svg를-import-하는-방법
• styled-components 의존성 설치
  참고 : https://memostack.tistory.com/334

# with npm
npm install --save styled-components
# with yarn
yarn add styled-components

# with npm
npm i --save-dev @types/styled-components
# with yarn
yatn add --dev @types/styled-components

 

• https://juzero-space.tistory.com/266

 

---

 

타입스크립트로 하려니 괜찮은 듯 어렵다 ,,,