Introduction to React.js:
React.js is a front-end JavaScript library for building user interfaces. It was developed by Facebook and is maintained by Facebook and the open-source community.

Prerequisites to learn React:
There’s only one prerequisite and that is:

1. JavaScript

NOTE :

• Do not jump straight into React.js without understanding JavaScript because otherwise, you will be stuck in tutorial hell.

Step 1:
Before learning React, you should have a good understanding of these JavaScript topics :

• Basic Syntax
• ES6+ features
• Arrow functions
• Template literals

JavaScript prerequisites:
These concepts are important before dive into React

• Array Methods
• Object property shorthand
• Destructuring
• Rest operator
• Spread operator
• Promises
• Async/Await syntax
• Import and export syntax

React.js Roadmap

Step 2 :

Basic things to learn in React.js

• File & Folder structure
• Components
• JSX
• Props
• State
• Events
• Styling
• Conditional Rendering

Step 3 :

Learn about React.js Hooks - the essential hooks to learn :

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

Step 4 :

Then learn some of the React.js UI Frameworks :

• Material UI
• Ant Design
• Chakra UI
• React Bootstrap
• Rebass
• Blueprint
• Semantic UI React

Step 5 :
Learn to use some of the most popular React.js packages

• React Router
• React Query
• Axios
• React Hook Form
• Styled Components
• Storybook
• Framer Motion

Step 6 :
Learn how to manage state with state management tools

• Redux
• MobX
• Hookstate
• Recoil
• Akita

Step 7 :
More things to learn after learning React.js fundamentals

• Next JS ( Recommended )
• Gatsby
• TypeScript
• React Native
• Electron

Step 8 :
Learn to test your React.js applications with some of these libraries/frameworks:

• Jest
• Mocha
• Testing Library
• Enzyme

Follow me on Instagram: rafikadir