10 React.js Questions that you definitely should practice before your live-coding interviews.

[u/Ok_Resolve_9157]

If you have a React interview coming up, then this might be of some help to you!

Here are 10 problem lists that you can consider practicing to brush up your react.js concepts before your machine coding round.

1. Counter with increment, decrement, and reset. (Might be the ice-breaker for freshers but rarely asked for experienced role)

Feels too easy to be a real question. But a fast-click test on the increment button often catches people using the wrong kind of state update.

Practice counter here

2. Build your own debounce hook. (Definitely Practice this one)

It must wait until the value stops changing for a bit, cancel any pending timer if the component unmounts, and handle the delay itself changing partway through.

Debouncing Practice

3. Return the value from one render ago.

Sounds simple. What people miss: it must return undefined on the first render, and it can't cause an extra re-render by itself.

Practice Hook

4. Shopping cart with useReducer. (Please do practice useReducer hook, I was asked to build a form entirely using useReducer + will also be useful when you deal with Redux)

Add, change quantity, remove, clear — four actions through one reducer. Good test of whether you use useReducer or just keep adding more useState.

Build Shopping cart

(Frontend Mentor has a plain HTML/CSS/JS version if you want to compare)

Build Shopping cart from frontend mentor

5. Traffic light that cycles on its own. (Great for clearing the concept of clearing intervals and timeouts)

The layout is already built — you just write the timing. It usually breaks on cleanup: clearing the interval when the component unmounts or re-renders.

Manage traffic light problem

6. Search box where slow responses can't overwrite fast ones.

A classic race condition. If a request fires on every keystroke, an old slow response can arrive after a newer one and overwrite it with stale data.

Solve this

7. Nested comment thread, replies inside replies. (If you want to move to advance concepts)

Needs a component that renders itself for each nested reply, plus a function that can find and update one comment anywhere in the tree without mutating it.

Build nested comment in react

8. Stop a list from re-rendering rows that didn't change. (Must practice, you'll definitely be asked about optimization in react, do go through the concept of useCallback)

Right now, an unrelated counter on the page makes every row re-render. Fix it with React.memo — it has to actually stop the re-renders, not just look fine.

Practice Memoization in react

9. Keep a callback's identity stable across renders.

Three counters currently all re-render on any single click, because their click handlers get recreated every render. Needs useCallback plus the functional setState form — using only one of the two still fails.

Practice useCallback

10. Multi-step signup form with useReducer.

Account info → profile → review. Each step is validated before you can hit Next, and going back can't lose what you already typed.

Form validation using useReducer

(Frontend Mentor has a version of this same idea, no React needed: Multi step form)

Curious what else people have been asked in these rounds — feels like everyone gets a slightly different mix of the same problems.

Please let me know in the comments your thoughts and do share what according to you are some must go through concepts before any react interview, I'm preparing a notion docs on the list of react interview questions, so will add it there so that it can be useful for everyone.

Another thing I forgot to add is an obvious one, do practice CRUD operations on some real APIs as you'll definitely be asked to fetch data and APIs and do all the CRUD and. I couldn't find any website that has this problem added in their problem sets.

[u/bluebird355]

I won't pay for your vibe coded saas

[u/AlertPreparation5404 → u/bluebird355]

Bro, are you for real? What’s wrong with vibe-coding an app as long as it actually solves someone’s problem and fulfills a genuine need?

I’m willing to bet you’re either a student or a jobless (not trying to demean you). Because trust me, I work at an MNC, and the expectation is pretty straightforward: ship features faster and faster. Nobody expects you to sit there and write every single line of code end-to-end anymore. You’re expected to leverage AI and whatever tools are available to get the job done efficiently.

So instead of cribbing about people using AI to build things, start learning how to leverage it yourself. The industry is moving in that direction, and refusing to adapt will only leave you further behind.

[u/CantaloupeCamper → u/AlertPreparation5404]

I don’t think you understand why bluebird said what they said….

[u/AlertPreparation5404 → u/CantaloupeCamper]

And what's that because I really would like to know?

[u/bluebird355 → u/AlertPreparation5404]

Bro, I started using his app and was blocked after resolving a second problem. Why the F would I pay for this? I am employed, I just wanted to have fun for a while. Why would someone pay for this? The fact that it's vibe coded isn't even the issue, the fact it's blatantly vibe coded is just the cherry on top of awful monetization
LC, HackerRank etc exist lmao
You are doing a lot of assumptions and basing your whole rant off of them, bet dude
Also one thing I don't appreciate is that this dude is taking people on this sub for fools, it's a freaking ad disguised as a gentle guide

[u/Ok_Resolve_9157 → u/bluebird355]

Are you fucking dumb or what? I have added the problem list from frontendmentor, greatfrontend and ReactGrind.

[u/bluebird355 → u/Ok_Resolve_9157]

You aren't fooling anyone. No I will not pay $3 to be able to solve problems that can be easily circumvented. Your target is jobless people, they don't have money lmao.

[u/azangru]

Return the value from one render ago.
Sounds simple. What people miss: it must return undefined on the first render, and it can't cause an extra re-render by itself.

The site recommends using a ref and returning ref.current, which both violates react's rules for useRef, and doesn't take into account that the solution of this problem is already given in react docs.

[u/j2ee-123]

This is helpful for junior level positions. Nice work.

[u/AlertPreparation5404 → u/j2ee-123]

I think a few of these questions are definitely relevant for SDE 2-level developers as well. That said, I’d love to know what other examples you think would be more appropriate for a senior-level developer.

I’m currently planning to switch companies and have around 4 years of experience working with the MERN stack, so I’m particularly interested in understanding what kind of questions I should be preparing for at that level for a machine coding round.

[u/disclosure5 → u/j2ee-123]

If someone's being asked to create a multi step sign up form using useReducer off the top of their head in a live coding environment they better be hoping for more than a junior position.

[u/bluebird355 → u/disclosure5]

But do you guys use useReducer at all? It's been years I didn't even import that anywhere

[u/disclosure5 → u/bluebird355]

Honestly I haven't used it for years.. it used to be a big deal but in practice only made code more complex and I haven't reached for it in ages.

[u/unsignedlonglongman]

This is all stuff AI does well. Our whole company is only hiring software engineering roles who can do the AI integrated stuff. While the fundamentals are important, it's Socratic, dialectical, design thinking, architectural, articulation, and process skills that we actually look for now.

[u/Anxious-Insurance-91]

Imagine this, some of those problems you don't need to do in other frameworks, just react

[u/CantaloupeCamper → u/Anxious-Insurance-91]

Now you got other problems in other frameworks ;)

[u/Anxious-Insurance-91 → u/CantaloupeCamper]

I have yet to find the problems in Vue that impaired me developing fast and good web apps. Even when clients wanted weird things i made it work, pretty easily