React (2) 썸네일형 리스트형 Component Pattern | Context API 를 활용하자. Prop Drilling 참고: https://kentcdodds.com/blog/prop-drilling 하나의 컴포넌트를 여러 컴포넌트로 쪼개고, 쪼갠 컴포넌트에서 또 쪼개는 것. 하나의 컴포넌트에서 전부 다뤄지던 state가 props로 전달 된다. 깊이가 깊어질 수록 prop을 전달하는 과정이 드릴로 뚫고 들어가는 것 같아서 Prop Drilling이라고 한다. Card → CardContent, CardBottom CardContent → Title, Description, Thumbnail CardBottom → LikeButton, HateButton 좋은 점 한 컴포넌트 안에서 코드가 매우 길어지면 수정이 어려워진다. global로 변수를 관리할 때처럼 하나의 컴포넌트 안에 여러 state.. 리액트 번들 사이즈 최적화 Bundle Size 최적화 참고: https://dev.to/mbernardeau/6-tips-to-optimize-bundle-size-50n9 default import 사용 default import와 member style import(global import) 했을 때 가져오는 파일 사이즈가 다르다. // member style imports(global import): import { Row, Grid as MyGrid } from 'react-bootstrap'; import { merge } from 'lodash'; // default style imports: import Row from 'react-bootstrap/lib/Row'; import MyGrid from 'react-b.. 이전 1 다음
