easyFrontend Developer interview question
In React, what is the difference between props and state?
What the interviewer wants to hear
- Props are passed from parent and are read-only in the child
- State is owned and updated by the component itself
- Changing state or receiving new props triggers a re-render
- Lift state up when several components need it
- Data flows one way, from parent to child
Model answer
Props are inputs a parent passes to a child component, like function arguments. The child must treat them as read-only. State is data a component owns and can change over time, usually with useState or useReducer. When state changes, or when a parent passes new props, React re-renders the component. Data in React flows one way, from parent to child. If two siblings need the same data, I lift the state up to their closest common parent and pass it down as props, along with a callback so the child can ask the parent to update it. A good rule is to keep state as small as possible and derive everything else during render.
Can you answer it under time pressure?
Take a timed easy round and get scored on every answer.
More easy Frontend Developer questions
- Explain the CSS box model. What is the difference between content-box and border-box?
- What is the difference between var, let and const in JavaScript?
- What is semantic HTML and why does it matter?
- How do you make a web page responsive for mobile, tablet and desktop?
- What is the difference between Flexbox and CSS Grid, and when would you use each?
- What is a closure in JavaScript? Give a practical example of where you use one.
- How do you make a form accessible?
- A button on a page does not work when clicked. How would you use browser DevTools to find the problem?
- What is a Promise, and how does async/await relate to it?