Roadmap

What comes after week 4 — and the interview questions each topic unlocks

🚀 Path to Senior

TypeScript

Weeks 5-6, immediately after this track

Why: Every serious React codebase at 2-3+ yrs experience is TS. It's the single highest-leverage thing you're missing after this track.

Learn: TS fundamentals → typing props/state/hooks → generics → migrate one of your projects to TS

Advanced Testing

Weeks 7-8

Why: Confident PRs and code review credibility come from knowing what and how to test, not just RTL syntax.

Learn: Testing pyramid, mocking strategies (MSW), integration vs unit trade-offs, visual regression basics

System Design (Frontend)

Weeks 9-10

Why: Interviews at 3-4 yr level test component architecture and scaling decisions, not just syntax.

Learn: Component API design, state colocation vs global state, micro-frontends overview, design systems

Performance at Scale

Weeks 9-10, alongside system design

Why: Juniors optimize a component; seniors reason about the whole app's render/network budget.

Learn: React Profiler workflows, virtualization (react-window), image/bundle optimization, Core Web Vitals

GraphQL

Weeks 11-12 (optional, job-dependent)

Why: Common in mid-large product companies as an alternative to REST.

Learn: Apollo Client or urql basics, queries/mutations, caching model

Monorepos & Build Tooling

Weeks 11-12

Why: Senior devs are expected to reason about the build, not just the app.

Learn: Turborepo/Nx basics, understanding Vite/webpack config, module federation overview

Open Source / Code Review Reps

Ongoing, start as soon as Week 3 projects exist

Why: This is what compresses '4 weeks of tutorials' into 'reads like 3 years of experience' — there's no shortcut except reps.

Learn: Contribute to 2-3 real OSS repos; do code review on others' PRs; get your own PRs reviewed critically

🎯 Interview Prep — React Developer Mastery

Closures & 'this'

Typical questions: 'What's a closure, give an example'; 'What does this refer to in an arrow function vs regular function?'

What they're really checking: Whether you understand JS at a level below React, not just React syntax

Async JS / Promises

Typical questions: 'Explain the event loop'; 'Difference between Promise.all and Promise.allSettled'

What they're really checking: Debugging ability — async bugs are the most common real-world React bugs

useState vs useReducer

Typical questions: 'When would you use useReducer over useState?'

What they're really checking: Whether you can reason about state complexity, not just memorize hook APIs

useEffect

Typical questions: 'What's a stale closure bug and how do you fix it?'; 'Why does this effect run twice?'

What they're really checking: Depth — this is the #1 hook people use wrong; strong answers here signal real experience

Context API vs Redux

Typical questions: 'When would you NOT use Redux?'

What they're really checking: Judgment about tool selection and avoiding overengineering

Component Patterns (HOC/compound)

Typical questions: 'Refactor this prop-drilling example'; 'What's a compound component?'

What they're really checking: Whether you've built anything beyond tutorial-scale apps

Performance (memo/useMemo/useCallback)

Typical questions: 'When does useMemo NOT help?'; 'How do you find unnecessary re-renders?'

What they're really checking: Whether you optimize based on profiling data or cargo-cult memoization everywhere

Testing

Typical questions: 'How do you test a component that calls an API?'; 'Unit vs integration test here?'

What they're really checking: Production-readiness and whether you ship confidently

React Router / Protected Routes

Typical questions: 'How do you handle auth redirects?'

What they're really checking: Whether you've handled real app auth flows, not just static pages

Next.js / SSR vs CSR

Typical questions: 'When would you choose SSR over CSR?'

What they're really checking: Awareness of rendering strategies — increasingly expected even for 'React' roles