본문 바로가기

FE/React & RN36

Atomic Design (아토믹 패턴) container component 5단계 > 3단계로 간소화 atoms modules templats https://www.youtube.com/watch?v=33yj-Q5v8mQ 2021. 11. 10.
[Mobx] 상태 관리 1. Observable State - 관찰 받고 있는 상태 2. Computed Value - 예를 들어 value 값에 *2를 해서 가져오라고 할때만 value 값을 참조한다. 만약 변경되어 있지 않다면 그대로 내보낸다. 계속 value 값이 1,2,3,4,5, 변한다고 해도 실제로 필요할때만 참조 한다. 3. actions - observable 상태를 변경 할때 접근하는 것이다. 4. reactions - 변경될때 마다 응답하는 함수 https://doc.ebichu.cc/mobx/refguide/computed-decorator.html 2021. 8. 2.
[React] flex vs flexgrow https://stackoverflow.com/questions/35395691/understanding-the-difference-between-the-flex-and-flex-grow-properties Understanding the difference between the flex and flex-grow properties What is the difference in effect between setting flex: 1; and setting flex-grow: 1;? When I set the former in my code, the two columns I have display with equal width, while they do not do so when ... stackoverf.. 2021. 7. 8.
[super props] TypeScript https://min9nim.github.io/2018/12/super-props/ export default class FilterForm extends React.PureComponent{ constructor(props){ super() console.log("props1",props) console.log("props",this.props) } static defaultProps = { } state : FilterState = { } componentDidUpdate(prevProps: FilterProps) { console.log("pre",prevProps); } onPressTouch = () =>{ // console.log(this.state.stateMessage); console... 2021. 7. 7.