Matchine Coding Question 1

aniketbaghelof25th

Aniket Baghel

Posted on July 30, 2024

Matchine Coding Question 1

TABS

Q1 Build a tabs component that displays one panel of content at a time depending on the active tab element. Some HTML is provided for you as example contents.

Requirements
Clicking on a tab makes it the active tab. Add a visual indication (e.g. using blue text color) for the active tab to differentiate it from the non-active tabs.
At all times, only one panel's contents should be displayed — the one corresponding to the active tab's.
Notes
The focus of this question is on functionality, not the styling. There's no need to write any custom CSS except for highlighting the active tab.
You may modify the markup (e.g. adding ids, data attributes, replacing some tags, etc) and use client-side rendering instead.
You may want to think about ways to improve the user experience of the application and implement them (you get bonus credit for doing that during interviews).

Image description

Image description

Image description

💖 💪 🙅 🚩
aniketbaghelof25th
Aniket Baghel

Posted on July 30, 2024

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Matchine Coding Question 1
reactjsdevelopment Matchine Coding Question 1

July 30, 2024