CSS Frameworks 🏗

Welcome to Iteration, a weekly podcast about programming, development, and design. First, some fun questions: 👍or 👎 on writing CSS? What do you love about CSS, what do you hate? To this day, what are some of the things you don't understand? JP: CSS Grid, Floats (kind of. I always forget what the clearfix thing is for) Frameworks WTF ?— Here is a set of components you can build, pre-defined styles, gives you a starting point. Pre-buit UI. Popular Ones Boostrap — Pre-defined class "Components" card shadow Tailwinds — Much more like Tachyons md:flex g-white rounded-lg p-6 Material UI Foundation Atomic CSS / Tachyons Skeleton Pros / Cons Tailwind Pro: Using tailwind for side project. Wrote 0 css Tailwind components (Basically a better looking bootstrap) Con: Output is derivative JP's argument — you could design anything you wanted It's more of a function of what the docs provide. Pro for Tailwind — Tailwind doesn't come with baked in components How do we overcome derivative sites? Could be tools But I think it's more about pushing the design side more Thinking in terms of "Bootstrap Components" Think more first principle Strong designer to push you too break the bounds of these frameworks Frameworks - Pros and Cons of Each Boostrap John: My top choice. I know it better than any other framework. I don't think it's "The best" Tailwinds Tachyons John: Worked with it a lot, had some client projects use their own fork. Really powerful but it starts just feeling like "inline styles" SO MANY Classes bg-dark-green ba bw5 dshadow2 br2 pb3 It's like ok ok calm down. Material UI Skeleton Nice for quick projects. Super lightweight. Our agency site was built in Skeleton Implementation Customizing it Tailwind Example: H1's — identifying patterns Take a set of classes and use the "apply" function Single set to define your custom classes. You throw those into a single class called "Heading" Bootstrap Starts with customizing variables These variabels are used in the Picks JP: John: "Copy css" from sketch Css in Figma Re-pick: (Same guy behind Tailwind) Referenced:

You can listen to CSS Frameworks 🏗 online on Radio and Podcast. Open the player on this page to stream the available audio.

CSS Frameworks 🏗 is an episode from iteration by iteration podcast.

This episode is 01:07:28 long.

This episode was published on Apr 20, 2020.

Yes. Use the heart button on the episode page to add it to your favorite episodes list.

Yes. This page shows related episodes from iteration when more episodes are available from the podcast feed.