Introducción
- Introducción
- Descripción de la aplicación
- Arquitectura de la solución
- Modelo de datos
Montando nuestro ambiente
- Instalando NodeJS
- Instalar Yarn
- Instalar VS Code
- Instalando TypeScript
- Instalando firebase-tools
- Creando la aplicación en firebase
- Creando el proyecto de react y firebase
- Corrigiendo la configuración de TypeScript
- Instalando plugins
- Como cambiar la version de nodeJS
ReactJS
- JSX y su similitud con HTML5
- Los componentes en react
- Métodos private, public y protected
- Tipos e interfaces en Typescript
- Genéricos
- Las props y su interfaz
- El state y su interfaz
- Actualiza el estado, el ciclo de vida de ReactJS
Introducción a redux con JS
- Que es redux?
- Concepto de redux y que necesitamos
- Instalación y configuración
- Action types o tipos de acciones
- Action creators
- Reducers, explicación más detallada
- Conectando nuestros componentes con redux
- Despachando acciones
Redux-form con JS
- Que es redux-form?
- Instalando y configurando redux form
- Creando formularios
- Validaciones de errores y componentes custom
Manejando efectos de la forma correcta (llamados a la API entre otros)
- Que son los efectos?
- configurando redux-thunks
- Llamando a APIs usando thunks
Comienza la construcción, rutas de autenticación
- Componente de Card
- Componente Content
- Componente Input
- Componente Button
- Componente Title
- Componente Link
- Extendiendo el componente Button e inline style dinámico
- Componente center y detalles finales
- Configurando react-router y definiendo rutas
- Creando nuestra ruta de registro
La ruta de nuestro NewsFeed
- Montando ruta y refactorizando componentes
- Dandole forma al componente Post
- Fontawesome en el footer de nuestro componente Post
- Refactorizando el footer y mejorando la vista del contenedor
- Navbar, creamos nuestro componente de navegación
La ruta del perfil
- Montando la ruta y creando el contenedor
- Creando el componente de imagen de perfil y botón para agregar imágenes
- Listado de imágenes del usuario
Primeros pasos con Firebase
- Arquitectura de nuestra app para Firebase Auth
- Agregando redux y thunks
- Configurando firebase e inyectando las dependencias a los thunks
- Observaciones en cuanto a la seguridad
Autenticación con Firebase
- Formulario a redux-form
- Conectando el contenedor de login con redux
- Thunk para login y tipos para servicios
- Pasando onSubmit al formulario y cambiando los componentes de Input a Field
- Refactorizando Input: Stateless Component o Componentes Puros
- Conectando redux-form y creando un usuario en Firebase, Login exitoso!
- Escuchando cuando el usuario inicia sesión
- Mostrándole al usuario que se está autenticando
- Validando la ruta en la que cae el usuario
- Agregando tipado a history
- Registro, creando usuarios con firebase
- Firestore: nuestra primera regla
- Creando perfil de usuario y observaciones de las reglas de firestore
- Corrigiendo warning de firestore
Construyendo nuestro Newsfeed y más Firestore
- Vemos más de la consola y nos preparamos para construir nuestro newsfeed
- Creamos nuestro reducer de posts
- Agregando tipos, conectando contenedor y bindActionCreators
- Creando reglas de lectura para los recursos de posts
- Iterando los posts en nuestro NewsFeed
- Asignando la URL de la imagen
- Mostrando los posts con su imagen
- Conectando los botones de like y compartir
Firebase Functions, funciones como servicio (FaaS)
- Introducción a Functions
- Primera app con functions y express
- Introducción a middlewares
- Middleware de autenticación
- Llaves de acceso de Firebase para desarrollo en local
- Conectar app de react con el backend
