Visão Geral

Este Curso React Advanced, leva os desenvolvedores experientes do React ao próximo nível, ensinando-lhes os recursos mais sofisticados que o React tem a oferecer.

Neste Curso React Advanced, prático, os participantes aprendem os recursos avançados do React, incluindo ganchos personalizados, useReducer, eventos, subrotas e muito mais, com um instrutor experiente para orientá-lo.

Objetivo

Após realizar este Curso React Advanced, você será capaz de:

• Escreva componentes React que otimizam o DOM virtual
• Aproveite ao máximo o TypeScript com aplicativos React para segurança de tipo
• Use tipos de prop em vez de TypeScript
• Descreva todos os ganchos integrados
• Escreva seus próprios ganchos personalizados
• Acelere aplicativos com useMemo e useCallbak
• Resolva estado complexo com useReducer
• Ignorar perfuração de suporte com useContext
• Responda a todos os eventos - mesmo aqueles que o React não consegue controlar
• Crie rotas de navegação com o roteador mais recente
• Ler parâmetros de rota e strings de consulta
• Construa os hiperlinks mais rápidos
• Sub-rotas do autor
• Otimize o carregamento com subrotas

Publico Alvo

• Desenvolvedores experientes em React que desejam levar suas habilidades em React para o próximo nível.

Pre-Requisitos

habilidades em JavaScript, HTML5 e CSS e fazer nosso curso introdutório ao ReactJS ou ter conhecimento equivalente. 

Materiais

Conteúdo Programatico

Introduction

Understand the virtual DOM

1. Why the vDOM?
2. Reconciliation
3. How it compares
4. How to optimize your code
5. The Ivy engine
6. How hooks fit in
7. Why one-way data flow
8. Transpiling, bundling, minifying with webpack

TypeScript in React

1. JavaScript vs Java (et al.)
2. What TypeScript really does
3. TS does not provide strong typing
4. Interfaces vs types
5. Embracing functional vs OOP
6. Generics in React
7. Discriminated unions
8. CSS Properties
9. Event object
10. 3rd party libraries with no TS support

Proptypes

1. Built-in prop type checking
2. Making props optional
3. Setting prop types

Speeding up React with lazy loading

1. The best strategy
2. The lazy method
3. The Suspense component
4. Fallbacks
5. Code splitting
6. Error boundaries

Hooks overview

1. All built-in hooks
2. When to use the obscure ones

useContext for code clarity

1. Why prop drilling is evil
2. Create context
3. Reading context
4. Updating context

Deep dive into useEffect

1. How useEffect works
2. Simulating lifecycle events
3. Exhausting dependencies
4. useEffect belongs with its own render

Speeding your app with useMemo and useCallback

1. What is the difference?
2. Optimizing components with useCallback
3. Optimizing with useMemo
4. Why not just useMemo everything?

Fixing complex state - useReducer

1. What is useReducer?
2. Woot! No need for Redux, right?
3. How to optimize useReducer
4. When not to useReducer

How to write a custom hook

1. First - why?
2. The rules
3. How to write the code
4. How to best use a custom hook

Advanced event handling

1. React's synthetic events
2. How to handle events that React refuses to
3. Low-level power of events
4. The need to de-register events
5. Let's create an infinite scroll component

Routing

1. Overview of the newest React Router
2. Creating baseline routes

Route parameters & query strings

1. What's the difference?
2. REST and parameters
3. Creating route parameters
4. Reading route parameters
5. Reading query strings

Efficient hyperlinks

1. Why not use <a>?
2. How to do it the modern way
3. Relative vs absolute paths

Subroutes

1. Routes within routes
2. How to create relative routes
3. How this simplifies your complex navigation

11y (time permitting)

1. The case for a11y
2. Specs, laws, and requirements
3. React-specific handling

18n (time-permitting)

1. Globalization vs. localization
2. Detecting locale
3. How to do it in React