TIL-20220719

회고

• 집중하자... 할게 많다.
• SICP JS 챕터별로 공부하자.
• DSNA 오늘도 안했다.
  • 네카라쿠배당토야 안갈꺼냐?
• 프로젝트 화면 레이아웃이나 design systems 만드는게 왜이렇게 빡세냐...
• 이럴려고 백수된거 아니니까 화이팅하자!

React (JS)

• Reacting to Input with State
  • Overview: React uses a declarative way to manipulate the UI. Instead of manipulating idividual pieces of the UI directly, you describe the different states that your component can be in, and switch between them in response to the user input. This is similar to how designers think about the UI.
  • You will learn
    • How declarative UI programming differs from imperratibe UI programming
    • How to enumerate the different visual states your component can be in
    • How to trigger the changes between the different visual states from code
  • How declarative UI compares to imperative
  • Thinking about UI declaratively
    • Step 1: Identify your component's different visual states
    • Step 2: Determine what triggers those state changes
    • Step 3: Represent the state in memory with useState
    • Step 4: Remove any non-essential state variable
    • Step 5: Connect the event handlers to set state
  • Recap
    • Declarative programming means describing the UI for each visual state rather than micromanaging the UI (imperative).
    • When developing a component:
      1. Identify all its visual states
      2. Determine the human and computer triggers for state changes.
      3. Model the state with useState
      4. Remove non-essential state to avoid bugs and paradoxes.
      5. Connect the event handlers to set state.