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:

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