Skip to main content

Technical Interview Questions

This is a question bank for technical interviews for senior web/React developer candidates at Aliz. It complements the Senior Web/React Developer — Recruiter Guide. Each question includes follow-up prompts to probe depth and interviewer guidance on what strong answers look like.

How to Use This Guide​

  • This is a pick-and-choose bank, not a script — adapt to each candidate and role focus.
  • 60-minute interview: 1–2 questions from 5 categories.
  • 90-minute interview: 1 question from 7–8 categories.
  • Follow-ups probe depth — skip them if the candidate is struggling with the initial question.
  • "What to listen for" describes strong-answer signals, not a rigid rubric.

Tips for AI-Resistant Interviewing​

Making questions AI-resistant
  • Ask "walk me through a specific time" instead of "explain concept X."
  • Use 3-level follow-up chains — AI-memorized answers break down under probing.
  • Ask for opinions and trade-offs, not definitions.
  • Ask candidates to find flaws in code or architecture.
  • Present trade-off questions with no single right answer.
  • Value "I don't know, but here's how I'd find out."
caution

This guide is for internal use by Aliz interviewers and hiring managers. It is hosted on a public site — do not include specific candidate evaluation scores, internal hiring thresholds, or proprietary assessment criteria here.

1. JavaScript Fundamentals​

Core language knowledge that every senior developer should demonstrate fluency in.

Event Loop & Asynchronous Execution​

Question: "Explain what happens, step by step, when the browser encounters a setTimeout(fn, 0) inside a Promise.then() callback. What's the execution order and why?"

Follow-ups:

  • "Where do queueMicrotask, MutationObserver, and requestAnimationFrame callbacks fit in this model?"
  • "Have you ever hit a real bug caused by microtask vs. macrotask ordering?"

What to listen for: Candidate distinguishes microtasks (Promise, queueMicrotask) from macrotasks (setTimeout, setInterval). Mentions the call stack draining before the microtask queue, and the microtask queue draining before the next macrotask. Bonus: mentions that requestAnimationFrame fires before the next paint, not in the task queue.

Closures & Scope​

Question: "Can you describe a real situation where a closure caused a bug — or where you used a closure intentionally to solve a problem?"

Follow-ups:

  • "How do closures interact with loops — what's the classic var in a for loop issue, and how do modern approaches avoid it?"
  • "How do closures affect garbage collection?"

