Scribd
Upload
457 views

React Syllabus PDF

This document outlines the syllabus for a 60-hour React course. It covers fundamental React concepts like building first React apps, JSX, class and functional components, props, state, events, forms, lifecycles, hooks and more. The course progresses from introductory topics to more advanced ones, and includes examples and exercises to help reinforce learning. It aims to equip students with the core skills needed to develop single page applications with React.

Uploaded by

Ravi Kumar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
457 views

React Syllabus PDF

This document outlines the syllabus for a 60-hour React course. It covers fundamental React concepts like building first React apps, JSX, class and functional components, props, state, events, forms, lifecycles, hooks and more. The course progresses from introductory topics to more advanced ones, and includes examples and exercises to help reinforce learning. It aims to equip students with the core skills needed to develop single page applications with React.

Uploaded by

Ravi Kumar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

Contact No +91 7314853128

Visit – www.scalive.in

React Syllabus 60 hours

 Introduction
 What You Should Know Before Joining This Course ?
 What Is React ?
 What Problem React Solves ?
 What Are SPA’s ?
 Challenges In Developing A SPA
 React Advantages
 Is React A Framework OR Library ?

 Building First React App


 Two Ways To Develop A React App.
 Developing Using CDN.
 Developing Using Create React App.
 Difference between CDN And Create React App.
 Developing The First App
 Creating Function Based React Element
 Creating Siblings
 Creating Nested Components

 JSX
 What is JSX ?
 Why JSX ?
 Characteristics Of JSX ?
 Coding JSX
 Expressions In JSX
 Inserting A Large Block Of HTML
 Summary
 Conditional Rendering
 Different Ways Of Conditional Rendering

 ES6 Refresher
 Modules
 Exports and Imports
 Classes
 Spread & Rest Operators
 Destructuring

 Class Components
 Two Types Of Components
 Class Components
 How To Create Class Components
 Industry Recommended Way Of Structuring A React
Application

 Props
 What are props ?
 Using Props In React
 Some Important Points About Props
 How To Iterate Over Arrays In JSX
 Using map() Method Of Array
 Default props
 Exercises

 Styling
 Styling In React
 Different Ways Of Styling
 External StyleSheet
 Inline Styling
 JS Object Styling
 Exercises
 Create – React - App
 Introduction To CRA
 Installation Of Node Package Manager
 Creating A New Project Using Create-React-App.
 Introduction To CRA
 Installation Of Node Package Manager
 Creating A New Project Using Create-React-App.

 CRA Conventions
 Exercise To Better Understand Request Flow
 CRA Conventions
 How To Load Images In CRA ?
 How To Add CSS Files In CRA ?

 State In React
 What Is State ?
 How It Is Different Than Props ?
 Different Ways Of Initializing State
 Why To Update The State ?
 Correct Way To Update The State
 Points To Remember
 Exercises

 Event Handling
 Event Handling Basics
 How React’s Event Handling Differs From JS ?
 Concept Of Binding
 Passing Arguments To Event Handlers
 Different Ways Of Passing Arguments
 React Keyboard Events
 Getting The Key Pressed
 Examples
 Exercises

 React Design Principles


 React Design Principles
 Recommended Way Of State Updation
 What To Keep In State ?
 Data Flow In State
 Exercises

 Form Handling
 Form Recap
 How Forms Work In React ?
 UnControlled Components V/s Controlled Components
 Adding Multiple Fields
 Creating Dynamic Keys
 Examples
 Exercises

 Mini Project
 Creating A ToDo List App
 Apply All The Concepts Learnt Till Now

 Uncontrolled Components
 UnControlled Components
 Creating Ref
 Accessing Ref
 Examples

 Text – Area & Select


 TextArea In HTML
 TextArea In React
 DropDown List In HTML
 DropDownList In React
 Examples

 Lifecycle Of a Component
 React Component Life Cycle Phases
 React Component Life Cycle Methods
 Mounting Phase Methods
 Updating Phase Methods
 Unmounting Phase Methods

 Fragments
 What Is A Fragment ?
 Need Of A Fragment
 Syntax
 Example
 Local Storage
 Introduction
 What Is localStorage ?
 Methods Of localStorage
 Examples
 Exercise

 Introduction To Hooks
 Introduction To Hooks
 What Exactly Are Hooks ?
 Rules Of Hooks
 Types Of Hooks

 The useState() Hook


 Introduction To useState() Hook
 Syntax Of useState()
 Examples
 Exercise

***Incomplete Syllabus***
Thank You

You might also like