Use the STAR method: Situation, Task, Action, Result.
Q: Tell me about a time you disagreed with a senior developer or manager.
Focus on respect and data-driven arguments.
Basic Implementation: The "Data-Driven" Script
// 1. Acknowledge their point
"I see why you want to use [Option A], it's definitely faster to implement initially."
// 2. Present your concern with data/evidence
"However, I'm concerned about [Scalability/Performance]. I ran a quick benchmark, and [Option A] slows down by 50% when we hit 10k users."
// 3. Propose alternative & ask for input
"If we go with [Option B], it takes 2 days longer but handles the load. What do you think is the best trade-off for us right now?"
Real World Example: React vs jQuery
Situation: Senior dev wanted to use jQuery for a new interactive dashboard because they knew it well.
Action: I built a small prototype in React to demonstrate the component reusability and state management benefits.
Result: The senior dev saw how much cleaner the code was and agreed to switch, provided I helped set up the boilerplate.
Show Answer Strategy
Do: Explain that you had a technical concern (e.g., performance, security). Describe how you researched the alternative, built a small prototype or gathered data, and presented it respectfully. If they still said no, mention that you committed to the team's decision ("Disagree and Commit").
Don't: Say "They were wrong so I did it my way" or "I argued until I won."
Q: Describe a time you made a mistake that broke production.
Own it. Fix it. Prevent it.
Basic Implementation: The Incident Report (Post-Mortem)
Summary: Checkout button failed for 5% of users.
Root Cause: A CSS change overlapped the button on mobile devices.
Immediate Fix: Reverted the commit (SHA: abc1234) within 10 minutes.
Prevention: Added a visual regression test (Percy/Chromatic) to the CI pipeline to catch layout shifts automatically.
Real World Example: The "Missing Env Variable"
// The Mistake
I deployed a feature that relied on a new API key but forgot to add the key to the production environment variables.
// The Fix
Saw 500 errors in logs -> Identified missing key -> Added key -> Restarted pods.
// The Process Change
I updated our deployment checklist and added a script that validates required env vars on server startup, crashing early if one is missing.
Show Answer Strategy
Do: Admit the mistake immediately. Explain how you fixed it (rollback, hotfix). Most importantly, explain the process change you implemented to ensure it never happens again (e.g., added a test case, improved CI pipeline).
Don't: Blame QA or others.
Q: How do you handle a tight deadline when you know you can't deliver everything?
Communication > Heroics.
Basic Implementation: The "Scope Negotiation" Email
Subject: Risk Update for Project X
"Hi Team,
Based on current progress, we are at risk of missing the Friday deadline if we include all features.
Option A: Delay release by 3 days to include everything.
Option B: Release on Friday with Core Features (Login, Dashboard) but push 'Advanced Search' to next week.
I recommend Option B to get feedback early. Please let me know your preference."
Real World Example: MVP Definition
Context: Launching a new e-commerce site for Black Friday.
Problem: The 'Wishlist' feature was buggy and threatening the launch.
Action: I proposed hiding the Wishlist button for launch day so we could focus on ensuring Checkout was rock solid.
Result: Successful launch with zero downtime; Wishlist was added 2 weeks later.
Show Answer Strategy
Do: Communicate early. Prioritize features (MoSCoW method - Must have, Should have, Could have). Propose a scope cut (MVP) to meet the date with high quality, rather than shipping buggy code.
Don't: Say "I work weekends" (unsustainable) or hide the delay until the last day.
Q: Tell me about a time you had to learn a new technology quickly.
Adaptability.
Basic Implementation: The Learning Framework
// 1. Scan the Landscape
"I read the 'Getting Started' docs to understand the mental model."
// 2. Build a "Hello World" + 1
"I built a small ToDo app to test the core concepts (State, Props, API calls)."
// 3. Map to known concepts
"I related it to what I knew: 'Oh, Vue's computed properties are like React's useMemo'."
Real World Example: GraphQL Adoption
Task: We needed to switch from REST to GraphQL for a mobile app.
Action: I spent a weekend doing the Apollo tutorial. Then I pair-programmed with a backend dev to define the schema.
Result: I became the team's 'GraphQL point person' and wrote the internal guide for other devs.
Show Answer Strategy
Strategy: Describe the situation (e.g., "We needed to switch to GraphQL"). Explain your learning process (docs, tutorials, building a POC). Highlight the result: "I was able to ship the feature on time and taught the rest of the team."
Q: Tell me about a time you had to persuade a team to adopt your idea.
Influence without authority.
Basic Implementation: The RFC (Request for Comments) Structure
Title: Adopt TypeScript for New Modules
Problem: 30% of our recent bugs are "undefined is not a function" type errors.
Proposal: Use TS for all new files. No rewrite of old code yet.
Cost: Setup takes 4 hours. Learning curve ~1 week.
Benefit: Catch errors at compile time, better autocomplete.
Real World Example: CSS Modules
Situation: Global CSS class conflicts were breaking the UI.
Action: I demoed CSS Modules in a lunch-and-learn session, showing how it scopes styles automatically.
Result: Team agreed to try it on one component. It worked well, so we adopted it standard.
Show Answer Strategy
Strategy: Focus on data and benefits. "I noticed our build times were slow. I researched esbuild, created a benchmark comparison showing a 50% reduction, and presented it to the team. We adopted it and saved hours of dev time weekly."
Q: Tell me about a time you dealt with ambiguity.
Proactivity.
Show Answer Strategy
Strategy: "The requirements were vague. Instead of waiting, I set up a meeting with the stakeholders, created wireframes to visualize my understanding, and got sign-off on the specific behavior before writing code."
2. Team Collaboration
Q: How do you handle a code review where the code works, but is messy?
Constructive feedback.
Show Answer Strategy
Strategy: Be kind but firm on standards. Use "We" language ("Can we make this clearer?") instead of "You" ("You wrote this bad"). Suggest specific improvements. If it's a minor nitpick, approve it with a "non-blocking" comment.
Q: How do you mentor junior developers?
Guide, don't drive.
Show Answer Strategy
Strategy: Don't just give the answer. Ask guiding questions ("What happens if X is null?"). Pair program with them, but let them drive (type). Encourage them to read docs.
Q: How do you explain a complex technical concept to a non-technical stakeholder?
Analogies and Business Value.
Show Answer Strategy
Strategy: Avoid jargon (no "API", "Latency", "Refactor"). Use analogies (e.g., "Refactoring is like organizing the kitchen so we can cook faster next time"). Focus on the impact: "This will make the checkout page load 2 seconds faster, increasing sales."
3. Leadership & Growth
Q: What do you look for in a company culture?
Be honest, but align with their values.
Show Answer Strategy
Good Answers: Psychological safety (safe to fail), emphasis on learning/growth, collaborative environment, user-centric focus.
Q: How do you stay up to date with technology?
Curiosity.
Show Answer Strategy
Mention specific sources: Newsletters (Bytes, React Status), Twitter/X, building side projects, reading documentation, attending meetups.
Rapid Fire Soft Skills
Scenarios to ponder.
Show Topics
Handling a toxic team member.
Convincing management to pay down tech debt.
Onboarding new team members.
Giving negative feedback to a peer.
Receiving negative feedback.
Prioritizing tasks when everything is "Urgent".
Working with a difficult designer.
Working with a difficult Product Manager.
Remote work etiquette.
Leading a meeting effectively.
4. Situational & Conflict Resolution
Q: How do you handle a toxic team member?
Professionalism and boundaries.
Basic Implementation: The Escalation Ladder
// Level 1: Direct Feedback
"Hey, when you interrupted me in the standup, I felt dismissed. Can we let each other finish speaking?"
// Level 2: Documentation
Log dates and specific quotes of unprofessional behavior in a private doc.
// Level 3: Manager Intervention
"I'm finding it difficult to collaborate with [Name] due to [Specific Incidents]. It's impacting the project timeline. Here is the log."
Real World Example: The "Code Review Bully"
Situation: A peer left harsh comments like "This is garbage" on PRs.
Action: I replied publicly on the PR: "Let's keep comments focused on the code, not the person." Then I messaged them privately to ask for constructive feedback.
Result: They didn't stop, so I brought it to the lead. The lead established a "Code of Conduct" for reviews, which solved it.
Show Answer Strategy
Strategy: Don't engage in drama. Focus on work. If their behavior affects the project, document it objectively. Try to talk to them privately first ("When you said X, it made me feel Y"). If it continues, escalate to the manager with evidence.
Q: How do you convince management to pay down tech debt?
Speak their language (Money/Risk).
Basic Implementation: The "Business Case" Translation
// Don't say:
"We need to refactor the user module because the code is messy."
// Do say:
"The current user module adds 2 days of testing time to every release due to regression risks. Refactoring it will cost 1 week now but save us 2 days every sprint, breaking even in 2 months."
Real World Example: The "20% Rule"
Strategy: I negotiated with the PM to allocate 20% of every sprint (1 day a week) to "Engineering Health".
Action: We used this time to upgrade libraries and fix flaky tests.
Result: Velocity actually increased because we weren't fighting fires constantly.
Show Answer Strategy
Strategy: Don't say "The code is ugly." Say "This module is causing 20% of our bugs and slowing down new feature development by 3 days per sprint. Refactoring it will speed up future delivery."
Q: How do you handle receiving negative feedback?
Growth mindset.
Basic Implementation: The "Active Listening" Script
// 1. Listen & Absorb (Don't interrupt)
"Okay, I hear you saying that my PRs are too large and hard to review."
// 2. Clarify
"To make sure I understand: Is 200 lines the limit you'd prefer, or is it about the number of files touched?"
// 3. Commit to Action
"Thanks for telling me. For the next feature, I'll break it down into 3 smaller PRs. Can you check in with me next week to see if that's better?"
Real World Example: The "Slow Delivery" Feedback
Feedback: Manager said I was shipping slower than peers.
Reflection: I realized I was over-optimizing code before it even worked.
Change: I adopted a "Make it work, then make it right" approach. My velocity doubled, and code quality remained high enough.
Show Answer Strategy
Strategy: Listen without interrupting. Don't get defensive. Ask for specific examples to understand better. Thank them for the feedback. Take time to process it, then propose a plan to improve.
Q: What do you do if you're stuck on a problem?
Timeboxing.
Basic Implementation: The "15-Minute Rule"
// Minute 0-15:
Try to solve it alone. Google error messages. Read docs. Console log everything.
// Minute 16:
If still stuck, ask for help.
// The "Ask" Template:
"I'm trying to do [X].
I expected [Y] to happen, but [Z] happened instead.
I've tried [A] and [B].
Here is a link to the code/error."
Real World Example: Rubber Duck Debugging
Situation: Stuck on a complex Redux reducer logic bug.
Action: I started writing a Slack message to a senior dev explaining the bug.
Result: Halfway through typing the explanation, I realized I was mutating state directly. I deleted the draft and fixed the bug.
Show Answer Strategy
Strategy: "I try to solve it myself for X amount of time (e.g., 1 hour). I read docs, check StackOverflow, debug. If I'm still stuck, I reach out to a teammate with what I've tried so far, to respect their time."
Q: How do you prioritize tasks when everything is "Urgent"?
Impact vs Effort.
Basic Implementation: The Eisenhower Matrix (Code Edition)
1. Urgent & Important (Do First):
Production crash, Security vulnerability, Blocker for other devs.
2. Important, Not Urgent (Schedule):
Refactoring, Documentation, New Feature Dev.
3. Urgent, Not Important (Delegate/Minimize):
Attending meetings with no clear agenda, responding to non-critical emails.
4. Neither (Delete):
Polishing a feature that might get cut.
Real World Example: The "Fire Drill"
Situation: PM asked for a hotfix while I was in the middle of a complex migration.
Action: I asked: "If I switch to the hotfix, the migration will be delayed by 1 day. Is the hotfix critical for today?"
Result: PM realized the hotfix could wait until the next sprint.
Show Answer Strategy
Strategy: Ask the Product Manager or Lead to rank them. If I have to decide, I use the Eisenhower Matrix (Urgent/Important) or focus on what blocks other team members first.
Q: How do you handle a toxic team member?
Professionalism and boundaries.
Show Answer Strategy
Strategy: Don't engage in drama. Focus on work. If their behavior affects the project, document it objectively. Try to talk to them privately first ("When you said X, it made me feel Y"). If it continues, escalate to the manager with evidence.
Q: How do you convince management to pay down tech debt?
Speak their language (Money/Risk).
Show Answer Strategy
Strategy: Don't say "The code is ugly." Say "This module is causing 20% of our bugs and slowing down new feature development by 3 days per sprint. Refactoring it will speed up future delivery."
Q: How do you handle receiving negative feedback?
Growth mindset.
Show Answer Strategy
Strategy: Listen without interrupting. Don't get defensive. Ask for specific examples to understand better. Thank them for the feedback. Take time to process it, then propose a plan to improve.
Q: What do you do if you're stuck on a problem?
Timeboxing.
Show Answer Strategy
Strategy: "I try to solve it myself for X amount of time (e.g., 1 hour). I read docs, check StackOverflow, debug. If I'm still stuck, I reach out to a teammate with what I've tried so far, to respect their time."
Q: How do you prioritize tasks when everything is "Urgent"?
Impact vs Effort.
Show Answer Strategy
Strategy: Ask the Product Manager or Lead to rank them. If I have to decide, I use the Eisenhower Matrix (Urgent/Important) or focus on what blocks other team members first.
Q: Working with a difficult designer?
Feasibility vs Vision.
Show Answer Strategy
Strategy: If a design is technically very hard, explain the trade-off: "We can do this exact animation, but it will take 3 days. Or we can do this simpler version in 2 hours." Offer alternatives that achieve the same user goal.
Q: Working with a difficult Product Manager?
Scope creep.
Show Answer Strategy
Strategy: If they keep adding requirements, explain the impact on the deadline. "We can add X, but we'll have to drop Y to hit the release date." Make them choose the trade-off.
5. Remote Work & Career
Q: What are the challenges of remote work?
Communication and Isolation.
Basic Implementation: The "Over-Communication" Protocol
// 1. Status Updates
"Posting my daily standup in Slack even if we don't have a meeting."
// 2. Availability Signals
"Updating Slack status to 'In a meeting' or 'Deep Work' so people know when to expect a reply."
// 3. Documentation First
"Writing down decisions in Notion/Confluence instead of just saying them on a call."
Real World Example: The "Async" Shift
Problem: Team was spread across 3 time zones, causing meeting fatigue.
Action: I proposed moving the daily standup to a text-based Slack thread.
Result: Saved 30 mins/day per person and created a searchable history of blockers.
Show Answer Strategy
Strategy: Acknowledge the need for over-communication. "I make sure to document my progress and be responsive on Slack. I also schedule virtual coffee chats to build rapport with the team."
Q: Where do you see yourself in 5 years?
Ambition + Alignment.
Basic Implementation: The "T-Shaped" Growth Plan
// The "T" Shape
Horizontal Bar: Broad knowledge of the full stack (Backend, DevOps, Design).
Vertical Bar: Deep expertise in Frontend Architecture.
// The Script
"In 5 years, I see myself as a Staff Engineer. I want to have deep expertise in [React/Performance] but also understand the backend well enough to design complete systems."
Real World Example: Mentorship Focus
Goal: Transition from Senior Dev to Team Lead.
Plan: "I want to spend the next few years improving my mentorship skills. I plan to take on interns and lead smaller sub-teams to build that muscle."
Show Answer Strategy
Strategy: "I want to deepen my technical expertise to become a Senior/Staff Engineer, leading large-scale architectural decisions and mentoring junior devs." (Tailor this to the role: IC track vs Management track).
Q: Why do you want to leave your current job?
Run towards, not away.
Basic Implementation: The "Pivot" Technique
// 1. Gratitude (Past)
"I've learned a ton about [X] at my current role..."
// 2. The Gap (Present)
"...however, the company is moving towards [Legacy Tech/Maintenance Mode]..."
// 3. The Goal (Future)
"...and I'm really eager to work on [Modern Stack/High Scale] which is why I'm excited about this role."
Real World Example: Seeking Scale
"My current company is a small startup (10 people). I've worn many hats, but I want to join a larger engineering organization to learn best practices for CI/CD and testing at scale."
Show Answer Strategy
Do: "I've learned a lot, but I'm looking for new challenges/growth opportunities/technologies that my current role can't offer."
Don't: "My boss is terrible" or "The company is a mess."
Q: Why should we hire you?
Value proposition.
Basic Implementation: The "Bridge" Method
// Formula:
[Your Skill] + [Their Problem] = [Value]
// Example:
"You mentioned you're struggling with [Mobile Performance].
In my last role, I improved our Core Web Vitals by [40%].
I can bring that same optimization process to your team immediately."
Real World Example: The "Culture Add"
"Beyond my React skills, I noticed you're building a remote-first team. I've been working remotely for 5 years and have established protocols for async communication that I can share to help the team collaborate better."
Show Answer Strategy
Strategy: Connect your skills to their problems. "You need someone to migrate to Next.js, and I just successfully led that migration at my last job. I can hit the ground running."
Q: Do you have any questions for us?
Always say yes.
Basic Implementation: The "Insightful" List
// Culture:
"What's the last thing you learned from a junior developer?"
// Process:
"How does a feature get from 'Idea' to 'Production' here?"
// Challenges:
"What keeps you up at night regarding the codebase?"
Real World Example: The "Red Flag" Detector
Question: "When was the last time you worked on a weekend?"
Why ask: To gauge work-life balance without asking "Do you have work-life balance?" (which everyone says yes to).
Show Answer Strategy
Examples: - "What does a typical day look like?"
- "What is the biggest technical challenge the team is facing?"
- "How do you handle code reviews?"
- "What is the team culture like?"
6. System Design (Frontend)
Q: How would you design a News Feed (like Facebook/Twitter)?
// Concept:
Only render items that are in the viewport + a small buffer.
// Library:
Use `react-window` or `react-virtualized`.
// Why:
Rendering 1000 DOM nodes crashes the browser. Rendering 10 is fast.
// Problem:
Request A (search "Rea") fires. Request B (search "React") fires.
Request A returns *after* Request B. Results for "Rea" overwrite "React".
// Solution:
Use an `AbortController` to cancel the previous request when a new one starts.
Show Answer Strategy
Key Points: - Debouncing: Wait 300ms after typing stops before fetching.
- Caching: Cache results for same queries.
- Race Conditions: Ignore old requests if a new one finishes first.
- Accessibility: Keyboard navigation (Arrow keys), ARIA attributes.
// 1. Load Tiny Placeholder
Load a 10px wide version of the image (200 bytes) immediately. Scale it up with `filter: blur(20px)`.
// 2. Load Full Image
Load the high-res version in the background.
// 3. Swap
When high-res is ready, fade it in over the blurred placeholder.
Show Answer Strategy
Key Points: - Lazy Loading: Don't load off-screen images.
- Thumbnails: Load small version first, then full res.
- CDN: Serve images from edge locations.
- Formats: Use WebP/AVIF.
// 1. User hits Send
Add message to UI immediately with status: 'sending'.
// 2. Send to Server
If success -> update status to 'sent'.
If fail -> update status to 'error' and show "Retry" button.
// Why?
Makes the app feel instant, even on slow networks.
Show Answer Strategy
Key Points: - WebSockets: For real-time bi-directional communication.
- State: Optimistic UI for sending messages.
- Offline Support: Service Workers / LocalStorage.
- Security: Sanitize messages (XSS).
// Complex Case:
"You have {count} messages."
// Library (i18next):
t('messages_count', { count: 5 });
// Handles "1 message" vs "5 messages" automatically based on language rules.
Show Answer Strategy
Strategy: Use a library like react-i18next. Store strings in JSON files (en.json, es.json). Use keys in code t('welcome_message'). Handle RTL (Right-to-Left) layouts for languages like Arabic/Hebrew.
Q: How do you handle Error Logging?
Sentry.
Basic Implementation: Error Boundary
class ErrorBoundary extends React.Component {
componentDidCatch(error, info) {
logToService(error, info); // Send to Sentry
}
render() {
if (this.state.hasError) return <h1>Something went wrong.</h1>;
return this.props.children;
}
}
Real World Example: Source Maps
// Problem:
Production code is minified (`a.b() is not a function`).
// Solution:
Upload Source Maps to Sentry during the build process.
Sentry uses them to un-minify the stack trace so you see `UserComponent.js: line 42`.
Show Answer Strategy
Strategy: Use a service like Sentry or LogRocket. Wrap the app in an Error Boundary. Capture unhandled promise rejections. Log context (User ID, Browser version) to help debugging.
Q: How do you optimize Critical Rendering Path?
Lighthouse.
Basic Implementation: Resource Hints
<head>
<!-- Preload critical font -->
<link rel="preload" href="font.woff2" as="font" type="font/woff2" crossorigin>
<!-- Preconnect to API domain -->
<link rel="preconnect" href="https://api.mysite.com">
</head>
Real World Example: Inlining Critical CSS
Strategy: Extract the CSS needed for the "Above the Fold" content (Header, Hero).
Action: Put that CSS in a `<style>` tag in the HTML head.
Result: The page renders instantly without waiting for the main `styles.css` file to download.
Q: How would you design a Collaborative Document Editor (like Google Docs)?
CRDTs, OT.
Basic Implementation: The Concept of OT
// User A: inserts "A" at index 0.
// User B: inserts "B" at index 0.
// Without OT: Result might be "BA" or "AB" depending on network.
// With OT: Server transforms User B's operation to "insert 'B' at index 1" because User A got there first.
Real World Example: Yjs (CRDT Library)
import * as Y from 'yjs'
import { WebsocketProvider } from 'y-websocket'
const doc = new Y.Doc()
const wsProvider = new WebsocketProvider('ws://localhost:1234', 'my-room', doc)
const ytext = doc.getText('codemirror')
// Bind ytext to editor...
Show Answer Strategy
Key Points: - Conflict Resolution: Operational Transformation (OT) or CRDTs (Conflict-free Replicated Data Types).
- WebSockets: For real-time character-by-character updates.
- Presence: Showing where other users' cursors are.
- Offline: Local storage and syncing when back online.
Q: How would you design a Video Streaming Platform (like Netflix/YouTube)?
// 1. Transcode
Server splits video into 10-second chunks (.ts files) and creates a manifest (.m3u8).
// 2. Adaptive Player
Client downloads manifest.
If bandwidth is high -> download 1080p chunks.
If bandwidth drops -> switch to 480p chunks automatically.
Show Answer Strategy
Key Points: - Adaptive Bitrate Streaming (ABR): HLS or DASH protocols to adjust quality based on bandwidth.
- CDN: Heavy caching at edge locations.
- Player State: Buffering, seeking, remembering playback position.
- DRM: Digital Rights Management for content protection.
Q: How would you design a File Upload System (Google Drive)?
// Logic:
1. Slice file: `file.slice(start, end)`
2. Upload chunk 1 (0-1MB).
3. Save progress to LocalStorage.
4. If network fails, read progress and start uploading chunk 2 (1-2MB).
Show Answer Strategy
Key Points: - Chunking: Split large files into small chunks to avoid timeouts and allow resuming.
- Progress: Track upload progress per chunk.
- Drag & Drop: HTML5 Drag and Drop API.
- Virus Scanning: Scan files on the server before making them available.
7. Engineering Process & Methodology
Q: How do you estimate software tasks?
Uncertainty.
Basic Implementation: The "Cone of Uncertainty"
// Start of Project:
Estimate: 1 week (+/- 400%) -> Could be 1 day or 1 month.
// After Specs:
Estimate: 1 week (+/- 50%) -> 2.5 to 7.5 days.
// After Prototyping:
Estimate: 1 week (+/- 10%) -> 4.5 to 5.5 days.
Real World Example: Planning Poker
Process: Team votes on complexity using Fibonacci numbers (1, 2, 3, 5, 8, 13).
Benefit: If I vote "3" and you vote "13", we discuss *why*. Usually, you thought of an edge case I missed.
Show Answer Strategy
Strategy: Break down the task into the smallest possible sub-tasks. Estimate based on complexity (Story Points) or time (Hours/Days). Always add a buffer for testing, code review, and unexpected issues (often 20-30%).
Q: What is your opinion on Test Driven Development (TDD)?
Pragmatism.
Basic Implementation: Red-Green-Refactor
// 1. Red (Write failing test)
expect(add(1, 2)).toBe(3); // Error: add is not defined// 2. Green (Make it pass)
const add = (a, b) => a + b;
// 3. Refactor (Clean up)
const add = (a, b) => Number(a) + Number(b); // Handle strings
Real World Example: When NOT to use TDD
"I don't use TDD when exploring a new API or prototyping a UI layout, because I don't know what the code will look like yet. I add tests once the design stabilizes."
Show Answer Strategy
Strategy: "I see value in TDD for complex logic or utility functions where edge cases are critical. For UI components, I often prefer writing tests after the initial prototype is stable, or using integration tests, as the DOM structure changes frequently."
Q: How do you ensure documentation is kept up to date?
Culture.
Basic Implementation: Docs as Code
// Markdown in Repo:
/docs/architecture.md
/docs/api.md
// PR Rule:
"If you change the API signature in `user.ts`, you must update `api.md` in the same PR."
Real World Example: Auto-Generation
Tool: Storybook or Swagger.
Benefit: The documentation is generated *from* the code. If the code changes, the docs update automatically. No manual drift.
Show Answer Strategy
Strategy: Treat documentation as code. Require documentation updates in the Definition of Done (DoD) for a PR. Use tools that auto-generate docs (Storybook, Swagger) where possible.
Q: How do you balance Speed vs. Quality?
Context matters.
Basic Implementation: The "Iron Triangle"
// Variables:
Scope, Time, Quality.
// The Rule:
"You can pick two. If you want High Quality and Fast Time, we must reduce Scope."
Real World Example: The "Tech Debt Credit Card"
"We can ship this feature in 2 days if we hardcode the logic (Speed).
But we'll have to pay the 'interest' later by refactoring it next sprint (Quality).
Is the immediate release worth the future cost?"
Show Answer Strategy
Strategy: "It depends on the stage of the project. For a startup MVP, speed is often prioritized to validate the market, accepting some tech debt. For a mature financial application, quality and stability are non-negotiable."
8. Ethics & Culture
Q: What would you do if asked to implement a "Dark Pattern"?
Ethics.
Basic Implementation: The "User Trust" Argument
// Scenario:
PM wants to make the "Unsubscribe" button invisible.
// Response:
"I understand we want to reduce churn. However, hiding the button frustrates users and leads to spam reports, which hurts our email deliverability. Let's instead add a 'Pause Subscription' option to offer value."
Real World Example: Accessibility as Ethics
Situation: Designer wanted low-contrast grey text because it looked "sleek".
Action: I showed them a simulation of how it looks to someone with visual impairments.
Result: We agreed to darken the text to meet WCAG AA standards.
Show Answer Strategy
Strategy: Push back respectfully. Explain the long-term damage to user trust and brand reputation. "If we trick users into subscribing, they will just chargeback or leave bad reviews. It's better to win them over with value."
Q: How do you foster an inclusive environment?
Awareness.
Basic Implementation: Inclusive Language
// Instead of:
"Hey guys, let's man the helpdesk."
// Use:
"Hey team, let's staff the helpdesk."
// Instead of:
"Whitelist / Blacklist"
// Use:
"Allowlist / Blocklist"
Real World Example: Meeting Dynamics
Action: In meetings, I notice who hasn't spoken yet.
Script: "I'd love to hear [Name]'s thoughts on this since they worked on the related module."
Result: Ensures quieter voices are heard and valued.
Show Answer Strategy
Strategy: Be mindful of language (e.g., avoiding "guys" for mixed groups). Ensure everyone has a chance to speak in meetings. Advocate for accessibility so the product is usable by everyone. Call out bias when I see it."
Q: How do you handle a production incident (On-Call)?
Q: What is "Psychological Safety" and why is it important?
Google's Project Aristotle.
Show Answer Strategy
Strategy: It's the belief that you won't be punished or humiliated for speaking up with ideas, questions, concerns, or mistakes. It is the #1 predictor of high-performing teams because it fosters innovation and faster bug reporting.
Q: How do you approach "Accessibility" (a11y) from an ethical standpoint?
Inclusion.
Show Answer Strategy
Strategy: "Accessibility isn't just a compliance checklist; it's a civil right. Building inaccessible software excludes millions of people (blind, motor impaired, etc.) from participating in society. It's our ethical duty to build for everyone."
Q: How do you handle "Imposter Syndrome"?
Honesty.
Show Answer Strategy
Strategy: "I acknowledge that no one knows everything in this field because it changes so fast. I focus on my ability to learn rather than what I already know. I also talk about it with peers, which usually reveals they feel the same way."
Q: What is the "Bus Factor" and how do you increase it?
Knowledge sharing.
Show Answer Strategy
Strategy: The number of people who would need to get hit by a bus for the project to stall. If it's 1, that's bad. I increase it by writing documentation, pair programming, and rotating responsibilities so knowledge is distributed."
Q: How do you give feedback to your manager?
Managing up.
Show Answer Strategy
Strategy: "I schedule a 1:1. I frame it around how their actions impact the team's output. 'When we change priorities mid-sprint, the team loses momentum. Could we try to lock scope for 2 weeks?' I focus on solutions."
Q: How do you handle burnout?
Sustainability.
Show Answer Strategy
Strategy: "I recognize the signs early (cynicism, exhaustion). I communicate with my lead to adjust workload. I make sure to disconnect fully during off-hours and take my vacation time to recharge."
Q: What is "Blameless Post-Mortem"?
Process over people.
Show Answer Strategy
Strategy: A meeting after an incident where we focus on what failed in the system, not who made the mistake. We assume everyone had good intentions. The goal is to improve the system so the same mistake is impossible to make again.
Q: How do you handle a disagreement about code style?
Automation.
Show Answer Strategy
Strategy: "I suggest we stop arguing and let a tool decide. We should adopt Prettier and ESLint. Subjective style debates waste time; automation solves it instantly and consistently."
Q: How do you onboard a new developer?
Empathy.
Show Answer Strategy
Strategy: "I create a 'First Day' checklist. I assign them a 'Buddy' for questions. I encourage them to push a small code change to production on day 1 or 2 to build confidence. I make them feel welcome and safe to ask 'stupid' questions."