Description

Prerequisite: HTML, JavaScript, CSS, Bootstrap (optional), Node Fundamentals (optional)

Software Required: Node.js, Visual Studio Code and Google Chrome

Topics:

ECMASCRIPT 2015 Fundamentals

• ES2015– Working with Class
• ES2015 –Inheritance
• ES2015 – StringInterpolation
• ES2015 – let & constkeyword
• ES2015 – ArrowFunctions
• ES2015 – Spread and Restoperator
• ES2015 – CloningObjects
• ES2015 – Optional and DefaultParameters
• ES2015 – Working withPromises

Node.js Fundamentals

• NodeIntroduction
• Workingwith Inbuilt Node Modules (os, path, fs, events, http inbuild modules)
• Creating User-definedModules
• InstallingThird Party modules (Global and Project modules)
• UsingThird Party modules (rimraf, typescript, http-server, bluebird, bcryptjs, babel-cli babel- core babel-preset-env)
• Usage ofjson

Bootstrap fundamentals

• Bootstrapintroduction

React.js using ES5

• ReactIntroduction
• WhyReact?
• VirtualDOM
• How Virtual DOMWorks
• HowReact Renders the View
• ReactAdvantages

Core of React

• React Top LevelAPI
• CreateElement
• render
• createReactClass
• JSXIntroduction
• createReactClass

React Fundamentals

• React ComponentIntroduction
• Working withprops(Properties)
• PropValidations
• Static Methods inReact
• NestedComponents
• React andCSS
• EventHandling
• Usingrefs
• Working withState
• UnidirectionalFlow
• ReactComponent Life Cycle
• ReactComponent Life Cycle-phases
• ReactComponent Life Cycle methods execution sequence
• AddingKeys for Dynamic children
• Fetchingrecords for Top-level components using jQuery

Webpack Fundamentals

• WebpackIntroduction
• Settingup Webpack environment from the scratch
• Configuring ModuleLoader
• Weboptimization using webpack – bundling and minification

React using ES2015

• CreatingSetup for React to work with ES2015 and webpack
• Creating ContainerComponent
• SmartComponent and Dump Component
• Working withEvents
• Creating PresentationComponents
• ReactRouting

Redux

• Introduction toRedux
• UnderstandingReducer, State and Action
• Understandingthe usage of store

React using Redux

• Introductionto HOC (Higher order component)
• Usageof Provider and Connect
• ReduxFlow
• PracticalImplementation of State management using React with Redux
• Usage ofMiddleware
• How middlewareworks
• Creating and usingmiddleware