grid-lights-problem

Grid Lights is a famous problem which has been asked in Machine Coding round of Frontend Interviews.

Problem Statement

Build a grid of light cells where you can click on cells to activate them, turning them red. When all the cells are activated, all the cells will be deactivated one by one in the same order they were activated with an interval in between them.

Additionally, I have added another step to this where the grid cells are rendered based on user input (0s and 1s)

Implementation Steps

1. Get user input for the grid row size.
2. Prepare the grid component's input data, based on the user's input.
3. Render the grid cells based on the input data.
4. Add logic for activating cells when clicked.
5. Once all the cells are activated, deactivate them one by one using setInterval.

Live Demo

Click here to view the demo.