Tailwind CSS is a utility-first framework that uses predefined classes directly in your HTML to speed up development.
Unlike component libraries such as Bootstrap, Tailwind provides low-level utility classes for creating custom design systems without specificity conflicts.
Tailwind addresses issues like verbosity and separation of concerns by providing concise utilities that live alongside your HTML.
A practical demonstration shows how to style an image and center content using Tailwind's Flexbox and sizing utilities directly in the HTML.
The tailwind.config.js file allows you to define custom theme values like brand colors, which can then be used throughout the application.
Learn how to implement a responsive grid layout by applying grid, column, and gap utility classes to a container element.
The @apply directive helps keep HTML clean by composing multiple utility classes into a single, reusable CSS class within a stylesheet.
Key questions are answered regarding combining Tailwind with other libraries, how purging keeps production bundles small, and strategies for refactoring a design system.
47:46Patricio Vargas
29:11Valentine Awe
28:56Cathrin Möller
36:22Sani Yusuf
50:28Benedikt Starzengruber
41:34Jessica Janiuk
35:49Muhammad Ahsan Ayaz
59:20Onur Gumus
.webp?w=240&auto=compress,format)
Jobs that call for the skills explored in this talk.
JO Media Software Solutions GmBh
Brunn am Gebirge, Austria
BMS Corporate Solutions GmbH
Düsseldorf, Germany
Speech Processing Solutions
Vienna, Austria
autoiXpert GmbH & Co. KG
Stuttgart, Germany
doinstruct Software GmbH
Berlin, Germany
tarent solutions GmbH
tarent solutions GmbH
tarent solutions GmbH