ITCSS: skelet projektu

3. 10. 2020

ITCSS je metodika organizace CSS kódu projektu, aby byl kód co nejlépe udržitelný a škálovatelný.

Princip spočívá v rozdělené CSS do sedmi skupin, které mají přesně definované pořadí:

  1. Settings - veškeré nastavení a proměnné používané v projektu
  2. Tools - funkce, mixiny a nástroje
  3. Generic - obecné vlastnosti, které svým způsobem ovlivňují veškeré elementy (reset, normalizace, hvězdičkové selektory). 
  4. Elements - vlastnosti samostatných HTML elementů jako jsou odkazy, hlavičkové nadpisy apod.
  5. Objects - objekty layoutu (například definované kontejnery)
  6. Components - jednotlivé UI komponenty (komponenta je často spojená s některým objektem)
  7. Utilities - pomocné třídy, které dokáží potlačit některé vlastnosti tříd definovaných výše.

Na GitHubu jsem připravil základní skelet ITCSS rozvržení pro sestavování nových projektů: https://github.com/lukashron/itcss

Nejnovější příspěvky