ReactJS

ReactJS basically is an open-source JavaScript library which is used for building user interfaces specifically for single page applications. It’s used for handling view layer for web and mobile apps. React also allows us to create reusable UI components.

React was first created by Jordan Walke, a software engineer working for Facebook. React first deployed on Facebook’s newsfeed in 2011 and on Instagram.com in 2012.

React allows developers to create large web applications which can change data, without reloading the page.

The main purpose of React is to be fast, scalable, and simple. It works only on user interfaces in application. This corresponds to view in the MVC template. It can be used with a combination of other JavaScript libraries or frameworks, such as Angular JS in MVC.

Modules:

• Module 1. REACTJS ? OVERVIEW
• React ? Features
• React ? Advantages
• React ? Limitations
• Module 2. REACTJS ? ENVIRONMENT SETUP
• Step 1 - Install Global Packages
• Step 2 - Create the Root Folder
• Step 3 - Add Dependencies and Plugins
• Step 4 - Create the Files
• Step 5 - Set Compiler, Server and Loaders
• Step 6 - index.html
• Step 7 - App.jsx and main.js
• Step 8 - Running the Server
• Module 3. REACTJS ? JSX Using JSX
• Nested Elements
• Attributes
• JavaScript Expressions
• Styling
• Comments
• Naming Convention
• Module 4. REACTJS ? COMPONENTS
• Stateless Example
• Stateful Example
• Module 5. REACTJS ? PROPS OVERVIEW
• Using Props Default Props
• State and Props
• Module 6. REACTJS ? PROPS VALIDATION
• Validating Props
• Module 7. REACTJS ? COMPONENT API
• Set State
• Force Update
• Find Dom Node
• Module 8. REACTJS ? COMPONENT LIFE CYCLE
• Lifecycle Methods
• Module 9. REACTJS ? FORMS
• Simple Example
• Complex Example
• Module 10. REACTJS ? EVENTS
• Simple Example
• Child Events
• Module 11. REACTJS ? REFS
• Using Refs
• Module 12. REACTJS ? KEYS
• Using Keys
• Module 13. REACTJS ? ROUTER
• Step 1 - Install a React Router
• Step 2 - Create Components
• Step 3 - Add a Router
• Module 14. REACTJS ? FLUX CONCEPT
• Flux Elements
• Flux Pros
• Module 15. REACTJS ? USING FLUX
• Step 1 - Install Redux
• Step 2 - Create Files and Folders
• Step 3 - Actions
• Step 4 - Reducers
• Step 5 - Store
• Step 6 - Root Component
• Step 7 - Other Components
• Module 16. REACTJS ? ANIMATIONS
• Step 1 - Install React CSS Transitions Group
• Step 2 - Add a CSS file
• Step 3 - Appear Animation
• Step 4 - Enter and Leave Animations
• Module 17. Project Work