Premium Only Content
PostCSS Crash Course
PostCSS is a Javascript tool used to transform your project's CSS. In this crash course, I'll talk you through the basics, compare PostCSS to Sass, and then we'll code together on two projects: the first project will show you what functionality PostCSS offers you as a pre-processor, so a Sass replacement. The second project will show you how you can use PostCSS to prepare your production CSS.
My website
https://www.pixelrocket.store
My Sass Crash Course
https://www.youtube.com/watch?v=BEdCOvJ5RY4
My PostCSS Playlist
https://www.youtube.com/playlist?list=PLCvPStjGyw0d9nlB4uI25m_REpYSMAKnR
Course Resources (You'll need this if you want to code along):
https://www.dropbox.com/s/2sefet1n884bea7/postcss-resources.zip?dl=0
Plugins Used:
PostCSS plugin
https://github.com/postcss/postcss
PostCSS CLI plugin
https://github.com/postcss/postcss-cli
PostCSS import
https://github.com/postcss/postcss-import
PostCSS partials
https://www.npmjs.com/package/postcss-partial-import
PostCSS @for
https://github.com/antyakushev/postcss-for
PostCSS @each
https://github.com/madyankin/postcss-each
PostCSS at rules vars
https://github.com/Scrum/postcss-at-rules-variables
PostCSS each variables mapping
https://github.com/awcross/postcss-each-variables
PostCSS nested
https://github.com/postcss/postcss-nested
PostCSS custom media queries
https://github.com/csstools/postcss-custom-media
PostCSS Gulp
https://github.com/postcss/gulp-postcss
PostCSS PurgeCSS
https://purgecss.com/plugins/postcss.html
PostCSS CSSNano
https://github.com/cssnano/cssnano
Timestamps
0:00 Intro
0:40 Course resources & requirements
1:25 What is PostCSS
2:40 Project one setup
3:45 Install PostCSS & PostCSS CLI
10:15 Setup NPM PostCSS command
15:50 Setup import & partials
30:19 Refactor component using PostCSS
38:45 Refactory utility using PostCSS
44:30 Refactor media queries using PostCSS
47:00 Project two setup
48:45 Add PostCSS to Gulp
50:07 Install PurgeCSS & CSSNano plugins
-
1:15:00
Awaken With JP
10 hours agoMerry Christmas NOT Happy Holidays! Special - LIES Ep 71
150K115 -
1:42:21
The Quartering
11 hours agoTrump To INVADE Mexico, Take Back Panama Canal Too! NYC Human Torch & Matt Gaetz Report Drops!
121K92 -
2:23:15
Nerdrotic
11 hours ago $0.77 earnedA Very Merry Christmas | FNT Square Up - Nerdrotic Nooner 453
86.9K11 -
1:14:05
Tucker Carlson
11 hours ago“I’ll Win With or Without You,” Teamsters Union President Reveals Kamala Harris’s Famous Last Words
173K338 -
1:58:31
The Dilley Show
11 hours ago $32.63 earnedTrump Conquering Western Hemisphere? w/Author Brenden Dilley 12/23/2024
143K39 -
1:09:59
Geeks + Gamers
12 hours agoSonic 3 DESTROYS Mufasa And Disney, Naughty Dog Actress SLAMS Gamers Over Intergalactic
97.2K21 -
51:59
The Dan Bongino Show
13 hours agoDemocrat Donor Admits The Scary Truth (Ep. 2393) - 12/23/2024
871K2.86K -
2:32:15
Matt Kohrs
1 day agoRumble CEO Chris Pavlovski Talks $775M Tether Partnership || The MK Show
128K31 -
28:23
Dave Portnoy
1 day agoDavey Day Trader Presented by Kraken - December 23, 2024
160K43 -
59:29
BonginoReport
15 hours agoTrump, Murder Plots, and the Christmas Miracle: Evita + Jack Posobiec (Ep.110) - 12/23/2024
165K138