React and TypeScript questions, exercises and challenges to prepare for technical interviews.
This is a free resource for the developer community. Here you'll find real React and TypeScript interview questions explained clearly, with runnable examples, challenges backed by real tests, and "what does this code print?" questions.
Everything is written so a junior developer can understand it and, above all, learn to explain the concepts out loud.
It's the sibling repo of devbymike-js-interview-lab. If you're not solid on JavaScript fundamentals yet (closures, the event loop, this), start there: everything in this repo builds on top of that.
¿Prefieres estudiar en español? Todo el contenido está disponible en la rama
es.
A practice lab for React + TypeScript frontend interviews. It's not a long theory course: it's concrete, direct material aimed at getting you through your next technical interview.
It includes:
- Interview questions by topic, each with a short answer, a simple explanation, a code example, a common mistake and how to answer out loud.
- Code challenges with real Vitest + Testing Library tests: the tests are the requirements, just like in a real interview.
- Output questions (
what does this code print?) you can actually run, with answers and explanations. - Mock interviews for junior React, mid-level React and TypeScript profiles.
- A 4-week study plan.
- People who already know JavaScript and are going for their first frontend job.
- Juniors who want to strengthen React and TypeScript before an interview.
- Anyone who wants to practice explaining out loud why React works the way it does.
- Clone the repository and install the dependencies:
git clone https://github.com/MiguelCovarrubiasdaiz/devbymike-react-ts-interview-lab.git cd devbymike-react-ts-interview-lab npm install - Read the questions by topic, starting with
01-react-fundamentals/. - Before reading the answer, try to answer it yourself out loud.
- Solve the code challenges by making the tests pass, and predict the output questions before running them.
- When you feel ready, do the mock interviews in
08-mock-interviews/.
Tip: don't just read straight through. Read a question, cover the answer, answer it yourself, then compare.
The folder order is the recommended path:
01-react-fundamentals/— what React is, JSX, components, props vs state, keys, re-renders.02-hooks/—useState,useEffect,useRef,useMemo/useCallback, rules of hooks, custom hooks.03-typescript-fundamentals/— inference,interfacevstype, unions and narrowing,any/unknown/never, generics, utility types.04-react-with-typescript/— typing props, state, events and children.05-state-and-patterns/— lifting state up, controlled vs uncontrolled, context,useReducer.06-code-challenges/— practice building components and hooks against tests.07-output-questions/— put your understanding to the test.08-mock-interviews/— simulate the real interview.
There's a detailed 4-week plan in docs/study-plan.md.
You need Node.js installed (version 20 or newer). Install the dependencies once with npm install.
# All tests (code challenges)
npm test
# A specific challenge
npx vitest run 06-code-challenges/counter.test.tsx
# Pure TypeScript output questions
npm run output:001
npm run output:002
# React output questions (they run as tests; watch the console.log lines)
npm run output:003
npm run output:004
npm run output:005
# Type-check the whole repo
npm run typecheck- Read each question and answer it out loud, as if the interviewer were right in front of you.
- Use the "How to answer it in an interview" section of each topic as a base script, but in your own words.
- In the challenges, read the tests first: in a real interview, the requirements are your tests.
- Do the mock interviews in
08-mock-interviews/with a timer. - Review the output questions until you can predict the result without hesitating.
Found a bug, want to add a question or improve an explanation? All help is welcome. Read CONTRIBUTING.md to see how.
This repo goes along with my educational content. Find me as @DevByMike on TikTok, YouTube, Instagram and X (Twitter).
If this repo helps you, leave a star and share it with someone who's job hunting.
Don't memorize answers. Understand the concept and learn to explain it.
Interviewers aren't looking for recited definitions. They want you to understand why React re-renders, why state doesn't change immediately, why TypeScript flags that error. If you understand the concept, you can answer any variation of the question.
This project is under the MIT license. You can use it, share it and adapt it freely. Read LICENSE.