Ožujak nam je donio još jedan meetup s vrućom front end temom - PostCSS. Pokušalo se odgovoriti na pitanja poput: “Trebamo li još jedan CSS procesor?", “Što nam donosi PostCSS?" i najbitnije “Kako primjeniti alat u novim projektima?".

Predavanje je krenulo s uvodom u filozofiju PostCSS-a i kratki uvod o istome. Ono što ga izdvaja jest to što su stare funkcionalnosti postojećih CSS preprocesora okrenute na potpuno nov način - jednostavniji, lakši i brži. Izbačeni su C/C++ i Ruby, a ubačen je Javascript i tu je sve postalo puno zanimljivije.

Bilo koja aplikacija koja može biti napisana u JavaScriptu, eventualno će i biti napisana. - Jeff Atwood

Za razliku od postojećih monolitnih arhitektura i velikih build setupa Sassa, Lessa i ostalih preprocesora, PostCSS nam pruža modularnost, dodavanje vlastitih featurea i odličan ekosistem plugina. Dok s druge strane sloboda prekomjernog dodavanja plugina može dovesti do kompliciranih setupa.

Brz, brži najbrži

Jedna od bitnijih stvari pisanja CSS-a kroz preprocesore jest vrijeme compilea. Ovdje se pokazalo da PostCSS prednjači brzinom ispred ostalih. Detaljni rezultati mjerenja mogu se pronaći na preprocessors benchmark.

Um caruje, snaga klade valja

Ako je PostCSS mozak, plugini su mišići. To su mali chunkovi koda koji su dovoljni da se napiše plugin. Primjera radi post-css-simple-vars nam omogućava korištenje varijabli unutar CSS-a i on sadrži samo 122 linije koda! Plugini su jednostavni za održavanje i lagani za kodiranje.

Djela čine riječi nepotrebnima

Dobro, moralo se ispričati ponešto da bi se mogao odraditi praktični dio :). U ovom dijelu predavanja se prikazala osnovna struktura projekta. Pričalo se o gulp filovima, package.jsonima, npm-ovima i ostalim datotekama potrebnim za kreiranje build procesa u gulpu. Za predavanje se koristio gulp task runner, ali PostCSS je također dostupan za Grunt, Broccoli, Webpack i ostale runnere.

Prošlo se kroz proces instalacije plugina i njihvovg pozivanja u gulp proces. Postavljanje gulpa zaokruženo je s pisanjem jednostavnog gulp.taska da bi se pratile izmjene na CSS-u i procesirale u finalni CSS.

Predavanje je privedeno kraju kroz primjere pisanja CSS-a s ranije postavljenim PostCSS setupom. Rasprava se nastavila i nakon predavanja. Zaključak bi se mogao izvući iz činjenice da nam svi alati koji dolaze pripremaju put prema pisanju čistog CSS-a i browsere koji će podržavati buduću CSS sintaksu.