React: 100-Day Internship

Dive into the world of real React developer tasks: solve practical challenges you'll meet at work. Join the team and level up from newcomer to professional.

Welcome to the team!

Imagine you've just joined the development team. You have a 100-day internship ahead where you'll solve real-world problems React developers face every day.

React internship team lead

Meet your team lead

This is Aleksandr — your team lead for the internship. He shares experience, gives direct feedback, and helps turn each task into a production-ready solution.

What awaits you?

  • Real tasks straight from a tech lead — no theory, only what you really need on the job
  • Gradual difficulty increase — from basic components to complex application architecture
  • Full React ecosystem coverage — hooks, context, routing, state management, and more

How to work with the trainer?

  1. Pick a task in order or by the topic you need
  2. Read the requirements and write code in the editor
  3. Move on to the next challenge once you've completed it

Interview block

Challenges recruiters actually send

This is the quick take-home before you get hired. Complete both challenges and you get invited to join.

🔥 Interview Case #1: Hello World

Prove to the hiring team that you can spin up a clean React component and render content instantly — the very first interview filter.

🟨 React 🎚️ Easy 🕐 10 minutes

🔥 Interview Case #2: Production Button

Final checkpoint before the offer: ship a Button component that changes style via props and looks like something you would actually deploy.

🟨 React 🎚️ Easy 🕐 10 minutes

A simulator built from real tasks and skills you use at work

Task #01

React: User Card

The first internship task — build a user card component that can accept name and email through props.

🟨 React 🎚️ Easy 🕐 1 story point
Task #02

React: Conditional Greeting

Render “Hello, user” or “Sign in”. Without useState.

🟨 React 🎚️ Easy 🕐 1 story point
Task #03

React: Click Callback

Pass onClick via props and trigger on button click.

🟨 React 🎚️ Easy 🕐 1 story point
Task #04

React: Product Cards via map

Render product cards from an array using Array.map.

🟨 React 🎚️ Easy 🕐 1 story point
Task #05

React: Extract Repeated UI into a Component

Move repeated UI into a reusable component and use it.

🟨 React 🎚️ Easy 🕐 1 story point
Task #06

React: Compose Small Components into One

Build a composite ProductCard from small components.

🟨 React 🎚️ Easy 🕐 1 story point
Task #07

React: Toggle Title Visibility

Show or hide a heading by clicking a button.

🟨 React 🎚️ Easy 🕐 1 story point
Task #08

React: Cart Quantity Controls

± buttons change quantity from 0 up to stock; total price updates.

🟨 React 🎚️ Easy 🕐 1 story point
Task #09

React: Input and Character Counter

Build a controlled input and display length up to 32.

🟨 React 🎚️ Easy 🕐 1 story point
Task #10

React: Checkbox Limit Selection

Build controlled checkboxes: allow selecting up to two, block the third with a gentle warning.

🟨 React 🎚️ Easy 🕐 1 story point
Task #11

React: Stopwatch / Timer — start, stop, reset

Implement a stopwatch with start, stop, and reset buttons. Show time in mm:ss.

🟨 React 🎚️ Easy 🕐 1 story point
Task #12

React: Todo List — add, delete, complete

Build a basic to-do: add items to state, delete, and mark complete.

🟨 React 🎚️ Easy 🕐 1 story point
Task #13

React: Controlled Form with Submit

Build a controlled form with multiple fields and a checkbox. Submit shows collected data.

🟨 React 🎚️ Easy 🕐 1 story point
Task #14

React: Progress Bar from Input

Controlled input (0–100) drives a progress bar. Validate and show percent.

🟨 React 🎚️ Easy 🕐 1 story point
Task #15

React: Console message on first render (useEffect)

Log an important message to the console once when the component mounts, using useEffect.

🟨 React 🎚️ Easy 🕐 1 story point
Task #16

React: window.resize listener with cleanup

Attach a window.resize handler on mount and remove it in effect cleanup.

🟨 React 🎚️ Easy 🕐 1 story point