What to listen for: Concrete personal example rather than a textbook definition. Understanding that closures capture variables by reference, not by value. Awareness of memory implications (closed-over variables aren't garbage collected while the closure exists).

Promises & async/await​

Question: "What happens if you forget to await an async function call inside a try/catch block? Where does the error go?"

Follow-ups:

  • "How would you handle multiple concurrent async operations where some are allowed to fail?"
  • "What's the practical difference between Promise.all, Promise.allSettled, and Promise.race?"

What to listen for: Understands that un-awaited promises produce unhandled rejections. Can discuss Promise.allSettled for partial-failure tolerance. Mentions AbortController for cancellation as a bonus.

ES Modules​

Question: "What's the difference between import/export (ESM) and require/module.exports (CJS)? Why does it still matter in 2025?"

Follow-ups:

  • "Have you ever dealt with a CJS/ESM interop problem in a real project? What happened?"
  • "What's tree-shaking and why does it depend on ESM?"

What to listen for: ESM is statically analyzable (enables tree-shaking); CJS is dynamic (evaluated at runtime). Awareness of the dual-package hazard. Practical experience with .mjs/.cjs or "type": "module" in package.json.

2. TypeScript​

Aliz projects are TypeScript-first (see TypeScript). These questions test whether candidates can leverage the type system beyond basics.

Structural Typing & Type Narrowing​

Question: "TypeScript uses structural typing. Can you explain what that means and give an example where it surprises developers coming from languages like Java or C#?"

Follow-ups:

  • "How would you narrow a union type inside a function body? What are the different techniques?"
  • "When would you use a branded/opaque type, and how would you implement one?"

What to listen for: Understands duck typing / structural compatibility. Can name multiple narrowing techniques (typeof, instanceof, in, discriminated unions, user-defined type guards). Branded types show advanced awareness.

Generics & Utility Types​

Question: "Walk me through how you'd type a generic useFetch hook that infers the response type from the URL or a schema."

Follow-ups:

  • "What's the difference between Partial<T>, Required<T>, and Pick<T, K>? When do you reach for each?"
  • "Have you ever written a custom utility type? What problem did it solve?"

What to listen for: Comfortable with generic constraints (extends). Can compose utility types. Doesn't just recite definitions — explains when and why to use them in practice.

satisfies, const Assertions & never​

Question: "What problem does the satisfies operator solve that a type annotation doesn't?"

Follow-ups:

  • "When would you use as const and what does it do to the inferred type?"
  • "Where does the never type show up in practice and why is it useful?"

What to listen for: satisfies validates a value against a type without widening the inferred type (preserves literal types). as const creates readonly tuple/object literal types. never appears in exhaustive switch checks (unreachable code detection) and conditional type filtering.

3. Web Platform & Browser APIs​

Senior developers need to understand the platform underneath the frameworks. See also Web learning resources.

Rendering Pipeline & Performance​

Question: "Describe the browser's critical rendering path — from receiving HTML bytes to painting pixels. Where are the performance bottlenecks?"

Follow-ups:

  • "What's the difference between a layout (reflow) and a repaint? What triggers each?"
  • "How do will-change, content-visibility, and CSS containment help?"

What to listen for: Mentions HTML parsing → DOM construction → CSSOM → render tree → layout → paint → compositing. Knows that layout is expensive and triggered by geometry changes. Awareness of compositor-friendly properties (transform, opacity).

CORS & Security​

Question: "A junior developer tells you their fetch call works in Postman but fails in the browser with a CORS error. Explain what's happening and how you'd fix it."

Follow-ups:

  • "What is a preflight request and when does the browser send one?"
  • "How does CORS interact with cookies and credentials?"

What to listen for: Understands CORS is a browser-enforced policy (not a server security mechanism per se). Can explain the Origin, Access-Control-Allow-Origin, and preflight (OPTIONS) flow. Knows credentials: 'include' requires explicit server headers. Doesn't suggest disabling CORS as a "fix."

Core Web Vitals​

Question: "What are the three Core Web Vitals and what does each measure? How would you diagnose a poor INP score?"

Follow-ups:

  • "What tools do you use to measure CWV in the field vs. in the lab?"
  • "Name a specific optimization you've made that improved one of these metrics."

What to listen for: LCP (Largest Contentful Paint — loading), INP (Interaction to Next Paint — responsiveness, replaced FID), CLS (Cumulative Layout Shift — visual stability). Can name real tools (Lighthouse, CrUX, PageSpeed Insights, web-vitals library). Practical experience improving a metric, not just theory.

4. React Deep Dive​

Aliz uses React 19.x (see React). These questions go beyond component basics into internals and performance.

React 19 Features​

Question: "What changes in React 19 affect how you write components day-to-day? Pick one or two features and explain what they replace."

Follow-ups:

  • "How does the React Compiler change your approach to memoization (useMemo, useCallback, React.memo)?"
  • "What are Actions and useActionState, and when would you use them over a manual onSubmit handler?"

What to listen for: Awareness of React Compiler (auto-memoization reduces manual useMemo/useCallback). Can discuss Actions, useActionState, useFormStatus, useOptimistic. Doesn't confuse React 19 stable features with experimental RSC-only features.

Hooks Patterns & Pitfalls​

Question: "What are the rules of hooks, and what's the technical reason behind them — not just 'because the docs say so'?"

Follow-ups:

  • "Describe a custom hook you've written. What logic did it encapsulate?"
  • "What are the dangers of putting an object literal as a dependency in useEffect?"

What to listen for: Hooks rely on call order (linked list in the fiber). Understands referential identity issues with object/array dependencies. Can describe a real custom hook, not a contrived example. Mentions useRef for mutable values that shouldn't trigger re-renders.

Reconciliation & Performance​

Question: "A React app re-renders 50 components when only one piece of state changes. How would you diagnose and fix this?"

Follow-ups:

  • "What role does the key prop play in reconciliation — beyond list rendering?"
  • "When is useDeferredValue the right tool, and how does it differ from debouncing?"

What to listen for: Systematic approach: React DevTools Profiler → identify unnecessary re-renders → colocate state closer to where it's used, or extract shared state into a Zustand slice → selectors to limit subscriptions. Understands keys help React match elements across renders (not just lists). useDeferredValue yields to urgent updates — different from debouncing, which delays the trigger itself.

5. State Management & Data Fetching​

Aliz uses Zustand for client state and TanStack Query for server state.

Client State vs. Server State​

Question: "How do you decide whether a piece of data belongs in Zustand vs. TanStack Query? Give an example of each."

Follow-ups:

  • "What happens when you put server data in a client store and forget to sync it?"
  • "How does TanStack Query's staleTime vs. gcTime distinction affect UX?"

What to listen for: Clear mental model — server state is async, cached, shared, and has a source of truth on the server; client state is synchronous, local, and owned by the client (UI state, form state, preferences). Understands stale-while-revalidate. Knows staleTime controls when data is considered fresh; gcTime (formerly cacheTime) controls when inactive data is garbage collected.

Advanced Zustand Patterns​

Question: "How would you structure a Zustand store for a complex multi-step form with validation, undo, and persistence across page refreshes?"

Follow-ups:

  • "How do Zustand selectors prevent unnecessary re-renders?"
  • "Have you used Zustand middleware (persist, devtools, immer)?"

What to listen for: Sliced store pattern (not one giant object). Selectors with shallow equality. Mentions persist middleware for localStorage. Can describe the slice pattern or combine middleware for composing stores.

Cache Invalidation & Optimistic Updates​

Question: "Walk me through how you'd implement an optimistic 'like' button using TanStack Query — what happens if the server request fails?"

Follow-ups:

  • "How do you decide between invalidating a query vs. updating the cache directly after a mutation?"
  • "What's queryClient.setQueryData and when is it appropriate?"

What to listen for: useMutation with onMutate (optimistic update) → onError (rollback from saved context) → onSettled (invalidate to sync). Understands the trade-off: direct cache update avoids a refetch but can drift from server; invalidation is simpler but causes a loading flash.

6. Build Tools, Testing & DevOps​

Aliz's build and test toolchain is documented in the Testing Strategy and tech stack pages for Vite, Vitest, and Playwright.

Vite Internals​

Question: "Why is Vite's dev server faster than webpack's? What architectural decision makes that possible?"

Follow-ups:

  • "What's the difference between Vite's dev mode and its production build?"
  • "Have you ever had to write or configure a Vite plugin? What did it do?"

What to listen for: Vite serves source files as native ES modules (no bundling in dev); uses esbuild for fast dependency pre-bundling. Knows production uses Rollup for optimized output. Plugin experience is a bonus.

Testing Strategy​

Question: "For a new feature — let's say a checkout flow — how would you decide what to test with Vitest vs. Playwright?"

Follow-ups:

  • "What makes a flaky E2E test and how do you fix it?"
  • "How do you handle test data and authentication state in Playwright tests?"

What to listen for: Clear testing pyramid thinking: Vitest for unit/component tests (fast, isolated, many); Playwright for critical user flows (slower, fewer, high-confidence). Flaky tests: avoid arbitrary sleeps, use Playwright's auto-wait, use stable locators (getByRole, data-testid). Auth: storageState for reusing login state.

CI/CD Awareness​

Question: "Describe a CI pipeline you've set up or maintained for a frontend project. What stages did it have and what did each catch?"

Follow-ups:

  • "How would you keep CI build times under 5 minutes as the project grows?"
  • "What's the role of preview deployments in your workflow?"

What to listen for: Mentions lint → type-check → unit tests → build → E2E tests as common stages. Understands caching strategies (node_modules, build cache). Awareness of preview deployments (Vercel, Netlify) for PR review. Not just "I pushed to main and it deployed" — demonstrates understanding of the pipeline's purpose.

7. CSS & Styling​

Aliz recommends Tailwind CSS for styling.

Tailwind CSS in Practice​

Question: "What's the mental shift when moving from traditional CSS (or CSS modules) to Tailwind? What are the real trade-offs?"

Follow-ups:

  • "How do you handle responsive design in Tailwind — walk me through the breakpoint system?"
  • "Tailwind v4 switched to a new engine. What changed and why does it matter?"

What to listen for: Understands utility-first philosophy — composition over abstraction. Can articulate trade-offs honestly (verbose HTML vs. colocation, learning curve, design-system enforcement). Knows Tailwind uses mobile-first breakpoints (sm:, md:, lg:). Tailwind v4 awareness (CSS-first config, @theme directive) is a strong signal.

Layout & Responsive Design​

Question: "When would you choose CSS Grid over Flexbox? Can you describe a layout that's awkward to build with one but natural with the other?"

Follow-ups:

  • "How do container queries differ from media queries, and when would you use one over the other?"
  • "What's the clamp() function and how does it help with fluid typography?"

What to listen for: Grid = 2D layout (rows + columns simultaneously); Flexbox = 1D (row or column). Container queries scope styles to parent width (component-level responsive) vs. media queries (viewport-level). clamp(min, preferred, max) for fluid sizing without breakpoints.

8. Architecture & Rendering Strategies​

Understanding rendering trade-offs is critical for senior developers. See Rendering for Aliz's full breakdown.

SSR, SSG, CSR & Islands​

Question: "A client asks you to build a marketing site with a product catalog and a user dashboard. How would you choose a rendering strategy — would you use the same approach for both parts?"

Follow-ups:

  • "What is the islands architecture and when does it outperform a full SPA?"
  • "What's the hydration cost in SSR, and how do frameworks try to reduce it?"

What to listen for: Hybrid approach: SSG or Islands for marketing/catalog (performance, SEO), CSR/SSR for dashboard (interactivity, auth). Understands hydration (making server-rendered HTML interactive). Mentions selective/partial hydration, streaming SSR, or React Server Components as mitigation strategies.

Astro Architecture​

Question: "How does Astro achieve near-zero JavaScript on the client? What trade-offs does that create?"

Follow-ups:

  • "What are the different hydration directives in Astro (client:load, client:idle, client:visible) and when would you use each?"
  • "How would you share state between two interactive React islands in Astro?"

What to listen for: Astro renders to static HTML at build time; components only ship JS when explicitly opted in with client:* directives. Trade-off: inter-island communication requires explicit patterns (nanostores, events, shared Zustand store) since there's no shared React tree. See Astro.

9. Scenario-Based & Problem-Solving​

These open-ended questions have no single correct answer. They test architectural thinking, trade-off analysis, and communication under ambiguity.

note

These questions are intentionally underspecified — like real client requests. Strong candidates will ask clarifying questions before jumping to a solution.

The Slow App​

Question: "The client comes to you and says 'the app is slow.' That's all the information you have. What do you do?"

Follow-ups:

  • "OK, you found that the Lighthouse performance score is 54. Where do you look next?"
  • "What's the most common cause of LCP regressions you've seen?"

What to listen for: Starts by asking clarifying questions ("Slow how? Loading? Interaction? Which page? Which device?"). Then a systematic approach: measure first (Lighthouse, DevTools, field data), identify bottleneck category (network, rendering, JS execution), prioritize by impact. Doesn't jump straight to "optimize the JavaScript" without understanding the problem.

Legacy Migration​

Question: "You inherit a 3-year-old Create React App project with no TypeScript, minimal tests, and a weekly production bug. The client wants to add major new features. What's your approach?"

Follow-ups:

  • "How do you make the case for migration time to a non-technical stakeholder?"
  • "Would you migrate incrementally or rewrite? What factors influence that decision?"

What to listen for: Pragmatism: stabilize first (add tests on critical paths, fix the production bugs), then migrate incrementally (CRA → Vite, JS → TS file by file). Doesn't suggest a big-bang rewrite without acknowledging risk. Can describe the strangler fig pattern. Communication skills in describing the approach to a non-technical audience.

Client Requirement Ambiguity​

Question: "A client says 'we need real-time updates on the dashboard.' How do you figure out what they actually need and what you'd recommend?"

Follow-ups:

  • "What's the difference between polling, SSE, and WebSockets, and when would you pick each?"
  • "How does 'real-time' interact with TanStack Query's refetch model?"

What to listen for: Starts by asking clarifying questions: how real is "real-time"? (Every second? Every 30 seconds? On change?) How many concurrent users? What data volume? Then maps to the right solution: polling for low-frequency, SSE for server-push one-way, WebSocket for bidirectional. Understands TanStack Query's refetchInterval can solve many "real-time" needs without WebSockets.

The Large PR​

Question: "A developer on your team submits a PR with 2,000 lines of changes, no tests, and the code works. What do you do?"

Follow-ups:

  • "How do you give this feedback without demoralizing the developer?"
  • "What's your approach to code review in general?"

What to listen for: Mentoring approach rather than gatekeeping. Suggests splitting the PR, adding tests for critical paths, pairing on it. Communication style shows empathy and constructiveness. Doesn't just reject the PR.

10. Soft Skills & AI Literacy​

Technical skills alone don't make a senior developer. These questions explore communication, estimation, and AI tool usage. See also AI-Assisted Development and Estimation.

Communication & Stakeholder Management​

Question: "Tell me about a time you had to push back on a technical request from a client or PM. How did you handle it?"

Follow-ups:

  • "How do you communicate a delay or technical blocker without eroding trust?"
  • "What's your approach to writing technical decisions for a non-technical audience?"

What to listen for: Specific example with context, action, and result. Shows empathy for the other side's priorities. Doesn't frame it as "winning an argument" but as finding the right path together. Communication style in the answer itself is a signal.

Estimation & Planning​

Question: "How do you estimate the effort for a feature you've never built before?"

Follow-ups:

  • "How do you communicate uncertainty in an estimate?"
  • "What's your experience with breaking down epics into deliverable slices?"

What to listen for: Mentions techniques: analogous estimation, spike/timeboxed research, t-shirt sizing, range estimates (best/expected/worst). Acknowledges uncertainty explicitly rather than giving false precision. Can describe slicing work vertically (thin end-to-end slices) vs. horizontal layers.

AI Tool Usage & Judgment​

Question: "How do you use AI coding tools (Copilot, Cursor, Claude) in your daily workflow? Where do they help most, and where do you not trust them?"

Follow-ups:

  • "Have you ever shipped a bug that originated from AI-generated code? What happened?"
  • "How do you review AI-generated code differently from human-written code?"

What to listen for: Specific, honest answer — not "I use AI for everything" or "I never use it." Understands that AI is a productivity multiplier, not a replacement for understanding. Mentions areas of distrust: complex business logic, security-sensitive code, nuanced architectural decisions. Describes a review process. A candidate who has caught an AI bug and learned from it is a strong signal.

Selecting Questions for Your Interview​

Interview lengthRecommended approach
30 min (screening)Use the Recruiter Guide screening questions instead
45 min1 question each from 3–4 categories
60 min (standard)1–2 questions from 5 categories, weighted toward the role's focus area
90 min (deep dive)1 question from 7–8 categories, with time for follow-ups
tip

Start with a scenario question (Section 9) as a warm-up — it gets the candidate talking naturally and reveals their thought process before you dive into specific technical questions.

For résumé screening criteria, role overview, and non-technical expectations, see the Senior Web/React Developer — Recruiter Guide.