react 16, hooks, firebase, AJAX, crea una landing page!
4.8 (4 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
16 students enrolled

react 16, hooks, firebase, AJAX, crea una landing page!

Aprende React, el entorno, integra eslint, prettier, formas, funciones y hosting en firebase!
4.8 (4 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
16 students enrolled
Created by Victor Martinez
Last updated 3/2020
Spanish
Spanish [Auto]
Current price: $14.99 Original price: $24.99 Discount: 40% off
2 days left at this price!
30-Day Money-Back Guarantee
This course includes
  • 7 hours on-demand video
  • 6 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • react 16
  • hooks
  • formas en react
  • AJAX
  • react boostrap
  • funciones de firebase
  • hosting en firebase
Course content
Expand all 56 lectures 06:56:38
+ Introducción
21 lectures 02:45:57
1.2 Configuración de eslint, prettier en VSC con React
08:36
1.3 extensiones en VSC, shorcuts, personalización
08:08
2.1. React, reactDom, Componente, JSX
05:31
2.2 interacción de componentes, transferir información a través de props, JSX
09:20
2.3 repaso unidad
08:16
3.1 configuración de proyecto con create-react-app
06:24
3.2. ¿Para qué useState?
08:56
3.3 uso de useState
08:14
3.4 uso de useState con input
04:22
3.5 arrays, react, key, instalación de generador de ids
09:52
3.6. array y useState
09:25
3.7. eliminar elementos del array, forma inadecuada y forma adecuada
09:55
3.8. Refactorizar nuestro Componente
09:57
3.9. editar actividades
08:01
3.9. editar actividades II
09:53
3.10. introduccion useRef
06:52
3.11.uso de useEffect
09:34
3.11.2 uso de useEffect II
03:42
3.12. useEffect multiples, diferentes formas de ejecución
10:08
3.13. useEffect y useRef o useState, orden de ejecución de la función limpieza
08:59
+ Landing Page
6 lectures 42:33
1.2. Configuración del proyecto
03:16
1.3. Boostrap, react, header
09:30
1.4. Servicios
08:51
1.5. Servicios, imagenes responsivas
09:08
1.6. Servicios, orden y disposición
07:37
+ Formas
12 lectures 01:35:48
1.1 Formas en HTML
09:34
1.3. Formas en React 2
06:34
1.4. react-hook-form
11:04
1.5. validación y manejo de errores en las formas
08:42
1.6. adaptación implicita en el manejo de errores en la forma
08:14
1.7. validación de patterns, validar valores de otros inputs
09:38
1.8 validación de patterns, validar valores de otros inputs II
03:32
1.9 integración de react-bootstrap en la forma
05:25
1.10. creación de la forma con react-bootstrap
05:12
1.11. registro de componentes con react-hook-form
09:56
1.12 agregar mensajes de error para informar al usuario de la forma
09:00
+ Funciones de Firebase
8 lectures 52:56
1.1. instalacióno de firebase
07:13
1.2. Inicia proyecto firebase, breve explicacion de una solicitud http
07:10
1.3. Solicitud HTTP, metodo, query, body
09:24
1.4. Respuesta a diferentes metodos, manejo de errores y solicitudes
05:57
1.5. Instalacion de librearia para envio de mail, configuracion y establecimient
08:48
1.6. Habilitar cuenta para envios y enviar correo
04:48
1.7. despliegue en produccion, prueba de envio
07:34
1.8. Prueba de peticion
02:02
+ Integración formas y función de firebase
4 lectures 26:43
1.1 AJAX forma funcion
08:07
1.2. habilitar lectura de respuesta
04:06
1.3. estados de la forma I
08:49
1.4. estados de la forma II
05:41
+ Landing Page Contacto y Animación
5 lectures 32:41
1.1. Landing page, Contacto
05:37
1.2. Landing page, footer
07:55
1.3. Landing page, animacion
08:38
1.4. Landing page, nombre propio
03:06
1.5. Landing page, despliegue en produccion
07:25
Requirements
  • conocimiento básico en html, JS, y CSS
Description

React 16, con la introducción de los hooks cambia el modo en que desarrollamos en React, analizaremos desde las bases hasta desarrollar una landing page que nos va a permitir hacer validación de datos, hacer una llamada a servidor, enviar correos con firebase functions, y AJAX en nuestra landing page, esto lo estudiaremos de la siguiente manera:

1. Introducción a React, en donde estudiamos los aspectos básicos del framework

2. Landing Page, comenzamos con la integración de boostrap y react en nuestra app

3. Formas, hacemos un estudio de las formas desde un repaso de las formas en html pasando por las formas en React y las formas con una librería especializada la cual nos permite hacer la validación de los datos ingresados, mostrar los errores con un desarrollo simple y eficiente

4. Funciones en Firebase, aprenderemos desde la instalación, iniciar una función, pasando por el proceso de construcción hasta el despliegue en servidor, desde donde podemos acceder para poder hacer lógica de backend sin necesidad de desplegar un servidor

5. Integración de nuestra forma desarrollada en la unidad 3, con la función desplegada en la unidad anterior AJAX

6. Completaremos nuestra Landing page integrando la forma en el área de contacto, además en esta unidad nuestro sitio se desplegará online para estar disponible por la internet :D


Enfoque.

El curso sigue un enfoque de entendimiento practico, primero explicamos el por que de los conceptos y seguidamente implementamos ese concepto en algo concreto


Who this course is for:
  • Desarrolladores que esten interesados en el uso de frameworks front end en JS