Stepper component in React | Frontend machine coding question

JavaScript Interview Question - 56 | In this video, we will see how to solve a medium-difficulty problem asked in a frontend engineer interview to SDE1, SDE2, and SDE3.

Implement a stepper component in Reactjs with multiple-steps that are auto-generated based on the input list and provide an option to the component to navigate the steps at will. Make it extensible and reusable.

You can expect this frontend coding question in Rippling, Uber, Flipkart, Atlassian, Meta, Google, Microsoft, Dropbox, and other product-based organizations' interviews.

Loved the question? I have 120+ solved problems in my ebook "JavaScript Interview Guide". If you are preparing for Interviews and looking for a solutions book, Get my Ebook.

Social links

[rishabhkunwar]

How can we handle state in it, should we create it in App component and pass it to step form component and pas the state to multistepper component oe should we use context for it what would be better aprroach ?

[AnimeGainss]

Can we move the next and prev button to the stepper only ? Will it be better instead of using it in each component and one more thing why this is requirement to keep it in the particular component does it useful in which way ? Can you share an example ?

[omnikingomniking]

We can also use map instead of for loop right..?

[sumanthprabhu]

Can we use Context api instead of React.clone element?

[deepakheerakari]

hey prashanth
instead of giving buttons in each component, what if we give the prev and next buttons in the Section itself and update the currentStep ?

[vikrantnegi]

Was asked the same question in CRED's FE interview xD