We at QuestPond conduct weekend training through GoToTraining on every Saturday for QuestPond active long 5 years validity members. At QuestPond, we along with trainer simplify complex topics and deliver it in simpler training. Starting from Saturday 17th Nov 2018 Step by Step Training on ReactJS, timing 09:00 PM to 11:00 PM India time.
| Chapter |
Details |
Chapter |
Details |
| ES6 Primer |
-
History of JavaScript
- What is ES6
- A word on bable
- Block scope, let & const
- Template literals
- Arrow functions
- Spread and Rest operators
- Object literal improvements
- Destructuring
- Classes
- Inheritance
- Static properties and methods
- Promises
- Iterators and Iterables
- Generators
- Modules
- Set and Map
|
Under error boundaries |
|
Introduction to React |
- What is React?
- Why React?
- React version history
- Just React - Hello World
- Using create-react-app
- Anatomy of react project
- Running the app
- Debugging first react app
| React’s new fiber architecture |
- React’s new fiber architecture.
|
| Templating using JSX |
- Working with React.createElement
- Expressions
- Using logical operators
- Specifying attributes
- Specifying children
| Routing with react router |
- Setting up react router
- Understand routing in single page applications
- Working with BrowserRouter and HashRouter components
- Configuring route with Route component
- Using Switch component to define routing rules
- Making routes dynamic using route params
- Working with nested routes
- Navigating to pages using Link and NavLink component
- Redirect routes using RedirectComponent
- Using Prompt component to get consent of user for navigation
- Path less Route to handle failed matches
|
| It's all about components |
- Significance of component architecture
- Types of components
- Functional
- Class based
- Pure
- Component Composition
| Just Redux |
- What is redux?
- Why redux?
- Redux principles
- Install and setup redux
- Creating actions, reducer and store
|
| Working with state and props |
- What is state and it significance
- Read state and set state
- Passing data to component using props
- Validating props using propTypes
- Supplying default values to props using defaultProps
|
Immutable.js for immutable datastructures |
- Immutable.js for immutable datastructures
|
| Understanding component lifecycle |
- Understanding lifecycle of component in reactjs
|
React Redux |
- What is React Redux?
- Why React Redux?
- Install and setup
- Presentational vs Container components
- Understand high order component
- Understanding mapStateToProps and mapDispatchtToProps usage
|
| Event handling in React |
- Understanding React event system
- Understanding Synthetic event
- Passing arguments to event handlers
|
Redux Saga(Redux middleware) |
- Why redux middleware?
- Available redux middleware choices
- What is redux saga?
- Install and setup redux saga
- Working with Saga helpers
- Sagas vs promises
|
| Rendering lists |
- Using react to key prop
- Using map function to iterate on arrays to generate elements
| Server-side rendering with react |
- What is server-side rendering (SSR)?
- Why SSR?
- Working with renderToString and renderToStaticMarkup methods
|
| Working with forms |
- Controlled components
- Uncontrolled components
- Understand the significance to defaultValue prop
- Using react ref prop to get access to DOM element
| Unit testing in react |
- Understand the significance of unit testing
- Understand unit testing jargon and tools
- Unit testing react components with Jest
- Unit testing react components with enzyme
- Using sinon to mock
|
| Understand react portals |
- Understanding all about react portals
| Webpack primer |
- What is webpack?
- Why webpack?
- Install and setup webpack
- Working with webpack configuration file
- Working with loaders
- Quick word on code splitting, lazy loading, tree shaking
- Setting up Hot Module Replacement
|
