Inicia sesión o crea una cuenta gratuita para ingresar al curso.

Proyecto Avanzado de Desarrollo Web Frontend

Aprende a realizar un proyecto web frontend con las herramientas más populares y modernas. En este curso aprenderás a usar Webpack, EcmaScript y SASS. Realizaremos una página web que funciona offline, con mapas, geolocalozación, CSS Grid y buenas prácticas de desarrollo.

4.5/5.0

8634 Estudiantes

Profesor:

Uriel Hernández

CTO

Este curso incluye:

Certificado de finalización
4h 43m
horas de contenido
Recursos descargables

Inicia sesión o crea una cuenta gratuita para ingresar al curso.

Crear Cuenta

¿Ya tienes cuenta? Inicia sesión

Este curso incluye:

Certificado de finalización
4h 43m
horas de contenido
Recursos descargables

Temario

Módulo 1 | 5 clases

Introducción y configuración

Clase 1

Introducción

Clase 2

Qué aprenderé en este curso

Clase 3

Requisitos para tomar este curso

Clase 4

Estructura del proyecto

Clase 5

Node y NPM

Módulo 2 | 5 clases

Webpack

Clase 1

Qué es Webpack

Clase 2

Configuración básica

Clase 3

HTML Webpack plugin

Clase 4

Configurar SASS y Webpack

Clase 5

Webpack DevServer y la memoria virtual

Módulo 3 | 5 clases

Layout

Clase 1

Estructura de la página

Clase 2

Contenido inicial

Clase 3

CSS Grid filas y columnas

Clase 4

Grid Areas

Clase 5

Span y subgrids

Módulo 4 | 10 clases

Estilos con SASS

Clase 1

Variables

Clase 2

Mixins

Clase 3

Selectores anidados

Clase 4

Funciones de color y otros

Clase 5

Botón animado

Clase 6

Trabajando con tipografía

Clase 7

Parallax Background

Clase 8

Extender mixins

Clase 9

Pseudo elementos y selectores de conjuntos

Clase 10

Centrar elementos con margen

Módulo 5 | 9 clases

Slider de productos

Clase 1

Layout del slider

Clase 2

Transformaciones CSS

Clase 3

Efecto separador

Clase 4

Funcionalidad del slider

Clase 5

Función de animación

Clase 6

Animaciones CSS para el slider

Clase 7

Elementos del Slider

Clase 8

Flechas del Slider

Clase 9

Precargado de imágenes

Módulo 6 | 3 clases

Google Maps

Clase 1

Insertar mapa desde JavaScript

Clase 2

Colocar marcador en el mapa

Clase 3

Pintar mapa con colores personalizados

Módulo 7 | 4 clases

Navegación

Clase 1

Layout del Menú

Clase 2

Efecto items del menú

Clase 3

Abrir y cerrar el menú

Clase 4

Animar transiciones del menú (scroll animado)

Módulo 8 | 5 clases

Service Workers (páginas sin internet)

Clase 1

Qué son las Service Workers

Clase 2

Instalar Service Workers

Clase 3

Actualizar caché de archivos

Clase 4

Enviar archivos desde el caché

Clase 5

Enviar respuesta cuando no hay internet

Módulo 9 | 4 clases

Subir a producción

Clase 1

Configurar WebPack para producción

Clase 2

Extraer estilos en un archivo css

Clase 3

Comandos para desarrollo y subida a producción

Clase 4

Subir sitio a Firebase Hosting

Módulo 10 | 2 clases

Despedida

Clase 1

Qué aprendimos en este curso

Clase 2

Qué cursos tomar luego del proyecto avanzado del curso de Desarrollo Web

Valoraciones

4.5

2824.0 Valoraciones

6 (0.2%)

16 (0.6%)

111 (3.9%)

1249 (44.2%)

1442 (51.1%)

Profesor

Uriel Hernández

CTO

Desarrollador Web con más de 7 años de experiencia. He trabajado con Ruby, JavaScript, Go en distintos proyectos en producción. Me apasiona la creación de productos y soy un fanático de la web.

Preguntas frecuentes

¿Cuándo empieza el curso?

Los cursos de Código Facilito son 100% online On-demand lo que significa que están grabados y los puedes empezar cuando quieras y a tu propio ritmo.
¿Cómo funciona la membresía premium?

Al suscribirte tendrás acceso ilimitado a todos los cursos de Código Facilito. En tu cuenta podrás agregar cursos, ver cualquier video, tener seguimiento de tus cursos y en los cursos que lo indican: presentar un examen al final y obtener un certificado digital. Además tendrás acceso exclusivo a clases premium semanales que son en vivo donde puedes hacer preguntas al instructor.

Cada mes agregamos nuevos contenidos, actualizando cursos existentes y cursos completamente nuevos.

La membresía se actualiza de manera recurrente y puedes cancelar en cualquier momento desde tu cuenta en un par de clics.
¿Qué puedo aprender en Código Facilito?

Nos especializamos en programación: desde lo básico hasta lo pro. Frontend, HTML5, CSS, JavaScript, backend con Python, Rails y mucho más. Puedes explorar nuestro catálogo completo aquí.
Tengo otra pregunta, ¿dónde los contacto?

Te atendemos con gusto en [email protected]