Hasty Treat - CSS Frameworks
In this Hasty Treat, Scott and Wes talk about CSS frameworks - what they are, why they’re important, and when (and when not) to use them.
Stackbit - SponsorBuild modern JAMStack websites in minutes. Stackbit lets you combine any theme, site generator and CMS without complicated integrations. Join the beta today by visiting stackbit.com/syntaxfm.
Show Notes2:52 - What is a CSS framework?
- Pre-written CSS that takes over the basic styling of your app
- Can include just utilities or lots of styles (minimal to overboard)
- Twitter Bootstrap and Zurb Foundation were the pioneers
- Follow different CSS styles from “functional CSS” to utility-first to BEM
7:33 - Functional (aka Utility) based
- Tachyons
- Tailwind
9:59 - Preprocessor based
- Bootstrap
11:33 - Styled Components based
- Rebass
- Styled Systems
- Facepaint
15:50 - Why use one?
- Makes styling FAST
- Makes hard things easy
- Some, like Bootstrap, have themes
- Keeps your own CSS minimal and organized
- Built on an established system
- Lots of people use the same CSS
19:22 - Why not use one?
- CSS class hell
- Stops you from learning how CSS works
- Size (not all have this problem)
- Brotli, Purify CSS
- You will be overriding a ton of it
- You like exclusively writing the code you need and nothing else
- Jamstack
- Gatsby
- Hugo
- Jekyll
- Bootstrap
- Foundation
- Tailwind CSS
- Tachyons
- Styled System
- REBASS
- Facepaint
- Brotli
- Purify CSS
- Cloudflare
- Scott’s Instagram
- LevelUpTutorials Instagram
- Wes’ Instagram
- Wes’ Twitter
- Wes’ Facebook
- Scott’s Twitter
- Make sure to include @SyntaxFM in your tweets