Curso React and JavaScript

  • Development

Curso React and JavaScript

24h
Visão Geral

Este curso ensina aos alunos a introdução a tópicos avançados de React com JavaScript.

Objetivo

Após a conclusão deste curso, você será capaz de:

  • Aprenda como começar com React e JavaScript
  • Trabalhar com componentes
  • Saiba mais sobre o ciclo de vida do componente React
  • Trabalhar com formulários
  • Entenda o roteamento
Pre-Requisitos
  • 1-2 anos de experiência em JavaScript. Compreensão avançada de JavaScript, incluindo protótipos e funções como cidadãos de primeira classe.
Informações Gerais

Carga Horária: 24h

  • Se noturno este curso é ministrado de Segunda-feira à sexta-feira, das 19h às 23h
  • Se aos sábados este curso é ministrado das 9h às 18h
  • Se in-company por favor fazer contato para mais detalhes.

Formato de entrega: 

  • 100% on-line ao vivo, via Microsoft Teams na presença de um instrutor/consultor ativo no mercado.
  • Nota: não é curso gravado. 

Lab:

  • Laboratório + Exercícios práticos
Materiais
Português | Inglês
Conteúdo Programatico

Setup

  1. Verifying Node.js and either NPM or yarn
  2. Verifying class libraries
  3. Verifying class files
  4. IDE (WebStorm or Visual Studio Code preferred)

Introduction to React

  1. What problem(s) does React solve?
  2. Traditional, pre-JS web applications
  3. Late-model, MV* and JS web applications
  4. React's solutions
  5. Single-page apps
  6. View libraries
  7. Helper libraries
  8. React development environment
  9. Simplicity: create-react-app
  10. Build-your-own: an overview
  11. Hello world
  12. Your first React component
  13. Using React within a page
  14. Making some basic changes
  15. React and JSX

Components

  1. Two types of components
  2. Functional components
  3. Class-based components
  4. Why use one or the other?
  5. Testing basic components
  6. Props and state
  7. Passing in properties
  8. Limitations of properties
  9. Using state
  10. When to use state, when to use props
  11. Testing components with Enzyme
  12. Event handling
  13. React event handling
  14. Synthetic events
  15. React vs DOM event handling
  16. Testing events
  17. Children
  18. Components within components
  19. Known children and unknown children
  20. Testing child components
  21. Parent-child component communication
  22. Communication from parent to child
  23. Communication from child to parent
  24. Container vs presentational components

React Component Lifecycle

  1. Overview
  2. Startup and mounting
  3. Deprecated methods
  4. Updating
  5. Deprecated methods
  6. Unmounting
  7. Calling lifecycle methods in tests
  8. Error handling and error boundaries

Intermediate component usage

  1. PropTypes
  2. Typing and React
  3. Using PropTypes
  4. PropTypes in production
  5. Asynchronous data
  6. When should asynchronous fetching be done?
  7. What challenges does async offer?
  8. Asynchronous best practices
  9. Testing against async fetches
  10. Lists of data
  11. Iterating over a list
  12. The key property
  13. Sorting data
  14. Testing component interactions

Forms

  1. Controlled vs uncontrolled components
  2. What does React know about your form field?
  3. Does React control your form field?
  4. When does React find out about changes to your form field?
  5. Form field types
  6. Controlling a text field
  7. Other form fields
  8. Getting data out of a form
  9. Working with form data in tests

 Introduction to routing

  1. What problem is routing trying to solve?
  2. How does routing solve this problem?
  3. Tying components to URLs
  4. Passing parameters via the URL
  5. Routing software
  6. React-router
  7. Other routers
  8. Simple router example
  9. Testing routing

More complex routing

  1. Top-level routing
  2. Routing at the top of your application
  3. Allowing other parts of the application to manage routing
  4. Redirects
  5. React-router objects
  6. match
  7. history
  8. location
  9. Routing organizational techniques
  10. Testing advanced routing

Advanced React

  1. Understanding and optimizing reconciliation
  2. Best practices for React reconciliation
  3. Recognizing common issues
  4. Making improvements
  5. Refs
  6. What’s a ref?
  7. What problem does it solve?
  8. How can I use refs?
  9. The challenges of testing refs
  10. Context
  11. What is the context API?
  12. Is the context API public?
  13. How to use the context API
  14. Testing the context API
  15. Render props
  16. Rendering in depth
  17. Rendering a function instead of a prop
  18. Using the render prop pattern
  19. Testing render props
TENHO INTERESSE

Cursos Relacionados

Curso Python Programação Advanced

32 horas

Curso SAP ABAP S4hana Developer Foundation

32 horas

Curso Full Stack and React Essentials

32 Horas

Curso Node.js for JavaScript Developers

24 horas

Curso Elasticsearch for Developers

16H

Curso Elastic Stack Foundation

24 horas

Curso Apache Spark™ Foundation

8 Horas