react.gg

The interactive way to master modern React

by ui.dev
Course Section 01: The Big PictureChapters: Why?, Thinking in React, Imperative vs. Declarative, Pure Functions

What you’ll learn

Optimized for aha!

We’re obsessed with helping you reach your aha! moments.

Our text sections help you master the “why” behind React concepts and include fun, interactive visuals you can play with.

Give it a try.

Interactive diagram that toggles between a traditional approach of separation of concerns (HTML, CSS, and JS) and the React approach (all three combined in a component)COMPONENTSHTMLCSSJS
interactive
Course Section 02: Describing UIChapters: Components, JSX, Elements vs. Components, Props

Leetcode for React

Have you ever wished you could “grind Leetcode” for a bunch of React practice problems?

No? Oh, well we built it anyway. You’ll know you’ve mastered React if you can get through all 60.

Test yourself (it’s an easy one) 👉

challenge
Course Section 03: Bringing React to LifeChapters: Handling Events, Preserving Values with useState, Using useState, When React Renders

Videos you’ll actually enjoy

These aren’t lazy screencasts filmed in someone’s guest bedroom.

We spent an uncomfortable amount of time making sure each video is worth your attention.

Here’s a sneak preview.

video
Course Sections 04 and 05: Escaping React and Optimizing ReactChapters: Reality Check, Managing Effects, Preserving Values with useRef, Teleportation vs. Context, Complex State with useReducer, Referential Equality, Optimizing Renders with useMemo and useCallback, Advanced Effects with useLayoutEffect and useSyncExternalStore, Abstracting Reactive Values with useEffectEvent
useDebounceusePrevioususeLocalStorageuseMediaQueryuseIntersectionObserveruseWindowSize

50 custom hooks

We built useHooks — a popular OSS library of 50 reusable custom React hooks.

You’ll solidify your skills by rebuilding it. Yes, all 50.

Course Section 06: Custom HooksA selection of custom hooks including: useScript, useEventListener, useBattery, useFetch, useIdle, useThrottle, useKeyPress, useCopyToClipboard, useMouse, useOrientation, and more useToggleuseClickAway

Prepping for interviews?

Want to know the secret to feeling confident in a React interview?

Know more about React than the person interviewing you. This course, along with its 50+ interview question deep dives will get you there.

  • Quiz yourself

    In which of the following scenarios would you reach for useEffectEvent?
  • Quiz yourself

    The purpose of useSyncExternalStore is to _.
  • Quiz yourself

    True or false: React guarantees the code inside useLayoutEffect and any state updates scheduled inside it will be processed before the browser repaints the screen?
quiz
Course Section 07 and 08: Interview Questions and Server ComponentsChapters: Suspense, Rethinking React, Why Server Components?, React the Architecture, Leveraging RSC

Future proof React

React has evolved a lot in the last few years, and it shows no signs of slowing down.

We’ll walk you through all the latest features like server components, suspense, and concurrent rendering, while keeping you updated as new stuff comes out.

  • Suspense
  • Server Components
Course Section 09: BonusChapters: Compound Components, How Hooks Work, Why React Sucks, Why Next.js?, and more

Sign up for course updates

The limited private beta begins this summer.

For exclusive discounts, previews, and some fun surprises, drop your email below.

ui.dev is Tyler, Alex, Ben, & Lynn