¿Qué es Tailwind CSS?
Clase 1 de 29 • Curso de Tailwind CSS 1
Contenido del curso
- 6

Colores
04:25 - 7
Cómo crear grids o columnas en Tailwind CSS
04:41 - 8

Dimensiones y Espacios
08:57 - 9

Cambiando las propiedades de la tipografía
04:59 - 10

Ajustando el espaciado entre letras y líneas
04:37 - 11

Display
04:42 - 12

Flexbox
09:19 - 13

Crea tus propias utilerías
04:04 - 14

Entendiendo las variantes y las pseudo-clases
04:05 - 15
¡Es hora de practicar!
01:40
- 16

Creando una card
05:55 - 17

Aplicando formato a la card
09:06 - 18

Responsive design en la card
05:41 - 19

Construye el header
07:32 - 20

Crea el footer
09:46 - 21

Crea un banner
06:32 - 22

Cómo integrar una card
08:47 - 23

Forms
10:02 - 24

Directivas de Apply
02:57 - 25

Extraer componentes
08:11 - 26

Navbar
08:51 - 27

Alpine JS
03:32 - 28

Optimiza tu archivo: PurgeCSS y NanoCSS
03:56
¿Quién es Victorio Ali y qué nos enseñará?
Victorio Ali, fundador de la empresa "Viento Digital," será nuestro guía en este viaje educativo. Con una trayectoria que comenzó a los ocho años en el mundo de la programación, Victorio ha trabajado con diversas tecnologías, pero es su pasión por Tailwind CSS lo que lo trae aquí a compartir su conocimiento. Esta herramienta, que se ha puesto muy de moda últimamente, se centra en una ideología de "utility-first," prioriza el diseño para dispositivos móviles como primer objetivo y promueve un diseño responsable. Estos son conceptos cruciales que exploraremos a fondo durante el curso.
¿Cuál es la importancia de Tailwind CSS?
Elegir una tecnología adecuada para desarrollar proyectos web es fundamental, y aquí es donde Tailwind CSS entra en escena. ¿Por qué Tailwind en lugar de otras herramientas CSS populares como Bootstrap o Bulma? Una de sus diferencias más notables es la ausencia de componentes prediseñados que puedas simplemente copiar y pegar. Al contrario, Tailwind te invita a crear tus propios componentes, dándote un control total sobre el diseño de tu proyecto. Esta libertad, aunque puede parecer complicada al inicio, puede ser increíblemente poderosa y, a menudo, más sencilla de lo que parece al acostumbrarse.
¿Qué diferencia a Tailwind CSS de otros frameworks?
- Sin componentes prediseñados: Te desafía a crear tus propios elementos de diseño.
- Enfoque en la utilidad y la personalización: Los estilos se definen en función de sus utilidades, facilitando la personalización.
- Diseño responsive prioritario: Pensado desde el inicio para adaptarse a dispositivos móviles.
¿Qué vamos a construir en este curso?
Este curso no es solo teórico; abordaremos la práctica al construir "Platzi Food," un proyecto web completo que abarcará múltiples aspectos del diseño y desarrollo web. A medida que avancemos, aprenderás cómo utilizar Tailwind CSS para crear un diseño totalmente responsive y funcional.
Elementos que vamos a desarrollar:
- Menú: Implementaremos un menú fácil de navegar y adaptativo.
- Banner: Crearemos un banner atractivo que llame la atención de los usuarios.
- Productos: Diseñaremos una sección para mostrar productos que sea visualmente agradable.
- Formulario: Aprenderás a construir formularios intuitivos y de fácil uso.
- Footer: Finalizaremos con un footer informativo y funcional.
¿Qué conocimientos previos necesitas?
Antes de sumergirte de lleno en este curso, es importante que tengas una base sólida en HTML y CSS. Si aún no los dominas, Victorio sugiere completar el curso de desarrollo web online y el curso práctico de HTML y CSS disponibles en Platzi. Estos conocimientos te servirán como los cimientos sobre los que construirás tus habilidades en Tailwind CSS.
¡Prepárate para un viaje inspirador y educativo donde no solo aprenderás a utilizar Tailwind CSS, sino que también desarrollarás un proyecto web completo desde cero! Te invito a embarcarte en esta emocionante experiencia de aprendizaje con confianza y curiosidad. ¡Nos vemos en la próxima clase!