DEV Community

Jeya Lakshmi
Jeya Lakshmi

Posted on

React road map

You can learn ReactJS easily 🀩

Here's all you need to get started πŸ™Œ

1.Components
β€’ Functional Components
β€’ Class Components
β€’ JSX (JavaScript XML) Syntax

2.Props (Properties)
β€’ Passing Props
β€’ Default Props
β€’ Prop Types

3.State
β€’ useState Hook
β€’ Class Component State
β€’ Immutable State

4.Lifecycle Methods (Class Components)
β€’ componentDidMount
β€’ componentDidUpdate
β€’ componentWillUnmount

5.Hooks (Functional Components)
β€’ useState
β€’ useEffect
β€’ useContext
β€’ useReducer
β€’ useCallback
β€’ useMemo
β€’ useRef
β€’ useImperativeHandle
β€’ useLayoutEffect

6.Event Handling
β€’ Handling Events in Functional Components
β€’ Handling Events in Class Components

7.Conditional Rendering
β€’ if Statements
β€’ Ternary Operators
β€’ Logical && Operator

8.Lists and Keys
β€’ Rendering Lists
β€’ Keys in React Lists

9.Component Composition
β€’ Reusing Components
β€’ Children Props
β€’ Composition vs Inheritance

10.Higher-Order Components (HOC)
β€’ Creating HOCs
β€’ Using HOCs for Reusability

11.Render Props
β€’ Using Render Props Pattern

12.React Router
β€’
β€’
β€’
β€’
β€’ Route Parameters

13.Navigation
β€’ useHistory Hook
β€’ useLocation Hook

State Management

14.Context API
β€’ Creating Context
β€’ useContext Hook

15.Redux
β€’ Actions
β€’ Reducers
β€’ Store
β€’ connect Function (React-Redux)

16.Forms
β€’ Handling Form Data
β€’ Controlled Components
β€’ Uncontrolled Components

17.Side Effects
β€’ useEffect for Data Fetching
β€’ useEffect Cleanup

18.AJAX Requests
β€’ Fetch API
β€’ Axios Library

Error Handling

19.Error Boundaries
β€’ componentDidCatch (Class Components)
β€’ ErrorBoundary Component (Functional
Components)

20.Testing
β€’ Jest Testing Framework
β€’ React Testing Library

  1. Best Practices β€’ Code Splitting β€’ PureComponent and React.memo β€’. PH4N745M β€’ Avoiding Reconciliation β€’ Keys for Dynamic Lists

22.Optimization
β€’ Memoization
β€’ Profiling and Performance Monitoring

  1. Build and Deployment β€’ Create React App (CRA) β€’ Production Builds β€’ Deployment Strategies

Frameworks and Libraries

24.Styling Libraries
β€’ Styled-components
β€’ CSS Modules

25.State Management Libraries
β€’ Redux
β€’ MobX

26.Routing Libraries
β€’ React Router
β€’ Reach Router

Top comments (0)