Skip to main content
riwork

Engineering

Frontend Engineer mock interview

Builds the parts of web applications that users see and interact with, turning designs into fast, accessible, reliable interfaces. Day to day they write components, manage application state, work closely with designers and fix browser issues. Interviewers usually probe how you actually do these things, so expect follow-up questions.

Ava, the AI interviewer, will ask you questions on javascript & typescript, component architecture & state, web performance and accessibility and 4 more skills, follow up on what you say, and finish with a report that quotes your own words back to you.

Start a frontend engineer practice interview

Skills assessed in a frontend engineer interview

  • JavaScript & TypeScript

    Role skill

    Explains async behaviour, closures and types accurately, and uses TypeScript to catch real bugs rather than just to satisfy a compiler.

  • Component architecture & state

    Role skill

    Describes small reusable components, clear data flow, deliberate choices about where state lives, and avoiding unnecessary global state.

  • Web performance

    Role skill

    Measures with real tools such as browser profilers and Core Web Vitals including Interaction to Next Paint, and names concrete fixes like code splitting, image optimisation and reducing re-renders.

  • Accessibility

    Role skill

    Mentions semantic HTML, keyboard navigation, labels, focus management, colour contrast and testing with a screen reader, as habits rather than afterthoughts.

  • CSS & responsive layout

    Role skill

    Uses flexbox and grid confidently, designs mobile first, handles cross-browser quirks, and keeps styles maintainable.

  • Frontend testing

    Role skill

    Tests user-visible behaviour, mocks network calls sensibly, and balances component tests with a few end to end tests.

  • Collaboration with design & product

    Behavioural

    Raises feasibility concerns early, proposes alternatives instead of just saying no, and keeps designers involved through implementation.

  • User focus

    Behavioural

    Talks about real user pain, notices rough edges unprompted, and uses feedback or data to guide improvements.

Sample frontend engineer interview questions

8 of the 13 questions Ava can ask for this role, one or more per skill. In a real session she adapts them to your level and follows up on your answers.

  1. Q1CSS & responsive layoutEntry level

    How would you build a layout that looks good on both a phone and a wide desktop screen? Talk me through your approach.

    A strong answer: Mobile first thinking, flexbox or grid, relative units, media or container queries, flexible images, and testing at several sizes.

  2. Q2JavaScript & TypeScriptEntry level

    Can you explain what happens when you await a promise in JavaScript, and how you handle errors from it?

    A strong answer: Pausing the async function without blocking the page, the event loop at a basic level, try and catch for errors, and showing a sensible error state.

  3. Q3AccessibilityEntry level

    What are some simple things you do to make sure a form can be used by someone on a screen reader or only a keyboard?

    A strong answer: Proper labels, native form elements, logical tab order, visible focus, clear error messages announced to assistive tech, and testing with keyboard and screen reader.

  4. Q4Component architecture & stateMid level

    How do you decide where a piece of state should live in a React or similar app, and when do you reach for a global store?

    A strong answer: Keeping state as local as possible, lifting it only when shared, separating server data from interface state, and using a store or context only when justified.

  5. Q5Web performanceMid level

    A product page feels slow to load on mobile. How would you find out why, and what would you try first?

    A strong answer: Measuring with browser tools and real user metrics, looking at bundle size, images, render-blocking resources and slow requests, and prioritising fixes by impact.

  6. Q6Frontend testingMid level

    How do you test a component that fetches data and shows loading and error states?

    A strong answer: Mocking the network layer, testing what the user sees rather than internals, covering loading, success, empty and error states, and avoiding flaky timing.

  7. Q7Collaboration with design & productAny level

    Tell me about a time a design you were given was hard to build or didn't work well in practice. How did you handle it with the designer?

    A strong answer: Raising the issue early with evidence, proposing alternatives, respecting design intent, and reaching a shared decision.

  8. Q8User focusAny level

    Tell me about a time you noticed something frustrating for users that nobody had asked you to fix. What did you do?

    A strong answer: Specific user pain, evidence such as feedback or analytics, taking initiative appropriately, and checking the fix actually helped.

What a strong frontend engineer answer looks like

  • JavaScript & TypeScript

    Explains async behaviour, closures and types accurately, and uses TypeScript to catch real bugs rather than just to satisfy a compiler.

  • Component architecture & state

    Describes small reusable components, clear data flow, deliberate choices about where state lives, and avoiding unnecessary global state.

  • Collaboration with design & product

    Raises feasibility concerns early, proposes alternatives instead of just saying no, and keeps designers involved through implementation.

How the practice works

  1. Step 1

    Choose your level

    Pick intern through lead. The frontend engineer question bank is labelled for 3 entry-level, 5 mid-level and 3 senior questions (plus 2 for any level), and Ava leans toward the ones that fit.

  2. Step 2

    Answer out loud or by typing

    Ava asks 4 or 7 main questions, depending on the length you choose, such as the cSS & responsive layout question above. You can also add a short coding exercise. Typing is always available if you can't speak.

  3. Step 3

    Get feedback you can act on

    Each skill is scored against the evidence you gave, with the specific points from your answers. In practice mode you also get a check against the situation, task, action and result structure, a stronger version of each answer built only from what you said, and what to practise next.

Try the frontend engineer interview

Frequently asked questions

Which skills does the Frontend Engineer mock interview cover?
JavaScript & TypeScript, Component architecture & state, Web performance, Accessibility, CSS & responsive layout, Frontend testing, Collaboration with design & product and User focus. The first 6 are role skills; collaboration with design & product and user focus are the behavioural part.
What kind of questions will I get?
Questions come from a bank of 13 written for this role. An entry-level one is “How would you build a layout that looks good on both a phone and a wide desktop screen? Talk me through your approach.” and a senior one is “If you were setting up a shared component library used by several product teams, how would you design it to stay consistent but flexible?”.
How will my web performance answer be judged?
Against what strong evidence looks like for that skill: measures with real tools such as browser profilers and Core Web Vitals including Interaction to Next Paint, and names concrete fixes like code splitting, image optimisation and reducing re-renders. Anything you don't mention is not credited, and nothing is invented for you.
Is this useful for FE engineer or JavaScript developer roles?
Yes. FE engineer, JavaScript developer, React developer and UI developer are treated as close to frontend engineer, so the same skills and questions apply. You can also type any other role on the setup screen.
Is it free, and do I need an account?
Starting practice is free, and a free account is required before the interview begins. The feedback is guidance for your preparation, not a prediction of any hiring decision.

Practise related roles