reactjs-training-course-curriculum

1. React JS React JS qttworld www.qualitythought.in

2. React JS ReactJS18.2.0 Training Overview React (also known as React.js or ReactJS) is a free and open-source front-end JavaScript library for building user interfaces based on UI components. It is maintained by Meta (formerly Facebook) and a community of individual developers and companies. It is used for creating dynamic and interactive user interfaces for mobile and web applications. It is highly flexible, declarative and efficient for developing scalable, simple, and fast front-end for web & mobile applications. In simple terms, React JS effectively handles the view layer of mobile and web application. React can be used as a base in the development of single-page, mobile, or server-rendered applications with frameworks like Next.js. However, ReactJS is only concerned with state management and rendering that state to the DOM, so creating React applications usually requires the use of additional libraries for routing, as well as certain client-side functionality React is flexible in such a way that, in any application, we can use as little or as much React as you need. For example, react can be used in any existing web application to develop a new feature or even the application’s entire UI. ReactJS has become highly popular across the globe because of its extra simplicity and flexibility. Many people are even referring to ReactJS as the future of web development. Part of this huge popularity comes from the fact that top corporations such as Facebook, PayPal, Uber, Instagram, Airbnb etc use it to develop the user interfaces. Objectives of the Course This is to provide in-depth insights about ReactJS and keep updated yourself with latest ReactJS concepts and it’s integrated other technologies according to updated industry standards. e The main objective of React Training is to make you as a top-class React.js Developer able to design and build modern Interactive user interface components to enhance application performance. Who should do the Course e Anyone who is trying to learn fastest growing UI framework and one of the top 3 frameworks. It is growing fast in terms of opportunities too. Prerequisites e HTML e JavaScript e CSS e History of JavaScript Features e let & const with example e Arrow Functions e Alternative e /qtworld /qualitythought.in

3. React JS Corporate Training Complete ReactJS (In-Depth) e Tips and Arrow Functions Exports and Imports e Tips for exports and imports e Classes with example e Classes example e Inheritance e Spread and rest Parameter e Destructing e ReactJS: All about Components e React Components Creating a Functional Component Example e Component Names Must Be Capitalized e Components vs Elements e Elements Are Immutable e Properties e Property Naming Convention e Properties Default to 'True' e Spread Attributes (an ES6 Feature) e Expressions e Fragments e Functional Components e Nesting JSX Elements e Example of JSX Nesting e Comments in JSX Code e Setting CSS Styles Using Classes e Setting CSS Styles Directly e JSX Escapes Values e Working with Lists of Items - e Iterating through Lists Keys in Lists e Example List with Key e State e State in React e Setting state e Types of State Data e State Hierarchy e Lifting State Up e Props vs. State e Pass Down a Function e Immutability e Immutability – Why? e Virtual DOM and State e Updating Input fields e Passing Props to Components e Passing Functions to Components e Event Handling e Event Handler Example e Event Binding - Dos e Event Binding – Don'ts e Passing Parameters to Event Handlers e Component Life-cycle e Initial Render e Props Change e Stage Change e Component willMount e Component didMount e Component Unmount e Life-cycle in Functional Components e Applying Different Lifecylces in the Application. e When to choose Appropriate lifecycles. e Interaction in between components e Component Communication using Context e ReactJS: Introduction e What is ReactJS? Version history. e Why ReactJS? e Advantages of React JS e Internals of ReactJS. e Work flow of React JS e Scope of React JS e Software’s required. e ReactJS: Setup – First Application e About NodeJS Installation e Npm – managing the packages e Create First ReactJS Application e Build and Execute e About Visual Studio Code e Installation of Visual Studio Code e Managing the ReactJS e application using Visual Studio Code ReactJS: JSX e Overview of JSX Jsx syntax e Difference between JS and JSX. e Jsx Parser e Comments in jsx e Introduction of Virtual DOM. e Rendering an Element into the DOM e Naming Conventions e JSX Transpilation to React Code Example e Running the Transpiled Code e What are the JavaScript e expressions available in JSX? /qtworld /qualitythought.in

