Prompt 1
Design a credit card application page and its confirmation page
In a conversational round with a whiteboard for notes, walk through the components, field validation, submit states and the confirmation page for a card application, from an empty screen to a confirmed result.
Practice version modelled on a reported round: Public report: Taro senior frontend engineer Power Day, 2024
What this measures
Component decomposition, form state and validation strategy, handling of sensitive data, and how you communicate a design without writing full code.
Clarify first
- Ask which fields and steps are required, whether the application can be saved and resumed, and what happens after submit: an instant decision, a pending review or an error.
- Confirm accessibility and device expectations, and whether the design covers only the page or also the follow-up messages.
Strong answer should cover
- Split the page into steps or sections with one owner for form state, and say where validation runs: on blur, before moving to the next step, and on the server.
- Keep sensitive fields out of logs, URLs and long-lived client storage, and mask them on the confirmation page.
- Design every submit state: idle, submitting, success, decline, review pending and failure, with a retry that cannot submit twice.
- Make it accessible: labels, an error summary tied to fields, focus moved to the first error, and keyboard support across steps.
Common miss: Drawing the happy path only, with no answer for a double submit, a failed request or a pending decision.
Work through the multi-step form with autosave case (Premium) Prompt 2
Structure a single-page application from requirements, then build it with the interviewer
Given a short list of requirements, plan the component tree, routes, data flow, state and API calls, then build the first screen together with the interviewer as a pair.
Practice version modelled on a reported round: Public report: Taro lead front-end software engineer Power Day, 2024
What this measures
Turning requirements into structure, choosing where state lives, and collaborating while you code.
Clarify first
- Ask which screens and data come first, and what the API returns.
- Agree on the framework and whether a state library is expected or optional.
Strong answer should cover
- Sketch the routes and the component tree first, then name the source of truth for each piece of data: server, URL or local state.
- Use a state library only for data many screens share, and say why the rest stays local.
- Build one vertical slice end to end, including loading and error states, before adding screens.
- Narrate trade-offs and invite the interviewer in, since one account describes this round as more pair programming than interview.
Common miss: Starting to code components before agreeing on routes and data, then rewriting halfway through.
Work through the component state from a mock case (Premium) Prompt 4
Power Day case: find the bug in budgeting code written by an intern
Agree on the requirements of a small budgeting feature, work one example calculation by hand, then read a short function, find the bug and explain the fix without running the code.
Practice version modelled on a reported round: Public report: Taro senior frontend engineer Power Day, 2024
What this measures
Reading unfamiliar code, reasoning with concrete numbers, and explaining a fix clearly under time pressure.
Clarify first
- Restate the business rule in your own words and agree on one worked example before reading the code.
- Ask which language the code is in, since accounts mention Java, C++, Node.js and Python.
Strong answer should cover
- Trace the function with your example values and write down each variable as it changes.
- Name the bug precisely: the line, the input that triggers it and the wrong output it produces.
- Propose the smallest fix, then one test case that would have caught it.
- Mention a second risk you notice, such as rounding or an empty input, without derailing the main fix.
Common miss: Rewriting the whole function instead of finding the one defect, or guessing without tracing an example.
Fix a defaults bug in a teammate helper (free) Prompt 5
Read, explain and refactor badly written code
Explain what a messy helper does, name its risks, and propose the smallest refactor that keeps its behaviour, then improve it step by step.
Practice version modelled on a reported round: Public report: Taro front end lead Power Day, 2022
What this measures
Code comprehension, risk spotting and safe refactoring, which the case round tests in the accounts.
Clarify first
- Ask what the function is supposed to do before judging how it does it.
- Confirm whether you may change its signature or only its body.
Strong answer should cover
- Summarize the behaviour in one sentence, including side effects such as mutating its input.
- List the risks in order: wrong results, hidden mutation, unreadable logic, performance.
- Refactor in small steps that keep behaviour, and say how you would test each step.
- Use clear names and extract small pure functions so the result reads like the requirement.
Common miss: Making the code shorter and cleverer instead of clearer, or changing behaviour without saying so.
Rewrite a helper that mutates its input (free)