NOVINKA - Online rekvalifikační kurz Python programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

Diskuze – Lekce 2 - Úvod do CSS preprocesoru Sass

Zpět

Upozorňujeme, že diskuze pod našimi online kurzy jsou nemoderované a primárně slouží k získávání zpětné vazby pro budoucí vylepšení kurzů. Pro studenty našich rekvalifikačních kurzů nabízíme možnost přímého kontaktu s lektory a studijním referentem pro osobní konzultace a podporu v rámci jejich studia. Toto je exkluzivní služba, která zajišťuje kvalitní a cílenou pomoc v případě jakýchkoli dotazů nebo projektů.

Komentáře
Avatar
Robin
Člen
Avatar
Robin:10.5.2019 11:47

Ahoj, může mi prosím někdo vysvětlit na praktickém příkladu, proč bych měl psát partials, které potom nebudu kompilovat? Není lepší požadované vlastnosti nasekat do stejného souboru místo importování? Mě to prostě nejde do hlavy :-)

Jinak díky za skvělej článek, hodně jsem se toho přiučil :-).

Odpovědět
10.5.2019 11:47
Nikdy neříkej, že něco nejde, protože se vždycky najde nějakej blbec, kterej neví, že to nejde a udělá to
Avatar
Odpovídá na Robin
Michal Šmahel:10.5.2019 15:23

Ahoj, důvod je prostý - aby ses v tom lépe orientoval. Rozvedu.

Dejme tomu, že budeš mít nějaký trochu větší stylopis, který bude mít 2000 řádků (pořád je malý, ale na můj výklad postačí). Bude sloužit například pro stylování nějakého blogu. Blog obsahuje několik základních komponent (tlačítko, nadpisy, seznamy, menu, ...), které tvoří většinu webu.

Přístup I. - vše v jednom souboru
Veškerý SCSS kód je obsažen v jednom souboru, typicky style.scss. Jelikož je soubor větší (zmiňované 2000 řádků), je obtížné se v něm vyznat. Během vývoje se to následně projevuje často tak, že nehledáš, jestli se v kódu vyskytuje podobná komponenta, ale prostě jen na konec připíšeš její styly. V lepším případě máš tento soubor rozdělen do sekcí, takže najdeš správnou sekci a vložíš nový kód do ní. Sekce se ovšem s rostoucí velikostí souboru stále hůř hledají a obtížněji se s nimi pracuje.

Nastává problém, protože se tvoří redundantní kód (vyskytují se duplicity). Potřebuješ-li poté upravit něco obecnějšího, musíš to změnit všude. Navíc soubor zbytečně nabývá na velikosti (jsou tam tytéž věci víckrát). S tím se opět vše komplikuje a často musíš dělat různé rutinní udržovací práce.

Příklad II. - využití partials
Máme stanovenou určitou adresářovou strukturu, kde každá složka obsahuje jeden typ komponent, resp. funkcionalit preprocesoru (funkce, mixiny, globální proměnné, rozložení, malé komponenty, formuláře, ...). Ve složkách jsou jednotlivé skupiny komponent (tlačítka, seznamy, menu, reklamy, stránkování, ...) odděleny do samostatných _*.scss souborů. Pokud nyní potřebuješ přidat komponentu, otevřeš si soubor, do kterého patří, podíváš se, jestli už nemáš vytvořenou nějakou obecnou, která odpovídá řešení tvého problému a případně ji můžeš využít (přidat novou modifikaci). Pokud ne, vytvoříš samozřejmě novou. Výhodou je, že máš jen několik základních komponent, z nichž poté odvozuješ další. Nevzniká tak redundantní kód. Jednotlivé dílčí soubory jsou jednoduché, přehledné a snadno rozvíjetelné. Můžeš je také jednoduše zkopírovat a využívat i v dalších projektech, aniž bys do nich zanesl hromadu nepoužitelného kódu (pro daný projekt).

Odpovědět
10.5.2019 15:23
Nejdůležitější je motivace, ovšem musí být doprovázena činy.
Avatar
Robin
Člen
Avatar
Odpovídá na Michal Šmahel
Robin:11.5.2019 22:05

Rozumim. Já jsem zatím nikdy nedělal větší projekty.
Děkuji ti za tvou odpověď :-)

Odpovědět
11.5.2019 22:05
Nikdy neříkej, že něco nejde, protože se vždycky najde nějakej blbec, kterej neví, že to nejde a udělá to
Avatar
Tony IR
Člen
Avatar
Tony IR:12.11.2019 15:01

Super kurz, bavi me.

Odpovědět
12.11.2019 15:01
Vse se da naucit ;-]
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 4 zpráv z 54.