4. React JS Forms and UI e Lists of Form components. Setup Controlled and Uncontrolled e form components. Control Input elements. e How to set default values on e all formats of Input elements. React JS Form validations. e How to write Styles? e Create a React Form. e e Client-side form validation. Applying form components. e Submit and reset the form. e Control State Location State Location State Side Effects e Session State e e e Event handling in JSX e on Blur, onKeyUp, onChange and other useful primary events in React JS. How to Sharing events between the components? e Communicate Data between components. e Applying all lists of events e Animations overview e Styles in ReactJS e CSS and inline styles in React JS overview. Introduction to styled components e Styling the application using styled component e How to use Animations in the Application e Working with Rest API e Calling REST API Sending POST request e CURD Operations example e Building React Apps with Redux e Redux Redux Terminology e Redux Principles e Redux: Actions e Redux Action Types e Action Creators e Dispatching Actions e Data Flow Basics e Redux Reducers e Pure Functions e Reducer Example e Returning Default State e Creating a Development e Environment with create-react-app Using Redux with React e Initializing the Store e Immutability e Benefits of Immutable State e Mutability of Standard types e Copying Objects in JavaScript e Copying Arrays in JavaScript e One Store - Multiple Reducers e Combining Reducers e Components and Redux e The React-Redux Package e Wrapping App with Provider e mapStateToProps e mapDispatchToProps e Using Mapped Properties and Methods e Wrapping Components with Connect e Configure Store e Programming Advice - MultiTab Console e React Router e Routing and Navigation react-router e Creating a react-router based project e A Basic Routed Component e Router vs. BrowserRouter e The Route component e Redirect Route e Navigating with e Route Parameters e Retrieving Route Parameters e QueryString Parameters e Create a Single Page Application. e Applying Routing. e Dynamically render the e components based on the url State Management for React e React State Basics – Props and State Props e State in Class Based Components e Managing State with Hooks in e Functional Components The Problem with Props and State e Redux State Library e Redux Advantages e Redux Disadvantages e Basic Rules for State Management e Types of State e e Communication State e Data State /qtworld /qualitythought.in

5. React JS Flux e What is Flux Architecture? What are the Flux Components available? e How Flux works? e Flux and React works together. e Creating Custom React Hooks e Custom Hooks Custom Message Hook e Using the Custom Message Hook e A Custom useList Hook e Using the useList Custom Hook e The built-in useDebugValue Hook e Viewing the Effect of e the useDebugValue Hook Using React Hooks e Functional Component Shortcomings Hooks Overview e Hook Rules e Unit Testing React with React Testing Library e What are the necessary Tools required for Unit Testing? React Unit Testing overview e Introduction to JEST. e Using Jest with Test Utils from React-DOM e Using Jest with the React Testing Library e Using Jest with Enzyme e How to Test React Component? e How to Test React Router? e Features e Snapshot Testing e Code Coverage e Interactive Mode e Projects created with create-react-app e Default App Component Test e Unit Tests e Anatomy of a Unit Test e Common Matchers e Combining Tests e Running Tests e Testing Promise based async e code with 'done' Setup and Teardown e react-testing-library e A Simple Component Test e A Simple Snapshot Test e Running and Updating SnapShot Tests e Building Component Tests e Calling Render e Render Properties e Simulating Events e Testing Results e Using Query Functions e Text Matching e Counter Component e counter-test.js e Using React Hooks e Functional Component Shortcomings Hooks Overview e Hook Rules e React Linter Example e Functional Component Props e The useState Hook e Functional Component using the useState hook e useState with Multiple Variables e useState can also be used with Objects e The useEffect Hook e useEffect Hook Example e Using useEffect Hook to Load Data e Restricting when useEffect is Called e The useContext Hook e Additional Hooks e The useReducer Hook e An Example Reducer Function e Calling and using useReducer e The useMemo Hook e useMemo Example e The useCallback Hook e useCallback Example e The useRef Hook e Using useRef to Hold Values e The useImperativeHandle Hook e useImperativeHandle Hook Example e The useLayoutEffect Hook e /qtworld /qualitythought.in

6. React JS Integration with Other Libraries e Gulp & Browserify React with jQuery e React & AJAX e Server Integration & Deployment e https httpster e npm e Code Splitting e Code splitting & Suspense Route Based Code Splitting e Lazy Loading e Isomorphic React e Server-Side Rendering SSR with React - Setup & Server e SSR with React - The Toolchain e New Features of React 16,17 and 18 Webpack Primer AND Isomorphic React Isomorphic React e Webpack and its use Setting up and installing Webpack e Working with the e configuration file of Webpack Working with loaders e Quick word on lazy loading, e code splitting, and tree shaking Setting up a hot module replacement e Server-side rendering (SSR) e Working with renderToStatic e Markup and renderToString methods Fetch Data Using GraphQL e What is GraphQL? Cons of Rest API e Pros of GraphQL e Frontend backend e communication using GraphQL Type system e GraphQL datatypes e Modifiers e Schemas e GraphiQL tool e Express framework e NPM libraries to build server side of GraphQL e Build a GraphQL API e NPM libraries to build client side of GraphQL e /qtworld /qualitythought.in

7. Quality Thought Infosystems India (P) Ltd.