readlight / readlight-landing Goto Github PK

저번 커밋에 포함되어 있는 내용인데 issue등록을 안해놨네요
-> 보니까 utils/Emoji.tsx같은데 보면 아직 type으로 되있는거 보면 모든 파일이 다 바뀐건 아닌거 같습니다

참고
https://velog.io/@velopert/create-typescript-react-component

-> 화살표 함수에서 interface로 props타입 강제하기
const A = ({props1, props2} : Props) => { ... }

장기적인 관점에서 봤을 때 로직을 제어하기 더 어렵게 만들 것 같음

참고
https://luckyyowu.tistory.com/401

참고
https://myeongjae.kim/blog/2019/03/04/default-props-react-ts

Props, Styled-components에 props을 넘겨줄 때 등 type선언자와 interface를 불규칙화게 사용하고 있음.
어떨 때 type을 사용하고, 어떨 때 interface를 사용하는지 알아본 후 일관되게 적용하도록 수정

1. 초기에 ScrollDirection(enum type)을 반환할 때 ScrollDirection.UP을 반환함. 아직까지 이 값을 사용하는 컴포넌트는 없을거라 당장의 문제는 없지만, undefined로 수정해야함
2. 사이트를 새로고침하거나 특정 동작시 scrollPosition값이 0으로 초기화됨(사이트에 새로 들어올 때만 초기화되어야되는데, 새로고침 시에도 초기화되는것으로 보임). 이로 인해 상단 네비게이션바가 흰색으로 불투명해져야 되는데 그렇지 못함

헤더 관련된 컴포넌트 목록

• ActiveHeader
• ActiveSubHeader
• DoubleLineHeader
• SingleLineHeader
• SmallHeader
• SubSingleLineHeader

불필요한 코드 리팩토링 및 네이밍 필요
-> 이에따른 상위 컴포넌트 수정도 필요함

• 애니메이션(특히 트랜스폼)을 사용하는 컴포넌트가 있고, 그렇지 않은 것이 있음. 이 둘을 하나의 Atom으로 놓을 것인지 회의 필요함

Atom컴포넌트 안에 다음과 같이 직접 고정적인 데이터를 저장하고 받아오는 props로 변경해서 사용함
const textData = [ '하루 한권, 인공지능이 당신의 독서 취향을 분석해 책을 추천해줍니다.', '리드라이트 큐레이터들이 최근의 이슈나 트렌드에 맞는 책들을 엄선해 제공합니다.', '독서 결정에 도움을 줄수 있도록 큐레이터가 책을 읽고 작성한 칼럼을 제공합니다.', ];

-> 상위 컴포넌트에서 받아올수 있도록 변경 필요

error message: JSX element type '...' does not have any construct or call signatures typescript
-> 아마 라이브러리와 타입스크립트간의 미묘한 불일치로 인해 그런듯
-> 임시로 ScrollTriggerWrapper를 any타입으로 만들어 해결