Poll Widget
Problem statement
A Poll Widget lets users vote on a question and immediately see live results as a bar chart. You see this pattern on Twitter, Slack polls, Reddit, and embedded in news articles. Your task is to build a self-contained poll component in React that presents voting options before submission, and transitions to a results view showing percentage bars and vote counts after the user submits.
The question tests two distinct UX states that require careful state design — the voting state (options to click) and the results state (data to display) — and the derived calculations needed for the results view: percentage per option, total vote count, and identifying the winner. Getting the transition between these two states clean and the math correct is the core of this question.
Requirements & constraints
- Render a poll question with multiple clickable options
- User selects one option (radio-style — only one at a time)
- Submit button disabled until an option is selected
- After submission, show a results view with a bar for each option
- Each bar's width is proportional to that option's percentage of total votes
- Show vote count and percentage per option
- Highlight the user's selected option and the winning option
How to approach Poll Widget
The strategy an interviewer expects you to reach for.
Problem Understanding A poll widget has two completely distinct UX states separated by a single submit action. Before voting: interactive options, a submit button. After voting: a read-only results chart. This is a clean state machine with two modes, and the transition between them is the core event in the component's lifecycle.
The full solution is part of HelloFrontend Pro
The question above is free to read in full. Upgrade to unlock the interactive workspace and the senior-level walkthrough that go with it.
- Live React sandbox pre-wired for this component
- Time-boxed checkpoints that mirror a real 45-minute round
- Interviewer scoring criteria and a full reference implementation
Already a member? Log in to open the workspace.