1107.md

2022. 11. 07

Vertical form을 추상화하는 작업

고차 컴포넌트 - after로 넣기

변하는 부분과, 변하지 않는 부분을 나눠서 변하는 부분을 props로 받기

=> 로그인과 회원가입 페이지 사이에 디자인 일관성을 지키기 위해서!

generic constaint와 deep partial type

// https://www.typescriptlang.org/docs/handbook/2/generics.html#generic-constraints

type DataT = {
  // 모든 데이터가 존재해야 함!
  email: string;
  password: string;
  adderss: {
    postalCode: string;
    main: string;
    sub: string;
  };
};
// { email: 'rabolution@gmail.com', password: '1234', address: { postalCode: '10905', main: '경기도 파주시 어쩌구', sub: '어디 몇 동 몇 호' } }

type PartialDataT = Partial<DataT>; // data의 일부가 안 채워져 있을 수 있지만, 일부의 일부는 안 됨!
// {
// email?: string | undefined;
// password?: string | undefined;
// }

// { email: 'rabolution@gmail.com', password: '1234', address: { postalCode: '10905', main: '경기도 파주시 어쩌구', sub: '어디 몇 동 몇 호' } }
// { email: 'rabolution@gmail.com', password: '1234' }
// { email: 'rabolution@gmail.com'}
// { password: '1234' }
// { }

type DeepPartialDataT = DeepPartial<DataT>; // data의 최소한 일부의 일부도 안 채워질 수 있는
// { address: { sub: '어디 몇 동 몇 호' } }