webdesign / development + awesome
archivovaný archívny archív
Vďaka Sass napíšeš menej CSS kódu.
A bude prehľadnejší. A napíšeš ho rýchlejšie.
Prestaneš si trhať vlasy a CSS ťa začne baviť. Tak.
35 čisto nových videí.
Za 49 eur. Zdarma ak máš predplatné.
Nový Webrebel kurz kupuj tu: CSS preprocesory: Sass
pozri si pár ukážkok z kurzu, ňach máš predstavu, šak nebudeš kupovať len tak, ňe?
Už nemusíš loviť farby a hľadať, na ktorom riadku v CSS si nastavil ten font-weight. Prestaneš rozmýšlať nad prefixami. Neotvoríš Photoshop len preto, aby si našiel tmavší odtieň farby. Už nemusíš HEX farby prehadzovať na RGB len preto, aby si nastavil polo-priesvitné pozadie. Pri responzívnom dizajne Sass za teba prepočíta pixely na percentá.
Môžeš si svoj kód rozdeliť na koľko len súborov chceš a tvoj prehliadač aj tak vždy dostane len jeden, z ktorého sa automaticky odstránia nadbytočné znaky a komentáre, pre rýchle načítavanie. Môžeš si vytvárať $premenné, kam uložíš všetky často používané / meniace sa hodnoty. Môžeš si písať vlastné funkcie(), ktoré ti spravia poriadok v kóde, alebo používať kopu predvyrobených.
Sass je guča život zlepšujúcich drobností, vďaka ktorým ťa CSS začne baviť:)
A ak nie, tak ťa minimálne prestane otravovať. A to sa pri CSS počíta.
CSS PREPROCESORY
Prehliadač rozumie trom veciam - HTMLku, CSSku a JavaScriptu.
Ostatné technológie nám pomahájú vyrobiť tieto tri srandy.
Napríklad PHP nám pomáha vyrobiť HTML. Sass nám pomáha vyrobiť CSS.
Výhoda Sass je ale v tom, že sa nemusíš učiť žiadne nové, veľké koncepty. Sass len do CSS, ktoré už poznáš, pridá pár noviniek. Možnosť odložiť si hodnotu a použiť ju neskôr na viacerých miestach. Možnosť automaticky zmeniť farbu na jej tmavšiu verziu, keď prídeš myšou na link. Uložiť si zoznam farieb a nechať si automaticky vyrobiť CSS pre gombík každej farby. Toto obsasskované CSS sa potom zmení na klasický CSS kód, ktorému prehliadač rozumie.
Peprocesor je program, ktorý spracuje kód v jednom formáte (Sass) a zmení ho na kód v druhom formáte (CSS). Neboj, toto sa deje automaticky. Ty píšeš nový, moderný Sass a prehliadač dostáva obyčajné CSS. A ak chceš, automaticky spojí všetky tvoje CSS súbory do jedného a odstráni z nich nadbytočné medzery a komentáre #efektivita #bitch.
Podobne to dnes funguje s JavaScriptom. Jazyky a technológie sa postupne vyvíjajú, prichádzajú do nich novinky, ale staré prehliadačne im nerozumejú. Existujú však programy, ktoré vedia nový kód preložiť do starého, ktorému rozumie každý. Čiže ty píšeš pekný, nový, prehľadný kód a tvoj život je lepší. Ten sa potom zmení na starý, hnusný kód, ktorý funguje všade. Ale teba jeho hnusnosť nezaujíma. Lebo ty píšeš krásnotu novučičkú.
V kurze vysvetlím preprocesory, ukážem ako ich používať cez konzolu aj bez nej, ak ti nechutí. Porozprávam o Source Maps, Autoreload, Google Chrome Workspaces, potom vyrobím celú stránku, komplet v SCSS. Komplet dizajn od nuly. Takže si zopakuješ CSS a naučíš sa preň kopu nových frajerín.
CHÝBAJÚCI ČLÁNOK WEBREBEL KURZU
Prvý Webrebel je masívny kurz. Ale pôvodne mal byť masívnejší. Chcel som, aby to šl takto: HTML, CSS, Responsive, Sass, jQuery. Vtedy nebol čas a priestor, ale som rád, že som nakoniec ten chýbajúci článok doplnil, novým kurzom.
Ak máš Webrebela, odporúčam po responzívnom dizajne si odskočiť do Sass a až potom sa vrátiť k jQuery:) Mnohí študáci tam narazili na stenu a s kurzom prestali. Je to pochopiteľné, pretože v jQuery časti sa musíš naučiť nielen novú technológiu, so všetkými tými značkami a zátvorkami a sprostosťami, ale navyše pochopiť základy programovania. Vysvetlené na jazyku, ktorý nepoznáš.
Podľa mňa princípy programovania pochopíš oveľa jednoduchšie, keď ich uvidíš ukázané na CSSku, ktoré už ovládaš. Na skutočných príkladoch. V Sass nie je veľa programovania, len štipka a aj to len vtedy, keď chceš. Ale dosť na to, aby si porozumel výhodám, ktoré ti premenné, funkcie a polia ponúkajú. Keď si to vyskúšaš na CSS a zistíš, ako neskutočne ti ich použitie zjednoduší a zrýchli písanie kódu, v jQuery ti už problém robiť nebudú.
Aj keby ťa programovanie nezaujíma, choď do Sass. Pretože ti zjednoduší prácu s CSSkom. Nemusíš byť programátor, aby si ho vedel používať, vôbec sa neboj. Je to len CSS, ktoré sa naučilo pár nových vecí. Veď si pozri pár videí a uvidíš:)
IDEME NA JAVASCRIPT KURZ
Zrejme pôjde von niekoľko JavaScript kurzov. Prvý z nich bude zameraný na čistý JavaScript, žiadne frameworky. JavaScript v prehliadači, ES2016/17, Babel, Typescript, npm/yarn. Efektívny JavaScript a rýchle animácie. Kopu materiálu naň už mám pripravenú. Chcem, aby sa začal predávať tento rok.
Potom kurz o vue.js a single-page aplikáciách.
A zrejme aj samostatný kurz o základoch programovania v JavaScripte. Pretože prvý JS kurz bude predpokladať, že s programovaním už nejaké skúsenosti máš. Nemusíš byť majster, ale niečo vedieť treba. V kurzoch sa budem venovať hlavne špecifikám JavaScriptu a rozdielom oproti ostatným programovacím jazykom.
Mám nápady aj na ďalšie JS kurzy, ale týmto to začne.
Predtým však...
CSS preprocesory: Sass sa dá kúpiť tu za 49 eur.
Ak chceš nové info o všetkom, choď na facebook.com/yablko.smrdi.
Ak chceš ďalšie moje videá, choď na youtube.com/yablko.
Ak chceš všetky kurz na rok, skús predplatné.
Ak sa ti kurz páči, povedz každému:)
Archivovaný archív je bez komentárov. Radšej.
8 komentárov
komentuj ku každému komentáru sa v databáze ukladá iba meno, text a dátum, iba za účelom zobrazenia pod článkomneukladá sa email, IP adresa ani informácie o prehliadači a údaje sa nepoužívajú na reklamu, newsletter, na žiadnu ekonomickú aktivitu, nikam sa neposielajú, sú v databáze len aby sa mohli zobraziť pod článkom