Streaming Free on Youtube:

https://www.youtube.com/@rahuulmiishra

To Support me, you can buy it.

Meet the creator:

Rahul Mishra has a decade of experience in working with different web and mobile technologies, primarily as an expert in web development using ReactJS.

Find Him on LinkedIN:

https://www.linkedin.com/in/rahuulmiishra/

In this course, I have explained how we should learn React. I have shared all my wisdom of a decade so that it becomes straightforward to understand the nitty and gritty of React.

Course Content:

Day 1:

Watch For Free Here:

https://www.youtube.com/watch?v=LKEkkHGrE8M

1. Course Walkthrough
2. Minimum HTML Required
3. Minimum Javascript Required
4. Minimum ES6 Required
5. You Don't need React to build your dream app
6. Why React?
7. Why DOM Updates are costly?
8. SPA vs Traditional Apps
9. What is React.
10. Adding React to JS Project
11. What is a babel
12. JSX
13. JSX Challenge

Day 2:

Watch For Free Here:

https://www.youtube.com/watch?v=3OZYHiEJY2U

1. What problem JSX solves
2. JSX Rules
3. XSS Attack prevention in JSX
4. Suggestion to new learners
5. Components
6. Thinking in React
7. Before creating the Component: Think
8. Search Component Demo
9. Props in Detail
10. Dynamic Tags via Component
11. Atomic vs NonAtomic
12. VDOM
13. App() vs <App/>
14. JSX to UI Journey

Day 3:

1. Adding external JS Package in HTML
2. CDN
3. npm
4. LockJson and ^ : Idea, In Detail Covered in Day 13
5. Modules (CJS,AMD,UMD,ESM)
6. ESM
7. Package Bundlers:Webpack
8. Why Vite ?

Day 4:

1. The sum of 2 Numbers using JS+HTML
2. useState function in JS
3. Re-Paint Problem in JS
4. JS in React
5. useRef
6. No change detection on normal variables
7. useState
8. No state change == No RePaint
9. what is re-render?
10. useState Flow Diagram
11. Avoid function call in JSX - without currying (Currying covered in next day)
12. no value change = no re-render
13. Increment Decrement Counter
14. calling multiple setState updates
15. Few suggestion on what to build(Small Apps)

Day 5:

1. Calculator App Development using React

Day 6:

1. Thinking In React: Components and Props
2. useEffect
3. Object Change Detection
4. useEffect Summary
5. Word Guessing Game Intro
6. Component Breakdown
7. Folder Structure
8. Component Creation

Day 7: Word Guessing Game

1. App Requirement Walkthrough
2. Steps to Build Apps
3. Components Breakdown
4. Design: Assembling Components
5. Coding: Assembling Components
6. Preparation of Data
7. Consuming Data
8. Hint Component Functionality
9. Winning Logic

Day 8:

1. useState
2. useState with Updater function
3. Lifecycle with Humans Analogy
4. Lifecycle of React Components
5. Mount Unmount Meaning
6. Strict Mode
7. Prevent Calling method twice
8. Pure Function
9. Why we use useEffect?
10. 3 Flavours of useEffect

Day 9:

1. Art of Crafting Perfect Component
2. useEffect Summary
3. Problem with using useEffect
4. Don't use useEffect
5. Problem with useState
6. useReducer useCase 1
7. useReducer useCase 2

Day 10:

1. cleanup function of useEffect
2. What happens on state change
3. memo
4. useMemo
5. useCallback
6. When to use these performance optimisations
7. custom hook
8. API call using custom hook
9. Provider Context

Day 11:

1. Before using Memo: 2 Technique to avoid Memo
2. Provider Context Problem Setup
3. Provider Context Solution
4. Rules of Hooks
5. useId
6. index as a key
7. React Portal
8. HOF
9. HOC

Day 12:

1. Steps to create a new project
2. Page management
3. Network Layer
4. LazyLoading or CodeSplitting
5. Lazyloading a Util File
6. Error Boundary
7. Infinite Scroll
8. Virtualization

Day 13:

1. Reading JSON file: Solution of Day 12
2. Infinite Scroll Using JS
3. Network Layer: Part 2
4. Auth Management
5. ESLint*
6. Prettier*
7. Generating Build and Deployment
8. ISR, SSR,SSG, CSR
9. NextJS Remix Preact
10. What Next