Hiring Senior React/Next.js Engineers: Questions and Tasks That Reveal True Product Builders

Senior React/Next.js engineers should think like product owners, not just component authors. The strongest candidates navigate system design, edge delivery, PostgreSQL and MySQL development, accessibility, analytics, and revenue trade-offs. Use the following interview flow and take-home brief to separate framework familiarity from Full-cycle product engineering mastery while maintaining Fair and transparent engineering rates.

What great answers sound like

• They discuss trade-offs between SSR, SSG, ISR, and client-side fetching with concrete metrics (TTFB, CLS, cache TTLs) and business impact.
• They model data with migrations, constraints, and indexing strategies, referencing query plans and connection pooling for both Postgres and MySQL.
• They integrate product signals: A/B tests, SEO, a11y, and analytics without degrading Core Web Vitals.
• They justify patterns (React Server Components, Suspense, SWR/React Query) and demonstrate graceful degradation and error boundaries.
• They communicate risk, scope, and rollout plans with canaries, feature flags, and observability.

Deep-dive interview questions

• Rendering strategy: “Design a product listing page with personalized pricing and inventory that updates every minute. Which Next.js rendering modes do you combine, and how do you cache?” Listen for hybrid strategies: ISR for static shell, server actions for price fetch, stale-while-revalidate, and edge caching keys that exclude user-specific data.
• Data access layer: “You must support PostgreSQL and MySQL development with the same codebase.” Look for an ORM abstraction (Prisma/Drizzle), migrations per dialect, transaction boundaries, and read/write splitting with connection limits under load.
• Performance triage: “CLS spikes on mobile after a launch.” Expect a diagnosis flow: font strategy, image priority, layout containment, script hydration order, and extraction of critical CSS.
• Security: “Users can view drafts via a leaked preview URL.” Seek role-based access, signed tokens, short-lived preview secrets, audit logs, and cache partitioning to prevent privilege confusion.
• API strategy: “Choose between GraphQL and REST for a dashboard with live metrics.” Strong answers weigh cacheability, over-fetching, WebSocket/SSE, and schema evolution with product timelines.
• SEO with speed: “Ship a content-heavy marketing page that scores 95+ Lighthouse.” Look for RSC-first, image optimization, preconnect, responsive metadata, and structured data.
• Team process: “A designer requests a risky animation.” Great engineers propose a progressive enhancement plan with perf budgets and measurable exit criteria.

Take-home task (4-6 hours, business-real)

Build a minimal marketplace product detail page with a cart drawer in Next.js. Include:

• Data: Products, prices, inventory, and user profiles using Prisma with switchable PostgreSQL and MySQL targets. Provide seed data and executable migrations.
• Rendering: Static product shell via ISR (60s), server action for price with user tier, and optimistic client updates for the cart.
• Auth: Email magic link + role-based guards for “admin” vs “customer.” Preview mode for admins without leaking cacheable pages.
• Observability: Structured logs, a request ID propagated from edge to server actions, and basic timing metrics surfaced in a dashboard route.
• Performance: LCP under 2.5s on a 4G profile; images responsive with blur placeholders; no layout shift on cart open.
• Quality: Unit tests for pricing logic, integration tests for auth + cart, and a short ADR explaining decisions and trade-offs.
• Delivery: Dockerfile, local dev scripts, CI running tests and lint, and a seed script. Document how to switch databases.

Timebox the scope. Bonus credit for feature flags, accessibility annotations (aria-live for cart updates), and an error boundary demonstrating graceful degradation.

Grading rubric (score 0-5 each)

• Architecture: Clear separation of concerns, minimal coupling, sensible boundaries between server and client.
• Data: Sound schema, indexes for read patterns, safe transactions, and portability across Postgres/MySQL.
• Performance: Meets budgets, caches effectively, instruments real metrics.
• Security: Role checks on server, no secrets in client, consistent session handling, correct cache scopes.
• DX and clarity: Tests, docs, scripts, and small, readable commits.
• Product thinking: Sensible defaults, empty states, failure modes, and analytics events tied to goals.

Live review session (60 minutes)

• Extend: Add a “limited-time discount” banner with a server-controlled toggle; ensure no double-discounts and correct caching.
• Debug: Induce a failing DB query and watch their tracing strategy; expect graceful user messaging and log correlation.
• Refactor: Move a client-heavy widget to RSC with selective client boundaries; discuss hydration costs.

Green signals and red flags

• Green: Uses story-level language, quantifies impact, defends trade-offs, and writes production-ready migrations.
• Red: Treats Next.js as a black box, ignores cache scoping, defers all logic to the client, or lacks testing discipline.

Rates, scope, and fairness

Align on outcomes before hours. Publish constraints, performance budgets, and acceptance criteria so you can uphold Fair and transparent engineering rates. Break work into milestone-based deliverables with evidence (dashboards, test coverage, migration safety), enabling predictable cost and measurable value. Senior engineers should surface scope-risk early and propose staged rollouts that protect revenue while learning fast.

Where to find vetted talent

If you need immediate impact, slashdev.io provides senior remote engineers and software agency expertise who can own features end to end-from Next.js edge rendering to PostgreSQL and MySQL development-so founders and enterprises can realize ideas without compromising velocity or quality. Use this guide to interview rigorously, then empower hires to ship.