Autoplay
Autocompletar
Lección previa
Completar y continuar
Crea Sistemas Marketplace con Angular y Firebase Database
Introducción
Bienvenida (2:28)
Material de apoyo e inquietudes (14:38)
Contáctame
Editor de código (19:40)
Plugins y extensiones Sublime Text 3
Estructura de un Marketplace
¿Qué es un marketplace? *[ZIP para descargar] (5:57)
Arquitectura de un Proyecto marketplace (15:07)
La página de inicio (14:44)
La página de categorías / Subcategorías (3:59)
La página de productos (9:38)
El Carrito de Compras (2:36)
Página de pagos (5:27)
La página de Registro / Ingreso (2:32)
La Lista de Deseos o Favoritos (4:37)
Las compras de los usuarios (6:44)
Convertirse en vendedor (4:12)
La Tienda del Vendedor (11:44)
Las ventas del vendedor (2:18)
Otras páginas importantes del Marketplace (7:36)
El alcance de este curso (3:18)
Estructura de la Base de Datos del Marketplace
Arquitectura de la Base de Datos *[ZIP para descargar] (18:53)
Las Categorías (11:00)
Las Sub-Categorías (2:30)
Los Productos (17:05)
Los Usuarios y Tiendas (o Vendedores) (2:10)
Las Órdenes de compra, disputas y ventas (9:15)
Bases de Datos en Firebase
¿Qué es Firebase? (11:28)
Convirtiendo archivos Excel a Formato JSON (12:48)
Importando datos JSON a Realtime DataBase (12:28)
APIRESTful en Firebase
¿Qué es una API REST? *[ZIP para descargar] (14:26)
Formato JSON (8:39)
POSTMAN (10:02)
Servicios HTTP: GET, POST, PUT, PATCH, DELETE (9:56)
Token de Autorización (7:26)
Reglas para protección de datos (12:40)
Filtros (11:29)
Buscador (8:53)
Límites (6:14)
Validaciones (11:25)
Tarea: Agregar un Producto por cada Sub-Categoría existente (10:00)
Exportar la base de datos en Firebase (8:51)
Repaso en ECMAScript
¿Qué es ECMAScript? *[ZIP para descargar] (2:43)
Nuevas declaraciones de Variables: VAR, LET, CONST (14:26)
Asignación por Destructuring (5:40)
IF Ternario (5:15)
Template Literales (Diferente forma de Concatenar) (4:20)
Funciones de tipo flecha (6:50)
Bucle ForEach (10:21)
Función .map() (8:17)
Funciones .filter() y .find() (8:14)
Callbacks (10:46)
Promises (14:30)
Async y Await (9:36)
Datos JSON (10:01)
Función .fetch() para servicios HTTP (12:15)
Repaso en TYPESCRIPT
¿Qué es Typescript? *[ZIP para descargar] (5:14)
Instalación de NodeJS (11:08)
Instalación de Typescript (7:49)
Clases, Propiedades y Constructor (14:10)
Métodos y Objetos (9:34)
Iniciando el proyecto Marketplace en Angular
Angular *[ZIP para descargar] (8:53)
¿Qué empresas usan Angular? (3:12)
Crear el proyecto en Angular (8:16)
Carpeta Assets (11:21)
Archivo Main.js en App Component (9:47)
Separar módulos fijos de la plantilla (13:40)
Crear configuraciones globales (16:32)
Datos dinámicos para el TOP BANNER (15:28)
Elegir un Banner aleatoriamente (17:49)
Preload para los componentes (6:32)
Errores de Iniciación (5:15)
Datos dinámicos para el menú de Categorías (12:25)
Datos dinámicos para la Lista de Títulos (9:41)
Datos dinámicos para el Menú de Sub-Categorías (21:05)
Sub-Categorías en la Vista según su clasificación (11:00)
Datos dinámicos de Categorías para el menú Móvil (15:06)
Datos dinámicos de Sub-Categorías para el menú Móvil (18:05)
Datos dinámicos para el Menú Auxiliar del Footer (11:34)
Página de Inicio (Home)
Nueva Sección - Nuevo Proyecto (Home) *[ZIP para descargar] (10:09)
Organizar la distribución de imágenes del proyecto (12:48)
Aplicar rutas para el Marketplace (13:46)
Home - Banner Horizontal (8:22)
Home - Banner Horizontal Dinámico (17:17)
Home - Banner Horizontal en Vista HTML (14:48)
Ejecutando plugins en segundo plano de Angular (16:49)
Visualización corregida en Móvil para Banner Horizontal (4:33)
Características del Marketplace (1:39)
Banner de promociones (11:36)
Ofertas calientes del día (20:56)
Galería de las ofertas calientes - Parte 1 (14:46)
Galería de las ofertas calientes - Parte 2 (21:40)
Precios dinámicos para las ofertas calientes (18:35)
Reseñas para productos de ofertas calientes (23:15)
Stock de productos de ofertas calientes (5:35)
Top 20 de los productos más vendidos - parte 1 (21:23)
Top 20 de los productos más vendidos - parte 2 (18:13)
Top 20 de los productos más vendidos - parte 3 (17:13)
TOP 6 de categorías más visitadas (13:31)
Problemática de ejecución de plugins en Angular (20:02)
Vitrina de productos de la página de Inicio (6:06)
Vitrina de productos - Categorías (5:12)
Vitrina de productos - Sub-Categorías (16:40)
Vitrina de productos - 6 productos por categoría (15:23)
Vitrina de productos - Detalles de los productos (19:45)
Vitrina de productos - Deslizador vertical (24:52)
Páginas de Productos (Categorías, Sub-Categorías, Buscador, Info-Producto)
Nueva Sección - Nuevo Proyecto (Products) *[ZIP para descargar] (8:12)
Actualizar Data de Productos (21:01)
Página de Productos - Breadcrumb (18:50)
Página de Productos - Productos más vendidos (21:01)
Página de Productos - Detalles de productos más vendidos (23:17)
Página de Productos - Productos recomendados (16:28)
Página de Productos - Vitrina (17:33)
Página de Productos - Detalles de los productos en vitrina (9:12)
Página de Productos - Paginación de productos en vitrina parte 1 (11:39)
Página de Productos - Paginación de productos en vitrina parte 2 (22:24)
Página de Productos - Ordenar productos en vitrina parte 1 (16:54)
Página de Productos - Ordenar productos en vitrina parte 2 (9:36)
Página de Productos - Actualizar vistas en la Data de Categorías y Sub-Categoría (18:17)
Página del Buscador (10:33)
Función global para el buscador (10:42)
Página del Buscador - Breadcrumb (6:35)
Página del Buscador - Vitrina de productos (21:07)
Ajustes en la URL de los Productos (10:31)
Página de Info-Producto (6:46)
Página de Info-Producto - Llamada a la acción (15:18)
Página de Info-Producto - Breadcrumb (2:49)
Página de Info-Producto - Columnas (11:56)
Página de Info-Producto - Información y descripción (19:05)
Página de Info-Producto - Ejecutando Plugins en 3er Plano (19:01)
Página de Info-Producto - Tabulador (4:37)
Página de Info-Producto - Galería (10:05)
Página de Info-Producto - Vídeo (7:21)
Pipe para la validación de Url's seguras (7:02)
Página de Info-Producto - Controlador de cantidades (10:25)
Página de Info-Producto - Etiquetas o palabras claves (5:00)
Página de Info-Producto - Compras en conjunto (24:44)
Página de Info-Producto - La tienda del vendedor (17:00)
Página de Info-Producto - Las reseñas (22:06)
Página de Info-Producto - Bloque de estrellas (19:59)
Página de Info-Producto - Bloque de reseñas (15:48)
Página de Info-Producto - Columna derecha (13:20)
Página de Info-Producto - Compras similares (7:59)
Página de Info-Producto - Productos relacionados (5:19)
Página de Info-Producto - Actualizar vistas en la Data de Productos (17:37)
Corrección filtrado de fechas vencidas en las ofertas (7:07)
Revisión del sistema en pantallas de dispositivos (9:16)
Cuentas de Usuarios
Sección Cuentas de Usuarios - ¿Qué aprenderemos en esta sección? *[ZIP para descargar] (4:23)
Almacenamiento y creación de ficheros en Angular (18:38)
Nueva Sección - Nuevo Proyecto en Módulo Apache (5:38)
Tipado estático en Typescript (En pro de buenas prácticas de programación) (8:51)
Componente Login (4:53)
Componente Registro (7:22)
Registro de Usuarios en Firebase Authentication - Parte 1 (18:23)
Registro de Usuarios en Firebase Authentication - Parte 2 (15:21)
Registro de Usuarios en Firebase Database (16:23)
Validación pública de formulario de registro (13:50)
Validación privada de formulario de registro (18:20)
Capitalizar nombre y apellido (8:58)
Evitar repetir registro de email y de usuario (11:25)
Sweet Alert 2 (20:40)
Login de Usuarios (13:02)
Enviar verificación por correo electrónico (18:05)
Confirmar correo electrónico (18:37)
Captura de ID Token y Fecha de Expiración (14:20)
Crear Servicio para validar autenticación (18:15)
Proteger página "Account" con GUARD (10:55)
Validar Fecha de Expiración (5:38)
Activar "Remember me" en Formulario Login (7:14)
Recordar Contraseña (14:22)
Confirmar cambio de Contraseña (15:00)
SDK de Firebase para Autenticación de proveedores (13:56)
Registro de Usuario con Facebook (13:27)
Certificado SSL en Angular (https) (13:10)
Registrar usuario de Facebook en Firebase Database (13:17)
Corrección del modelo usuarios para el registro de Facebook (8:24)
Registro de Usuario en Google (6:30)
Login con Facebook (12:33)
Login con Google (5:20)
Validar Autenticación en Componentes tipo Módulos (24:16)
Validar Autenticación en Componente Header-Mobile (9:39)
Página de Cuentas - Breadcrumb (7:12)
Página de Cuentas - Perfil de Usuario (14:01)
Pagina de Cuentas - Cambiar contraseña (15:43)
Página de Cuentas - Cambiar fotografía (17:01)
Gestor de archivos y carpetas con módulo Apache - Parte 1 (16:14)
Gestor de archivos y carpetas con módulo Apache - Parte 2 (24:01)
Corrección para guardar "username" en Minúscula (2:02)
Página de Cuentas - Lista de deseos (15:36)
Página de Cuentas - Lista de deseos con datos dinámicos (19:14)
jQuery DataTable en Angular (18:31)
Diferentes escenarios para la Lista de deseos (5:06)
Adicionar productos a la Listas de deseos (19:34)
Ajuste en Componente Wishlist (4:35)
Agregar función wishlist() al resto de Componentes (14:11)
Eliminar un producto de la Lista de deseos (14:24)
Eliminar un producto de la Lista de deseos en dispositivos pequeños (12:36)
Confirmación antes de borrar un producto de la Lista de deseos (11:55)
Confirmación en dispositivos antes de borrar un producto de la Lista de deseos (12:19)
Visualizar en la cabecera el total de productos en la Lista de deseos (7:32)
Pasarelas de Pago
Sección Pasarelas de Pago - ¿Qué aprenderemos en esta sección? *[ZIP para descargar] (8:22)
Nueva Sección - Nuevo Proyecto para Pasarelas de Pagos (14:54)
Algunos ajustes y correcciones en el Marketplace (13:06)
Ajustes en módulo de Compras Frecuentes (14:56)
Crear Servicio para agregar productos al Carrito de Compras (14:42)
Crear variable en LocalStorage para el listado del Carrito de Compras (9:04)
Incrementar cantidad de producto en la lista del LocalStorage (10:02)
Visualizar listado del Carrito de Compras en la cabecera del Marketplace (21:30)
Sumar el total de los precios del Carrito de Compras (17:12)
Eliminar un producto de la lista del Carrito de Compras (10:36)
Agregar Función de Carrito de Compras al resto de Componentes (16:00)
Agregar productos al Carrito de Compras desde Compras Frecuentes (4:20)
Módulo del Carrito de Compras para pantallas de dispositivos (11:20)
Agregar detalles al producto (16:26)
Traer detalles del producto desde la base de datos (19:26)
Señalar el detalle elegido y guardarlo en el Local Storage (17:14)
Agregar los detalles a la lista del Carrito de Compras (12:13)
Agregar detalles iniciales por defecto (12:07)
Agregar cantidad al Carrito de Compras desde el Info Producto (11:54)
Ajuste en cantidad cuando se elige el mismo producto con diferente detalle (10:07)
Ajuste al módulo de Carrito de Compras para dispositivos pequeños (3:43)
Página Sohpping-Cart (18:03)
Agregar los productos de la lista de deseos al Carrito de Compras (6:40)
Corrección de Scroll para la lista del Carrito de Compras (9:34)
Cambiar la cantidad en la lista de Carrito de Compras (20:46)
Definir el subtotal y total de los precios (21:40)
Eliminar productos de la lista del Carrito de Compras (13:02)
Ajuste en la tabla del Carrito de Compras en dispositivos pequeños (7:47)
Página Checkout (13:45)
Formulario de compra para la página Checkout (16:21)
Guardar información de envío del usuario en la base de datos (13:09)
Listado de países dinámico (12:35)
Actualizar el prefijo telefónico en la base de datos (5:41)
Traer la información del Carrito de Compras para el Checkout (17:51)
Validación global formulario Checkout (11:46)
Pasarela de pago de Paypal (17:52)
Respuesta luego del pago con Paypal (12:54)
Actualizar la cantidad de productos vendidos en la base de datos (11:20)
Crear la Orden de venta en la base de datos (14:34)
Configurando el proceso de entrega del producto (20:29)
Crear la Venta en la base de datos (15:49)
Las comisiones para el Marketplace (14:56)
Creación de Cookies en Angular (12:45)
Pasarelas de pago Payu (12:54)
Configurar el Web Checkout de Payu (18:12)
Generar firma de Payu con Algoritmo MD5 (20:07)
Respuesta luego del pago con Payu (20:14)
Pasarelas de Mercado Pago (17:11)
Configurar el Web Tokenize Checkout de Mercado Pago - Parte 1 (11:38)
Configurar el Web Tokenize Checkout de Mercado Pago - Parte 2 (11:19)
Convertidor de moneda (12:27)
Respuesta luego del pago con Mercado Pago (17:45)
Subir respuesta de Mercado Pago a la base de datos (18:48)
Corrección Id Payment (1:10)
Compra inmediata (3:43)
Página - My Shopping (13:29)
Agregamos jQuery DataTable a "My Shopping" (15:51)
Agregamos datos dinámicos a la tabla (8:38)
Visualizando correctamente el proceso de entrega del producto (15:39)
Área de Multi-Vendedores: Gestión de Tiendas y Productos
Sección Multi-Vendedores: ¿Qué aprenderemos en esta sección? *[ZIP para descargar] (11:18)
Nueva Sección - Nuevo Proyecto en Angular 10 para Multivendedores (19:59)
Ajustes al Marketplace: Ampliar fechas de ofertas para Hot-Today-Sales (4:41)
Ajustes al Marketplace: Quitar los molestos Warning de Angular 10 (5:04)
Ajustes al Marketplace: Corregir galería en "Hot-Today-Sales" (13:09)
Ajustes al Marketplace: Corregir error de plugin "Lightbox" (4:01)
Ajustes al Marketplace: Disminuir el Stock del producto luego de una compra (8:10)
Ajustes al Marketplace: Agregar vínculo de Login en Header-Mobile (2:06)
Ajustes al Marketplace: Utilizar Router Link en página de Productos y Buscador (8:52)
Ajustes al Marketplace: Error con Índices de Categorías (12:23)
Ajustes al Marketplace: Bought-Together (4:49)
Ajustes al Marketplace: Cambio de imagen solo para usuario directo (6:32)
Página "Become a Vendor" (9:59)
Página "New Store" (20:43)
Página "My Store" (18:58)
Módulo Términos y Condiciones (14:57)
Estructura del formulario para creación de Tienda y Producto (20:50)
Validar la creación de la Tienda para habilitar la creación del Producto (14:15)
Modelo para crear la Tienda (14:21)
Validar el nombre de la Tienda (13:47)
Convertir en URL Amigable el nombre de la Tienda (4:35)
Validar la información de la Tienda y crear el "Abstract" (5:58)
Seleccionar país y modificar el código telefónico (10:05)
Validar Ciudad, Teléfono y Dirección de la Tienda (12:06)
Validar imagen del Logo y Portada de la Tienda - Parte 1 (16:00)
Validar imagen del Logo y Portada de la Tienda - Parte 2 (6:13)
Validar las Redes Sociales de la Tienda (18:09)
Crear el Modelo para la colección de Productos (7:22)
Crear el Nombre y la Url Amigable del Producto (9:55)
Seleccionar Categoría y Subcategoría para el Producto (17:58)
Crear la Descripción del Producto (18:44)
Crear el Resumen del Producto (17:05)
Agregar y quitar INPUT's de forma dinámica en Angular (7:07)
Crear los Detalles del Producto (19:52)
Crear las Especificaciones del Producto (14:49)
Agregar las Palabras Claves al Producto (9:18)
Agregar Imagen del Producto (5:40)
Agregar Galería del Producto (11:03)
Agregar Banner Superior al Producto (21:09)
Agregar Banner por defecto al Producto (3:47)
Agregar Slide horizontal al Producto (10:55)
Agregar Slide Vertical al Producto (3:29)
Agregar Vídeo al Producto (7:16)
Agregar Precio de Venta, Stock, Precio y Días de envío (17:26)
Agregar Ofertas al Producto (13:39)
Validar formulario de creación de Tienda y producto (12:23)
Crear Imágenes en el Servidor - Parte 1 (19:26)
Crear Imágenes en el Servidor - Parte 2 (15:26)
Crear Galería en el Servidor (18:26)
Consolidar la información para subir a Base de Datos - Parte 1 (12:12)
Consolidar la información para subir a Base de Datos - Parte 2 (23:41)
Crear la Tienda y el Producto en la Base de Datos (15:59)
Depurando errores para crear la Tienda y el Producto en la Base de Datos (14:37)
Ajustando la vista del Info-Producto de acuerdo a los datos guardados (11:00)
Pausar el "Hot Reload" de Angular para pruebas Backend (20:42)
NgZone y otros ajustes (11:41)
Filtrar productos aprobados en el Marketplace (11:09)
Traer los datos de la Tienda y Productos para la página "My-Store" (21:53)
Insertar la información de la Tienda (13:58)
Insertar la información de los Productos en DataTable - Parte 1 (17:31)
Insertar la información de los Productos en DataTable - Parte 2 (19:47)
Insertar todo el listado de Productos de la Base de Datos en DataTable (11:42)
Generar la calificación global de la Tienda (22:15)
Editar la Información de la Tienda (17:59)
Incorporar los datos de la Tienda en el formulario de edición (16:46)
Validar el Formulario de edición de la Tienda (14:44)
Enviar información actualizada de la Tienda a la Base de Datos (15:27)
Eliminar imágenes residuales (13:09)
Crear un nuevo Producto desde "My-Store" - Parte 1 (14:55)
Crear un nuevo Producto desde "My-Store" - Parte 2 (14:43)
Validar, consolidar y guardar nuevo Producto (20:55)
Editar un Producto existente - Parte 1 (21:00)
Editar un Producto existente - Parte 2 (16:11)
Validar y consolidar información para actualizar Producto (20:33)
Validar y consolidar la Galería en el proceso de Edición (20:28)
Eliminar un Producto de la Tienda (13:47)
Área de Multi-Vendedores: Gestión de órdenes, disputas, mensajes y ventas
Sección Multi-Vendedores parte 2 ¿Qué aprenderemos en esta sección? *[ZIP para descargar] (6:49)
Nueva Sección - Nuevo Proyecto en módulo Apache (Multivendedores parte 2) (19:47)
Precarga en Esqueleto (Placeholder Loading) (19:08)
Reportando nuevas ventas (17:40)
Páginas internas: Ventas, órdenes, disputas y mensajes (13:08)
Administrar órdenes (18:21)
Aplicar jQuery Datatable a la tabla de órdenes (18:33)
Editar el proceso de entrega - Parte 1 (21:11)
Editar el proceso de entrega - Parte 2 (19:17)
Guardar en base de datos los cambios del proceso de entrega (9:12)
Notificar por correo electrónico el proceso de entrega (21:25)
Actualizar el estado de la venta al entregar el producto (10:54)
Comenzar una disputa (16:15)
Guardar la disputa en la base de datos (7:52)
Responder una disputa - Parte 1 (13:59)
Responder una disputa - Parte 2 (12:59)
Visualizar las disputas (21:57)
Adicionar la reseña del producto (19:24)
Actualizar la reseña en la base de datos (16:42)
Agregando imagen de usuario a la reseña (5:23)
Enviar preguntas del producto (15:38)
Notificar por correo electrónico las preguntas del producto (6:00)
Mostrar preguntas del producto (12:54)
Mostrar los mensajes en la página de la tienda (15:22)
Página "My Sales" (15:07)
Integrando ChartJS en Angular (13:22)
Tabla de ventas (17:03)
Total de ventas (Ganancias vs Comisiones) (15:42)
Gráfico de ventas dinámico (22:22)
Filtrar ventas por fechas (19:48)
Marketplace modo producción
¿Qué aprenderemos en esta sección? *[ZIP para descargar] (6:00)
Nueva Sección - Nuevo Proyecto (Marketplace producción) (3:37)
Página 404 (3:20)
Página listado de tiendas (8:58)
Listado de tiendas dinámico (15:24)
Habilitar el buscador de tiendas (11:46)
Ordenar tiendas (17:37)
Paginación de tiendas (9:54)
Más precargas en esqueleto (5:45)
Ajuste en Módulo "Home-Hot-Today" (6:09)
Ajuste en Módulo "Top-20-Bestseller" (3:19)
Ajuste en formulario "Login" (4:58)
Ajuste en recuperar contraseña (5:42)
Ajuste en carrito de compras (10:46)
Ajuste en precio total "Carrito de compras" (7:31)
Ajuste en aumento de vistas de categorías, subcategorías y productos (7:23)
Ordenar mis compras (13:33)
Compilar proyecto Angular Modo Producción (6:06)
Creando un dominio virtual para pruebas de servidor local (23:56)
Configurando archivo .htaccess para dar permisos de rutas (4:30)
Probando PayPal en Modo Producción (7:51)
Ajuste en listado de tiendas (6:44)
Probando MercadoPago en Modo Producción (19:00)
Probando Payu Producción - parte 1 (14:25)
Probando Payu Producción - parte 2 (18:21)
Probando Página de confirmación Payu (24:31)
Ajuste en el proceso de pago con Payu (6:14)
Probando crear una tienda y producto en Modo producción (8:34)
Sitio Multi-Idioma (21:13)
Compartir productos en Redes Sociales (17:44)
Metadatos y Seo en Angular - Parte 1 (19:39)
Metadatos y Seo en Angular - Parte 2 (16:50)
Subir el Marketplace a un Hosting (15:56)
Probando registro de usuario con Facebook desde el Hosting (11:15)
Probando Pasarela de pagos de Payu (5:57)
Pasarelas de pago modo Live (8:00)
BONUS: Marketplace en Angular 11
Instalación del Marketplace en Angular 11 (21:43)
BONUS: Marketplace en Angular 12
Instalación del Marketplace en Angular 12 (19:11)
Ajustes al Marketplace: Quitar los molestos Warning de Angular 10
Contenido bloqueado
Si ya estás inscrito,
deberás iniciar sesión
.
Inscríbase en el curso para desbloquear