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.

PostCss u stvarnom životu

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.

PostCss u stvarnom životu - predavač

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.

Ostale novosti

Vaše mišljenje nam je važno!

comments powered by Disqus