Skip to content

React Roadmap

  • Roadmap: https://roadmap.sh/react

1. CLI Tools

  • Vite

2. Components

2.1 Functional Components

  • JSX
  • Props vs State
  • Conditional Rendering
  • Composition

2.2 Component Basics

3. Rendering

  • Component Lifecycle
  • Lists and Keys
  • Render Props
  • Refs
  • Events
  • High Order Components

4. Hooks

4.1 Basic Hooks

  • useState
  • useEffect
  • useCallback
  • useRef
  • useReducer
  • useMemo
  • useContext

4.2 Common Hooks

  • Creating Custom Hooks
  • Hooks Best Practices

5. Routers

  • React Router
  • Tanstack Router

6. State Management

  • MobX
  • Context
  • Zustand
  • Jotai

7. Writing CSS

  • Panda CSS
  • CSS Modules
  • Tailwind CSS

8. Component / Libraries

  • Material UI
  • Chakra UI
  • Shadcn UI

8.1 Headless Component Libraries

  • Radix UI
  • React Aria
  • Ark UI

9. API Calls

9.1 GraphQL

  • Apollo
  • Relay
  • urql

9.2 REST

  • react-query
  • Axios
  • swr
  • rtk-query

10. Testing

  • Vitest
  • Jest
  • react-testing-library
  • Cypress
  • Playwright

11. Frameworks

  • react-router
  • Astro
  • Next.js

12. Forms

  • React Hook Form
  • Formik

13. Types & Validation

  • TypeScript
  • Zod

14. Advanced Topics

14.1 Animation

  • Framer Motion
  • react spring
  • GSock

14.2 Error Boundaries

14.3 Server APIs

14.4 Suspense

14.5 Portals

15. Mobile Applications

  • React Native