CSS pretprocesors

Abstract

U modernom frontend development svijetu dolazi do potrebe za modularnim i efikasnim CSSom radi lakšeg održavanja i bržeg razvoja web aplikacija i kompleksnih sučelja. Zbog prevelikog broja jQuery pluginova i CSS polyfillova došlo je vrijeme da se zajednica pozabavi i smisli način kako da CSS učiti učinkovitijim. Na tržištu se prije par godina pojavljuju CSS preprocesori koji omogućavaju brži, jednostavniji i modularniji pristup pisanju CSS-a. Sintaksta preprocesora je ista kao i CSS, ali uz dodatne funkcionalnosti popust pisanja for petlji, funkcija, varijabli, interpolacije i sl. postaju broj 1 kada je u pitanju frontend development. Preprocesori su najbolju slavu odnjeli zbog mogućnosti jednostavnog i modularnog pisanje koda, onosno cijelo sučelje neke aplikacije može se zapisati u neograničen broj preprocesorskih datoteka koje se importaju u glavnu datoteku koja se prevodi (“kompajlira”) u CSS datoteku. Ta glavna CSS datoteka se povezuje sa HTML dokumentom te se sav sadržaj i svojstva sučelja povlače i prikazuju iz te datoteke. Na primjeru web aplikacije prikazan je proces dizajniranja i razvoja sučelja kroz određene korake, a također je i prikazano modularno kako CSS preprocesori (SASS) omogućavaju brži razvoj aplikacije te jasnije dokumentiranje projekta koje kasnije znatno olakšava posao održavanja aplikacijeModern frontend developent world needs more modular and efficient way to write CSS in order to prevent complexity of maintaining web applications and more complex layouts. In order to write better CSS, there were different approaches such as separating definitions into smaller files and importing them in to one main file. Preprocessors with their advanced features, helped to achieve writing reusable, maintainable and extensible codes in CSS. By using a pre-processor, you can easily increase your productivity, and decrease the amount of code you are writing in a project. We showed the process of designing and developing web application layout through several steps and also we concluded how preprocessors can make developers’s life easier and project overall more maintainable