Leetcode-style React problems

It's common for React interviews to have "Leetcode"-style interview questions. But what does that even mean?

Leetcode is a website for coding challenges. Traditionally, Leetcode-style questions refer to solving algorithm problems. But more broadly, they are simply focused problems that test a specific skill. You can even do Leetcode challenges for Javascript.

In the context of React, Leetcode-style challenges could be to build a small component, to add a feature to an existing app or create a custom hook. They should be very focused problems that you can build in a relatively short amount of time and that would allow you to showcase how you would build React features, how you evaluate tradeoffs etc.

Building components

Building standalone components are one of the most common Leetcode-style React interview questions - and that's because they are straightforward to build, but can showcase a wide array of skills:

• how you would define the component "API" - aka what props external consumers can pass
• managing state
• using React hooks, if needed
• styling the component

Some examples of components would be:

• Build a "Select" element with custom styling
• Build an autocomplete component - great opportunity to discuss debouncing
• Build an Typewriter-effect component - checks advanced useEffect knowledge and working with intervals in React

Building custom hooks

Building custom hooks are another common Leetcode-style React type of challenge.
They are great at checking your knowledge of hooks and working with browser APIs in the React world.

Some examples of custom hooks could be:

• Build a custom hook that allows saving items to the local storage
• Build a usePrevious hook that allows you to access state variables from the previous render
• Build a useFetch custom hook to fetch data from an API, that handles success, error and loading states behind the scenes

Add features to an existing app

Sometimes the challenge is to change an existing small application - this is useful because it resembles what you will most likely do in your day to day life on the job. It allows the interviewer to see how you go about understanding existing code and how you approach refactoring it.

Some example small features you could be asked to add:

• Add persistence to local storage for an existing app
• Add auto-save feature to an existing form (so that the user doesn't lose his work if he closes the browser window before he submitted the form)

Did you ever get a Leetcode-style question in your React interviews? What was it about? Share your experience in the comments below!