ReactJS Training Course and Workshop in Bangalore, Mysore, Chennai, Hyderabad, Pune, Mumbai, Delhi, Noida, Gurgaon, Kolkata

The ReactJS training course provides a beginner's introduction to the powerful and ever-more popular ReactJS JavaScript framework. It has been designed for anyone who is already familiar with HTML and JavaScript, and perhaps already using another JavaScript framework, but wanting to understand the basics of ReactJS. ReactJS is quite a significant departure from most other JavaScript frameworks and it can be tricky to "get it". Key to "getting" ReactJS is understanding its key underlying concepts, so that's what this short course will focus on, through a mixture of diagrams and the creation of a simple working application. In this course, you will learn client-side routing using React Router, global state management and transitions using Redux, serverside rendering and testing using Jest, Enzyme and more.

By attending ReactJS workshop, delegates will learn to:

Understand the core concepts behind ReactJS
Begin to develop simple ReactJS applications

Familiar with HTML, CSS and JavaScript
Familiarity with Node.js will also be an advantage

This ReactJS class is suitable for anyone who wants to get a basic understanding of the ReactJS JavaScript framework

Introduction and Overview

Features of React and Flux
Benefits of the virtual DOM
Configuring the development and build environment

Displaying React content

Employing React.createElement() and React.DOM.* factories
Rendering the application with ReactDOM.render()
Constructing the UI on the server with renderToString()

Leveraging JSX for UI design

Coding custom components with React.createClass()
Generating component output with the render method
Composing a JSX component hierarchy
Incorporating third-party components

Parameterizing components

Disambiguating component properties and state
Inserting properties into rendered output with this.props
Passing property values using JSX { } expressions
Initializing default values with getDefaultProps()

Manipulating component state

Setting starting state values with getInitialState()
Reading application data with this.state
Mutating data with this.setState()
Harnessing React autobinding and event aggregation

Integrating into the component life cycle

Attaching and detaching logic and event handlers in componentDidMount and componentWillUnmount
Enhancing performance with componentShouldUpdate
Responding to changes with componentWillReceiveProps

Manipulating form input components

Working with interactive properties
value
defaultValue
checked
selected
Capturing form component updates with onChange
Comparing controlled and uncontrolled components

Simulating two-way binding

Applying the onChange / setState() convention
Employing the LinkedStateMixin
Passing ReactLink objects through the props hierarchy

Connecting React to REST services

Making Ajax calls from React
Mapping CRUD access to REST actions
GET
POST
PUT
DELETE

Modeling client-side data interactivity

Identifying Flux delegates
Actions
Dispatcher
Stores
Views
Harnessing unidirectional data flow
Comparing Flux to Model View Controller, Redux and Relay

Coding a Flux application

Extending the Facebook Dispatcher
Utilizing Node.js EventEmitter with custom stores
Integrating REST access with Flux action creators

Integrating routing into Flux

Exploiting the react-router for semantic URLs
Mapping URL paths and parameters to components

Developer tools

Inspecting React components with browser extensions
Identifying and debugging rendering errors

Unit testing

Running tests with Jest
Simulating event dispatch with ReactTestUtils.Simulate

Performance testing

Establishing a baseline
Profiling React execution with Perf.start() and stop()
Optimizing component reconciliation with key

Animating React Applications

Including the react-css-transition-group add-on
Employing the ReactCSSTransitionGroup component
Writing CSS transitions and animations

Encarta Labs Advantage

One Stop Corporate Training Solution Providers for over 6,000 various courses on a variety of subjects
All courses are delivered by Industry Veterans
Get jumpstarted from newbie to production ready in a matter of few days

Trained more than 50,000 Corporate executives across the Globe
All our trainings are conducted in workshop mode with more focus on hands-on sessions

ReactJS

COURSE AGENDA