Con CSS Flexbox, puedes crear sitios web responsivos fácilmente que se adapten a diferentes tamaños de pantalla y dispositivos. Es una habilidad esencial para el desarrollo web moderno.
Publicamos un curso en el canal de YouTube de freeCodeCamp.org en español que te enseñará Flexbox desde los fundamentos. Al final del curso, podrás diseñar e implementar diseños responsivos.
Este curso fue creado por Leosbel Poll Sotomayor. Leosbel es un ingeniero de software con más de 10 años de experiencia, que comenzó a crear hace 20 años en Cuba y ahora vive en Canadá gracias a sus habilidades de programación. Creó este curso para la comunidad freeCodeCamp.
¿Listos? Veamos una descripción general de Flexbox y lo que aprenderás durante el curso.
¿Qué es CSS Flexbox?
CSS Flexbox significa CSS Flexible Box Layout. Es un modelo de diseño que te permite reorganizar elementos responsivos dentro de un contenedor en base a propiedades CSS que definen cómo los descendientes deben "moverse" para ajustarse al tamaño de su contenedor.
Con Flexbox puedes alinear, distribuir y espaciar elementos usando propiedades sencillas para evitar cálculos complejos en tu CSS.
Durante el curso, aprenderás a utilizar las siguientes propiedades:
flex-direction
justify-content
flex-wrap
align-items
align-content
flex-grow
flex-basis
flex-shrink
¡Y más! También aprenderás a combinarlos con Media Queries en CSS para crear diseños responsivos aún más poderosos.
Oportunidades profesionales
Si tu objetivo es tener una carrera en el campo del desarrollo web, Flexbox te será de gran ayuda. Estas habilidades son altamente demandadas y buscadas por empleadores a nivel mundial.
Curso de Flexbox en español
Genial. Ahora que ya sabes por qué Flexbox es tan importante, veamos los temas que aprenderás durante el curso:
- Introducción
- ¿Qué es Flexbox?
- Importancia de Flexbox
- Fundamentos de Flexbox
- Herramientas que usarás durante el curso
- Cómo configurar tu entorno de desarrollo
- Propiedades relacionadas con contenedores
- Pérdida de datos en CSS
- Propiedades relacionadas con descendientes (hijos)
- Ejemplo: Barra de navegación
- Ejemplo: Diseño clásico
- Flexbox vs. Grid
Te invitamos a tomar el curso en el canal de YouTube de freeCodeCamp.org en español:
✍️ Curso creado por Leosbel Poll Sotomayor.
- YouTube: LeoDev
- Twitter: @_LeoDev
- LinkedIn: Leosbel Poll Sotomayor