Feat bull monitor detail component #621
Conversation
| } from "./styled"; | ||
| import Link from "next/link"; | ||
| import BasicButton from "../BasicButton"; | ||
|
|
||
| export default function NavigationDropdown(): JSX.Element { | ||
| const [isAccordionOpen, setIsAccordionOpen] = useState([true, true, true]); |
There was a problem hiding this comment.
여러 어코디언을 관리할 때, state 를 하나 쓰는건 좋은데용,
객체로 관리하는게 어떨까요? 코드를 읽는 사람이, 각각의 인덱스가 어떤 어코디언을 참조하는지 머리속으로 생각해야되기 때문에,
나중에 다른 사람이 실수할 가능성이 있습니다. + 그리고 타입 정의가 안 되기 때문에 객체를 추천드려요
| <Icon | ||
| component={CachedIcon} | ||
| style={{ fontSize: "36px", cursor: "pointer" }} | ||
| onMouseEnter={(e: React.MouseEvent<SVGSVGElement, MouseEvent>) => { |
There was a problem hiding this comment.
다만, css로 처리할 수 있는 작업들은 css로 처리하는 게 좋습니다.
css로 스타일링 하는 것이 js로 dom 객체 선택 후 속성 변경 및 리랜더링 하는 속도보다 훨씬 빠르거든요.
그리고, react 류에서는 가상 돔을 사용하기 때문에, 어쩔 수 없는 경우가 아닌 이상 웬만해서는,
속성 변경시, useRef 를 통해, 해당 가상 돔에서 변경하는 것을 추천드려요 (추후에, 브라우저 돔이랑 가상돔이랑 매칭이 안 맞아서 성능 이슈 또는 에러가 발생할 수가 있습니다)
| <Button text="Aggregator" /> | ||
| <Button text="Fetcher" /> | ||
| <Button text="Setting" /> | ||
| <Link href={`/bullmonitor/vrf`}> |
There was a problem hiding this comment.
이런 링크들 (/bullmonitor/~)이 위에서 부터 많은 것 같은데,
나중에 endpoint 가 바뀌면 작업이 꽤나 귀찮습니다.
다른 페이지로 (예. endpoints.ts) 로 빼서 (객체로) 관리하는 것이 어떨까요?
| @@ -130,12 +130,7 @@ | |||
| resolve "^1.14.2" | |||
There was a problem hiding this comment.
참고로)
PR올라올 때, yarn.lock만 올라오는 경우는 (package.json 은 그대로) 보통
dev 용으로만 패키지 깔거나, 패키지 업데이트 또는 재설치 등의 이유입니다.
yarn.lock 이랑 package.json 이 안 맞으면, 나중에 빌드할 때나, 초기 설치할 때 고통 받을 수 있습니다!
No description provided.