Curso de Frontend Developer
Curso
Virtual
¿Necesitas un coach de formación?
Te ayudará a comparar y elegir el mejor curso para ti y a financiarlo en cómodas cuotas mensuales.
Descripción
-
Tipología
Curso
-
Nivel
Nivel iniciación
-
Metodología
Virtual
-
Duración
Flexible
-
Inicio
Fechas disponibles
-
Campus online
Sí
-
Servicio de consultas
Sí
-
Clases virtuales
Sí
Domina las bases de HTML y CSS. Define la arquitectura de tu código y construye un sitio web usando componentes estáticos. Maqueta las pantallas principales de tu página web. Agrega diseño responsivo y usa preprocesadores para optimizar tu código CSS. ¡Conviertete en Frontend Developer con Platzi!
Sedes y fechas disponibles
Ubicación
Inicio
Inicio
A tener en cuenta
Crear un menú desplegable
Crear diseños responsivos
Dominar la anatomía de un elemento HTML
Usar preprocesadores
Maquetar una página web
Construir componentes estáticos
Opiniones
Materias
- HTML
- CSS
- Accesibilidad
- Maquetación
- Arquitectura
- Anatomía
- Bienvenida
- Definición
- Presentación
- Documento
- Importantes
- Elementos
Programa académico
Introducción al curso
- Presentación y bienvenida al curso de HTML y CSS
- HTML y CSS: definición y usos
- ¿Qué son y para qué nos sirven HTML y CSS?
- DOM, CSSOM, Render Tree y el proceso de renderizado de la Web
- 5 tips para aprender CSS
- Anatomía de un Elemento HTML: Atributos, Anidamiento y Elementos vacíos
- Anatomía de un Documento HTML: DOCTYPE, html, head y body
- Funciones de las etiquetas HTML más importantes
- La importancia del código semántico
- Tipos de errores en HTML, debugging y servicio de validación de etiquetas
- Reto 1: Organiza el siguiente bloque de código de forma semántica
- Anatomía de una declaración CSS: Selectores, Propiedades y Valores
- Tipos de selectores, pseudo-clases y pseudo-elementos
- Modelo de caja
- Valores relativos y absolutos
- Displays en CSS
- Funciones de las propiedades CSS más usadas
- Posicionamiento en CSS
- ¿Qué son y para qué nos sirven las arquitecturas CSS?
- OOCSS, BEM, SMACSS, ITCSS y Atomic Design
- Reto 2: Identifica el error de arquitectura del siguiente bloque de código
- ¿Qué es un componente? Analicemos nuestros diseños
- Estructura con HTML y BEM de un menú desplegable
- Estilizando nuestro menú desplegable con CSS
- Creación de un buscador
- Creación de un carousel de imágenes con CSS: Estructura principal
- Creación de un carousel de imágenes con CSS: Detalle de cada item
- Flexbox
- Nuestro nuevo sistema de layout: CSS Grid
- Maquetación de la pantalla de login: Estructura HTML
- Maquetación de la pantalla de login: Estilización con CSS
- Estilización de inputs y footer en la pantalla de login
- Media queries
- Maquetación de la pantalla principal
- Reto 3: Maquetación de la pantalla de Not Found
- ¿Qué es un preprocesador, cuáles existen y cuáles son sus diferencias?
- Instalación de SASS y configuración incial
- Hablemos de variables, herencia, anidamiento, operadores y más
- La accesibilidad y nuestra responsabilidad como desarrolladores
- Mejorando la accesibilidad de nuestra página de inicio
- Conclusión del curso y paso siguiente
- Visualización de un botón usando storybook para HTML
- Flexbox
¿Necesitas un coach de formación?
Te ayudará a comparar y elegir el mejor curso para ti y a financiarlo en cómodas cuotas mensuales.
Curso de Frontend Developer