React JS + Redux + ES6. Completo ¡De 0 a experto! (español)
Curso
Online
¿Necesitas un coach de formación?
Te ayudará a comparar y elegir el mejor curso para ti y a financiar tu matrícula en cómodos plazos.
Descripción
-
Tipología
Curso
-
Metodología
Online
-
Horas lectivas
26h
-
Envío de materiales de aprendizaje
Sí
-
Servicio de consultas
Sí
-
Tutor personal
Sí
-
Clases virtuales
Sí
Podrás crear aplicaciones React con Redux utilizando todas las features de ES6 y la última versión de React. Vamos a ver utilización de selectores, herramientas de debugging, la última versión de React Router, validaciones con PropTypes, plugins para el editor VSCode y mucho más. Orientado desde la base de todos los temas, para que cada uno pueda avanzar a su propio ritmo, mostrando siempre primero la práctica y luego la explicación teórica, para que no falte nada y sea mucho más interesante.
Para asegurarte que este curso es la elección correcta para tí, puedes revisar los temas de cada uno de los videos y aprovechar las lecciones en previsualización gratuita.
ACTUALIZACIÓN: Ahora también con Hooks!
¿Para quién es este curso?
Los que quieran hacer las mejores aplicaciones ReacJS
Instalaciones y fechas
Ubicación
Inicio
Inicio
A tener en cuenta
Crear aplicaciones web profesionales
Conocer a fondo React y Redux
Muchas herramientas, ténicas y trucos
Aplicar patrones de diseño y mejores prácticas
Conseguir trabajo como desarrollador ReactJS
Hooks
Los que quieran hacer las mejores aplicaciones ReacJS
Conocimientos generales de programación
HTML, CSS, Javascript
Opiniones
Logros de este Centro
Todos los cursos están actualizados
La valoración media es superior a 3,7
Más de 50 opiniones en los últimos 12 meses
Este centro lleva 9 años en Emagister.
Materias
- CSS
Temario
Antes de comenzar
Tips
Node.js, Npm y Yarn
Gestor de Paquetes NPM y Yarn
VSCode
Puntos fuertes de React JS
¡Hola Mundo! Babel, ES6, CodePen
Creación de app react
Planificación con Wireframes
Creación de functional component
VSCode Plugins y extensiones
ES6 Arrow Functions
Ejercicio: Creación de componentes e importación
Componentes WeatherExtraInfo y WeatherTemperature
Uso de parámetros / Herramientas de debugging Chrome
Parámetro con Object Destructuring
ES6: Object Destructuring
Parámetros y uso de template string
ES6: Template Strings
Instalación de libreria con npm install o yarn add
Recomendaciones sobre uso de packages externos y ubicación del index.html
Agregar Icono y uso de función en functional component
Utilización de constantes
PropTypes
Validación con PropTypes
Repaso sobre validaciones de PropTypes
Truco para refactorizar sin problemas: Uso de carpetas e Index.js
Cómo incluir CSS en React
Opciones para estilo: CSS, Preprocesadores CSS y CSSModules
CSS en React "Under the hood"
Aplicación de estilos CSS
Estilos componente WeatherTemperature
Estilos componente WeatherExtraInfo
External Font y otros detalles
Herramientas de debugging para estilo y CSSMatic
Doble Destructuring
Utilización de PropType.Shape
Cómo transformar un functional en un class Component
Evento OnClick y manejo de State
SetState (updater)
React Developer Tools para Chrome
Api Rest OpenWeatherMap
Fetch y solapa de debugging Network de Chrome
Promises
Utilización de valores retorno de Fetch
Transformación de datos
Arquitectura de datos: independencia de API
Object Literal Property Value Shorthand
Convert-Units
Services Layer
React Class Component LifeCycle
ComponentDidMount y Network Slow 3G Chrome Tool
Indicador de Carga, utilización ternario
Material Design
Material UI
Instalación y uso de MaterialUI
Utilización y configuración de ESLinter
Uso de propiedades en Class Component combinado con state
LocationList
Mapeo de estados a íconos
Agregamos parámetros a LocationList
Refactorización de LocationList
ES6: Función de collections Map
Uso de Key en listas de componentes
Estilos de comunicación de componentes: Eventos, Routing y Estado global
"Burbujeo" de eventos
Repaso de los eventos creatos y salida por consola
NOTA SOBRE ACTUALIZACIÓN
MediaQueries, Flexbox, Bootstrap
Grid System de React Flexbox / Bootstrap
React Flexbox: Autosize, Alignment, Distribution
Herramienta en Chrome para testear diseño responsivo
Uso de Grid, Row, Col y vh
MaterialUI AppBar
CSS Mejoras
Información adicional
¿Necesitas un coach de formación?
Te ayudará a comparar y elegir el mejor curso para ti y a financiar tu matrícula en cómodos plazos.
React JS + Redux + ES6. Completo ¡De 0 a experto! (español)
