5 exercises — choose the best English answer for common full-stack interview questions covering client/server architecture, real-time features, SSR, security, and query optimization.
Answering full-stack interview questions
Show trade-off thinking: "It depends on the situation — on the client for UX, on the server for security"
Name specific tools: "I've used Prisma's include / DataLoader / React Query to solve this"
Use the STAR structure for "walk me through a feature you built" questions (Situation · Task · Action · Result)
Demonstrate security awareness: cookies, HTTPS, input validation, HttpOnly — flag these unprompted
0 / 13 completed
1 / 13
An interviewer asks: "How do you decide what logic goes on the client vs. the server?" Which answer best demonstrates full-stack thinking?
The best full-stack answer shows you understand the trade-off framework, not a blanket rule. Client-side: input validation for UX (instant feedback), UI state (dropdown open/closed, tab selection), optimistic updates (show result before server confirms), data transformations that only affect display. Server-side: all security checks and authorization (never trust client), business rules that involve shared/transactional data, anything requiring database access, operations with side effects (send email, charge card). Key phrase to use: "Critical validation always runs on both — client-side for UX, server-side for security." This shows you understand that client validation is easily bypassed. Related vocabulary: thin client, thick client, BFF (Backend for Frontend), server components (React/Next.js), hydration.
2 / 13
An interviewer says: "Walk me through a feature you built end-to-end." A candidate responds: "I built a real-time notification system. On the backend, I added a Node.js service that listens to database change events and publishes them to a message queue. On the frontend, I used _____ to push updates to the browser without polling." What is the correct technical term for the blank?
WebSockets provide a persistent, full-duplex communication channel between client and server over a single TCP connection. Unlike HTTP (request-response), WebSockets let the server push data to the client at any time — ideal for real-time features: notifications, live chat, collaborative editing, live dashboards. Alternative real-time approaches: Server-Sent Events (SSE) — server-to-client only, simpler, good for live feeds; long-polling — client holds an open HTTP request until the server has data — less efficient. WebSocket lifecycle: handshake (HTTP Upgrade), open connection, exchange frames, close. In interviews, show you know when to use each: WebSockets for bidirectional real-time (chat, gaming), SSE for one-directional streams (live stock prices, notifications), regular polling for infrequent updates.
3 / 13
The interviewer asks: "What is hydration in the context of server-side rendering?" Which answer is correct?
Hydration is how SSR (Server-Side Rendering) frameworks make pages interactive. The server sends fully-rendered HTML (fast first paint, SEO-friendly). Then the browser downloads the JavaScript bundle, React (or another framework) "hydrates" the HTML by attaching event listeners, initializing component state, and taking over rendering — making the page interactive. The HTML is static but looks complete; hydration makes it dynamic. Problems: hydration mismatch (server HTML doesn't match what React would render on the client — causes error or UI flash), hydration time (TTI = Time to Interactive is delayed if the JS bundle is large). Modern solutions: partial hydration (only hydrate interactive islands), streaming SSR (send HTML chunks as they're ready), React Server Components (components that never hydrate — stay server-only). Key vocabulary: SSR, SSG (Static Site Generation), ISR (Incremental Static Regeneration), CSR (Client-Side Rendering).
4 / 13
Complete the candidate's interview answer with the correct term: "To handle the authentication flow, the frontend gets a JWT from the login endpoint and stores it in an _____ cookie — that way JavaScript can't read it, which prevents XSS attacks from stealing the token."
An HttpOnly cookie is a cookie with the HttpOnly flag set — it is sent with HTTP requests but is not accessible to JavaScript (document.cookie cannot read it). This prevents XSS (Cross-Site Scripting) attacks from stealing authentication tokens: even if an attacker injects a script, it cannot read the cookie. The full secure cookie setup for auth tokens: HttpOnly (blocks JavaScript access), Secure (only sent over HTTPS), SameSite=Strict or SameSite=Lax (prevents CSRF by restricting cross-site sending). Compared to localStorage: localStorage is accessible to JavaScript (XSS vulnerable), but cookies with the flags above are not. Common interview question: "Where do you store JWTs?" — correct answer: HttpOnly cookies for browser clients (not localStorage and not sessionStorage for security-sensitive tokens).
5 / 13
An interviewer asks: "What is the N+1 query problem, and how do you fix it?" Which answer is most complete and accurate?
The N+1 query problem: you fetch a list of N items (1 query), then for each item, fetch its related data (N more queries) = N+1 total queries. Example with an ORM: posts = Post.all (1 query) → posts.map(p => p.author) triggers 1 query per post (N queries) = N+1. Solutions: (1) Eager loading (fetch posts AND authors in one JOIN) — e.g. Post.include(:author) in ActiveRecord, include: { author: true } in Prisma; (2) DataLoader (batches and caches per-request — Facebook's solution for GraphQL — collects all IDs, then does 1 query: WHERE id IN (...)); (3) SELECT with JOIN manually. How to detect: enable SQL query logging in development and look for repeated queries with different IDs. Key vocabulary: lazy loading (load on demand — causes N+1), eager loading (load upfront with JOIN — prevents N+1), DataLoader, query batching.
6 / 13
Sarah (Senior Backend Engineer) sends you this Slack message: 'Hey, the API endpoint /users/{userId} is timing out intermittently. We're seeing high latency during peak hours. Any ideas?' Which of the following actions should you prioritize first to investigate this issue?
This scenario focuses on immediate triage. Increasing server resources is often the quickest way to alleviate performance bottlenecks during peak load. While circuit breakers and log analysis are important long-term solutions, they require more investigation and setup time. Scaling instances without understanding *why* it's timing out could mask the root cause and lead to wasted resources.
7 / 13
Mark (Lead Frontend Developer) leaves this comment on your code review: 'This component is fetching data directly from the API. It's inefficient and could lead to excessive network requests. Consider using a caching strategy or a more optimized data retrieval pattern.' What architectural principle does Mark primarily highlight?
Mark is pointing to the Separation of Concerns principle – a component should have one specific responsibility. Directly fetching data and managing caching logic within a single component violates this separation. While the other principles are important, they aren't directly relevant to the immediate problem of inefficient data retrieval.
8 / 13
During a standup meeting, David says, 'I'm working on optimizing the database queries for the product search feature. I've identified several slow queries and am implementing indexing strategies to improve performance.' Which of the following best describes David's primary focus?
The correct answer focuses on David's communication. While detailing technical tasks is important, a good standup update should also highlight the *impact* of that work – in this case, improved performance. Options A and D are too vague; B correctly acknowledges the task but doesn't address its importance, and C provides the most comprehensive description of what a successful standup update should convey.
9 / 13
Lisa (Frontend Developer) sends this Slack message: 'The user feedback form isn't submitting correctly. Users are saying they get an error when clicking the submit button.' You should immediately:
This scenario tests troubleshooting skills. The Slack message indicates a front-end problem. The correct response prioritizes investigating the frontend code— specifically the submit handler and associated JavaScript—as that's where the error is originating. Options A and B misdiagnose the issue by focusing solely on the backend, while option D is an ineffective first step.
10 / 13
An interviewer asks: 'What is a GraphQL query and why might you use it over REST?' Which of the following best explains the core difference?
The key difference between GraphQL and REST lies in the client's ability to request precisely the data it requires. This contrasts with REST, where clients typically receive larger datasets even if they only need a subset of the information – leading to 'over-fetching.' Option A is misleading; B correctly describes this core benefit, while options C and D misrepresent the fundamental differences between the two approaches.
11 / 13
You're reviewing a PR for a new user profile page. The frontend team is using a third-party library to handle image resizing. Another developer comments: 'This library seems tightly coupled with our UI framework. It's adding significant overhead and makes future changes difficult.' Which of the following strategies would be MOST appropriate to address this concern?
The core issue is tight coupling. Option A directly addresses this by creating an abstraction layer. Options B and C exacerbate the problem, while option D removes responsibility from the developer. This demonstrates understanding that decoupling improves maintainability and flexibility.
12 / 13
Sarah (Senior Backend Engineer) sends you this Slack message: 'The API endpoint /products/{productId} is experiencing intermittent 500 errors when a large number of requests are made simultaneously. We're seeing increased CPU usage on the server.' Which of the following actions should you prioritize FIRST?
While scaling is a possible solution, it's premature without understanding the underlying problem. Investigating recent code changes first allows you to quickly rule out potential bugs or vulnerabilities. Monitoring logs provides immediate insights into the error patterns and helps pinpoint the root cause before implementing resource-intensive solutions.
13 / 13
To handle a complex user authentication flow involving multi-factor authentication (MFA), you'd likely store the user's MFA secrets in a secure key vault or secrets management system. This ensures that sensitive information is not directly exposed in the
.
Storing secrets directly in code or a database is extremely insecure. A key vault provides centralized management and access control for sensitive data, ensuring it's only accessible to authorized services with appropriate permissions. This protects against unauthorized access and potential breaches.
What does "Full-Stack Developer Interview Questions — IT English Exercise" cover?
Practice answering full-stack developer interview questions in English: client vs server logic, WebSockets, SSR hydration, HttpOnly cookies, and the N+1 query problem. 5 exercises with model answers.
How many questions are in this interview set?
This set has 13 exercises, each with a full explanation.
Is this exercise free to use?
Yes. Every exercise on CoderSlingo, including this one, is free to use with no account, sign-up, or paywall.
Do these exercises include model answers?
Yes. Each interview question gives you several possible responses and asks you to pick the one that communicates most clearly and completely — the explanation then breaks down exactly why that answer works, including the specific vocabulary a strong candidate would use.
What if I choose an answer that isn't the strongest one?
You'll see which option was correct and read a full explanation of why it's stronger than the alternatives, plus the key vocabulary and phrasing worth reusing in a real interview.
Can I retry the questions?
Yes — use the "Try again" button on the results screen to reset and go through the set again.
Is this the same as a real technical or behavioural interview?
No — it's focused practice for the language side of interviewing: recognising which phrasing sounds precise and confident versus vague, and knowing the vocabulary interviewers expect for this role. It won't replace mock interviews, but it builds the vocabulary you'll need in one.
Where can I find interview prep for other roles?
Browse the full Interview exercises hub for 170+ modules covering behavioural, technical, and system design rounds across dozens of IT roles, or check the "Next up" link below to continue.
Do I need an account, and is my progress saved?
No account is needed. Progress is tracked only for your current visit — reloading or leaving the page resets the counter.
Who writes these interview questions?
Every question is written by the CoderSlingo team based on real technical interview patterns for this role, then reviewed for accuracy and clarity.