3-6y

State Modeling and Data Flow

Keep state as close as possible to where it is used, but high enough for every component that needs the same truth.

Analogy

Keep a notebook on the desk that needs it. Move it to the class cupboard only if many students truly share it.

Follow-up questions

Topic practice prompts

How do you decide whether state should be local, lifted, or global?

Keep it local by default, lift it when multiple siblings need the same truth, and go wider only when many distant consumers truly need it.

  • When is context a bad choice?
  • How do you separate server state from UI state?
Cheat sheet

Last-day revision lines

  • State needs ownership.
  • Avoid duplicate truth.
  • Context distributes data but can widen render scope.
  • Model around workflows, not only components.
Source references
  • React questions PDF: context/100-React-interview-questions.pdf
  • JS and React patterns: context/JS and React Patterns and Solid principles.docx
Offline study support

Local resource packs for this topic

2 local packs

Use these local packs when you want broader official-source context without leaving the app.

reactOfficial React mental models

React Core Mental Models

A local digest of the React ideas that most often decide whether your answer sounds modern or outdated.

React.js

Rendering, state updates, re-renders, and explaining React without vague virtual-DOM-only answers.

Open local study pack
reactOfficial React effects and state flow

React Effects and Data Flow

A local study pack for useEffect, shared state, and the difference between side effects and derived data.

React.jsFrontend System Design

Modern React interview rounds that test whether you overuse effects or design state carefully.

Open local study pack
Next step

Related topics to study after this one

React.js3-6y

Hooks, Especially useEffect

Explain hooks clearly and use useEffect only for real side effects.

Simple mode, interview mode, example, pitfalls, and follow-ups are all inside this topic.

hooksuseEffectcleanupstale-closures
Study topic
Frontend System Design3-6y

Frontend System Design: Search and Dashboard Thinking

Structure answers around data flow, rendering boundaries, caching, resilience, and UX quality.

Simple mode, interview mode, example, pitfalls, and follow-ups are all inside this topic.

system-designsearchdashboardarchitecture
Study topic