Skip to content

Frontend Developer interview questions

Frontend interviews check how well you know the browser platform (HTML, CSS and JavaScript) beyond any one framework, and whether you can build accessible, fast, responsive interfaces. Expect a live coding task that builds a small UI component.

12 questions with answer notes · 4 rounds · By the JOBSPOT 360 team

How the selection process usually works

  1. 1

    Online assessment

    JavaScript output-prediction MCQs plus one or two coding problems.

  2. 2

    JavaScript fundamentals

    Closures, the event loop, promises, this, prototypes, and implementing small utilities like debounce.

  3. 3

    Machine coding

    Build a component such as a search box, modal or infinite list in 60 to 90 minutes.

  4. 4

    Framework and HR

    React, Angular or Vue internals, state management, your projects, then HR.

Rounds vary between companies. Smaller teams often merge the technical and managerial rounds, while larger companies may add an extra technical round.

Skills to brush up on

  • Semantic HTML
  • CSS layout (Flexbox and Grid)
  • JavaScript (ES6+)
  • TypeScript
  • React, Angular or Vue
  • Responsive design
  • Web accessibility
  • Browser DevTools
  • REST APIs and fetch

Technical questions

  1. 01 What is a closure? Give a practical use.

    How to answer: A function that remembers variables from the scope where it was created. Used for data privacy, factory functions, and debounce or throttle helpers.
  2. 02 Explain the event loop, and the difference between the microtask and macrotask queues.

    How to answer: After each task, the engine drains all microtasks (promise callbacks) before the next macrotask (setTimeout, I/O). Be ready to predict the output order of a snippet.
  3. 03 What is the difference between == and ===, and between let, const and var?

    How to answer: === does not coerce types. var is function scoped and hoisted; let and const are block scoped with a temporal dead zone.
  4. 04 Implement a debounce function.

    How to answer: Return a function that clears a stored timer and sets a new setTimeout on each call, passing through the arguments and this.
  5. 05 How does CSS specificity work? What does box-sizing: border-box change?

    How to answer: Inline styles, then IDs, then classes, attributes and pseudo-classes, then elements. With border-box, padding and border are included in the declared width.
  6. 06 Flexbox or Grid: when would you use each?

    How to answer: Flexbox for one-dimensional alignment along a row or column; Grid for two-dimensional page or card layouts.
  7. 07 In React, why do lists need keys, and what triggers a re-render?

    How to answer: Keys let React match items between renders. A component re-renders when its state changes, its parent re-renders, or a context it uses changes.
  8. 08 How would you make a page accessible to keyboard and screen reader users?

    How to answer: Use semantic elements, labels for inputs, visible focus states, correct heading order and alt text, and only add ARIA when native HTML is not enough.
  9. 09 How do you improve a slow-loading page?

    How to answer: Measure first with Lighthouse or Core Web Vitals. Then compress and lazy-load images, split bundles, cache assets and avoid layout shifts.

Scenario questions

  1. 01 Build a search box that calls an API as the user types.

    How to answer: Debounce the input, cancel stale requests (AbortController), show loading and empty states, and handle errors.
  2. 02 A layout looks broken only on Safari or on small phones. How do you approach it?

    How to answer: Reproduce it with device emulation or a real device, check browser support for the CSS feature, then add fallbacks or adjust breakpoints.
  3. 03 How would you structure state in a medium-sized app with a cart, user and filters?

    How to answer: Keep state close to where it is used, lift it only when shared, use context or a store for global data, and keep server data in a fetching library cache.
Then comes the HR round Almost every interview ends with HR questions about you, your plans and your salary expectations. See the common ones and how to answer them.

Resume tips for this role

  • Link a live deployed project (Vercel, Netlify or GitHub Pages) as well as the source code.
  • Mention performance or accessibility wins with numbers, such as a Lighthouse score going from 60 to 95.
  • Name the frameworks and versions you have used in production, not every library you have tried once.
  • A clean, well-designed resume matters more for frontend roles. It is a small portfolio piece.

This guide is written by the JOBSPOT 360 team from common interview patterns for this kind of role. It is not provided by any employer, and real interviews will differ. Read our editorial policy.