Skip to content

notes.md

Latest commit

 

History

History
78 lines (28 loc) · 932 Bytes

notes.md

File metadata and controls

78 lines (28 loc) · 932 Bytes

Thinking in react (Architecture)

  • Break the UI into a component hierarchy ===> Single responsibility
  • Build a static version: Less thinking much typing (coz no interactivity - more thinking)
  • Identify the minimal representation of UI state
  • Identify where your state should live
  • Add inverse data flow

React patterns

  • Reducer pattern
  • Context API

Method + Hooks

[ ] React.memo --> receives fn component && rerender based on prop change [ ] useCallback ---> give back a memoized fn based on deps. [ ] useMemo ----> call fn depending on deps. [ ] useReducer ----> Almost like redux in some way

Reducer pattern

[ ] useReducer [ ] React.memo [ ] useCallback

Context API

[ ] Reducer pattern

<ParentComponent>
    <ChildAComponent name={name}>
        <Component name={name} />
    </ChildAComponent>
</ParentComponent>>

Demo