Michael Pautov

Software Engineer

React interview

React is one of the most popular front-end web frameworks. It is used to build interactive and dynamic web components. React comes with many benefits. It uses virtual DOM, JSX, and it is comparatively easier to learn and use.

React interviews can be challenging. There are several concepts in React. Most React interviews have coding challenges. These coding challenges depend on the experience of the developer. For a beginner, the coding challenges are focused on the way the developer uses the state or writes the JSX. 

For a mid-level experienced React developer, the coding challenges are aimed to check the working experience of the individual. The developer is expected to understand the challenge in the minimum time possible and solve it in an organized way. In this article, we will list the top 3 React coding challenges for a mid-level experienced developer.

Create a Counter but with a twist

Creating a basic counter with a button that increments the displayed value by 1 is a simple task. But with some added conditions, the same task can become tough. 

Suppose, we have a component, which contains a state variable (declared using the useState React hook) that tracks the value for the counter. The value is also displayed in this component, but the button that increments the value is present in the child component of this component. 

First, the interviewer expects you to find the possible ways to solve this problem. It can be solved using one of the following ways.

The redux way is too complex for such a challenge. But mentioning the global state in front of the interviewer shows your awareness.

Using render props is the easier way but only an experienced developer will be aware of the “render props” technique. 

The function to update the “count” is passed as props to the child component and then, it is used there.  But, the third way is the best and it will impress the interviewer the most because it uses Context. 

Context is one of the best features of React and every experienced React developer is expected to know React Context. 

First, the context is created. 

import React from "react";

const</.......

Source: https://hackernoon.com/top-3-coding-challenges-for-mid-level-react-developers