React - Advanced Level

Coding at a higher level with React - advanced level.

Private session

This training is available in a private or personalized format. It can be provided in one of our training centres or at your offices. Call one of our consultants of submit a request online.

Call now at 1 877 624.2344

Duration: 2 days
Regular price: On request

Course outline

Duration : 2 days

Once you know the basics of React, you are now ready to master the next level. We cover all the arcane topics, including: architectural patterns of React, custom hooks, render props, higher order components, performance optimization, shared context, lazy loading, data immutability, Redux, suspense loader, concurrent mode and much more.

We even have demos on how to deploy your app on a phone or tablet device.

Contents

1. React Architecture Patterns

Separation of concerns in Components
Higher-Order Components
Render props
Custom hooks
Reusing components

2. Context

Property drilling
Why use a context?
Creating context using createContext()
Using providers and consumers
Updating Context

3. Working with State: Redux

Intro to Flux and Redux
Storage
Actions
Reducers
Using Hooks with Redux

4. Working with Asynchronous calls using Redux

Using Redux middleware
Using Redux-Thunk
Using the Redux dev tools
Using Fetch() with Redux

5. Redux Toolkit

Simplify store creation with configurStore()
Genereate reducers and actions with slices
Write simpler immutable updates with normal mutative code with immer
Filter data with selectors

6. Optimize React performance

Using production build
Avoiding reconciliation
ShouldComponentUpdate()
Pure Components
Memoize components with memo()

7. Suspense

Suspense, a loading component
Code splitting with Suspense
Data Fetching with Suspense
Render as you fetch pattern

8. Transitions

Transitions using Suspense
Three steps of fetching
Pending → Skeleton → Complete
Differing a value
SuspenseList

9. Concurrent Mode

Enabling concurrent mode
Concurrent Mode
Blocking Mode
Legacy Mode

10. Some additional technologies

React Native demo: Build phone apps using React
React Ionic demo: Build phone apps using the DOM

Surround yourself with the best

Frédéric Paradis

Certified Trainer and Cloud Architect

As a certified Microsoft trainer, Frédéric describes himself as a Cloud magician who easily navigates the mythical space between technology and reality.

Marc Maisonneuve

Training program director

Marc Maisonneuve has acted as a Training Program Director, professional effectiveness trainer and user tools practice leader at AFI for several years. Mr. Maisonneuve is known for his analytical skills, his legendary calm and his undeniable desire to encourage people to develop their skills. He has the ability to present technological solutions in a natural way and to adapt them to the concrete needs of the workplace.

Vicky Moreau

Trainer

Vicky Moreau is a passionate freelancer and professional in the area of office automation. She holds a college diploma in office automation, most of her solid experience with the Office Suite was acquired while being an autodidact. In fact, she has successfully completed an MOS (Microsoft Office Specialist) Excel certification.

Francis Ferland-Stevenson

Trainer

Francis began as a trainer more than 5 years ago by testing office automation tools designed specifically to met the needs of his colleagues. His calm and his empathy makes him able to adapt his language according to the level of experience of the group. This makes his learnings clear and accessible to anyone. As a trainer, he is therefore attentive to the needs of his students to make sure they meet their objectives and face the challenges.