Build Your Own Development Process With PostCSS
summary
Explains how a custom PostCSS package turns modular CSS, BEM naming and SMACSS architecture into a repeatable workflow using actual plugins: postcss-partial-import, postcss-custom-properties, autoprefixer, postcss-nested, postcss-calc and an SVG-fragments plugin. Describes DockYard’s six-plugin Norwin pack, rules like nesting only for pseudo classes and media queries, and naming conventions for variables. Claims the pack runs on a personal site and in client work, produces one compiled CSS file, and reduces CSS maintenance when combined with code reviews.
AI-written summary · about
chapters (17)
- 0:00Introduction
- 1:47What is a CSS process
- 2:53PostCSS as a processor
- 5:46PostCSS explained as a sandwich
- 7:30Understanding PostCSS plugins
- 9:19PostCSS packs and plugins
- 10:21Norwin pack and plugin selection
- 12:31CSS variables and naming
- 14:20Autoprefixer and browser support
- 15:23PostCSS nested and readability
- 17:10PostCSS calc and variables
- 17:51SVG fragments in CSS
- 19:18CSS guidelines and standards
- 20:43CSS order and structure
- 21:47Code quality and user experience
- 22:30Code reviews and collaboration
- 23:35Takeaways and closing
