개발 진행 시 tslint를 기본적을 이용하는데 linting library의 경우

tslint:latest

tsint-react

tslint-react-hooks 이렇게 세개를 활용한다.

타입 명시

• ts를 활용하는 가장 근본적인 이유는 타입을 명시에 코드 가독성을 높이는 것이다.

모델 인터페이스 작성

모델 이용시 구조체의 대용으로 인터페이스로 선언해 자주 이용된다.

sub Object도한 반드시 별도로 interface를 명시해 이용한다.

// wrong
interface Model {
  items: Array<{ age: number, name: string }>;
  user: {
    id: string;
    name: string;
    info: {
      address: string;
      school?: string;
    };
  };
}

// good
interface Item {
  age: number;
  name: string;
}

interface UserInfo {
  address: string;
  school?: string;
}

interface User {
  id: string;
  name: string;
  info: UserInfo;
}

interface Model {
  items: Item[];
  user: User;
}

api서비스 구성

외부 데이터를 이용함에 있어 프론트엔드 기준, ajax 를 애용하게 된다. 이 때 API 라 불리우는 서비스 모듈을 만들어 사용하게 되는데 아래와 같은 규칙을 지키고 고려 하도록 한다.

1. 서비스를 이용하는 곳 (예: Action, Effect 등)에서 그 데이터의 출처를 굳이 알지 않아도 되도록 충분히 추상화 한다.즉 출처가 Backend Server, CDN Server, Static File 및 Browser Cache / Storage 여부는 사용처에서는 알 필요가 없으며 관여하지 않는다.