Použití rámce pro konstrukci přední části vašeho webu má spoustu výhod (a je docela snadné bootovat!). Pojďme se podívat na to, co jsou front-end rámce a proč byste měli zvážit jejich začlenění do vašich webových vývojových prací.
Front-End Framework
Také nazývané "CSS frameworks", jde o balíčky obsahující předem napsaný standardizovaný kód v souborech a složkách. Poskytují vám základnu, na které můžete stavět, zatímco ještě dovolíte pružnost s konečným designem. Rámce na přední straně obvykle obsahují následující součásti:
- Mřížka, která usnadňuje uspořádání návrhových prvků vašeho webu
- Definované styly písma a velikosti, které se liší podle své funkce (různé typografie pro nadpisy versus odstavce apod.)
- Předem vytvořené komponenty webových stránek, jako jsou boční panely, tlačítka a navigační lišty
V závislosti na konkrétním rámci, který si vyberete, je toho mnohem víc.
Proč používat jeden
Existuje mnoho dobrých důvodů, proč byste měli používat přední konec rámce namísto spuštění celého kódu od nuly:
- Ušetřit čas! Je zřejmé, že pokud píšete každý řádek kódu sami, bude spouštění vašeho webu trvat déle. Rámečky vám mohou pomoci začít se základy.
- Přidejte další součásti, které byste jinak nemuseli mít. Vždy je hezké mít možnost nalepit se na jiné tlačítko nebo dva, aniž byste si vytvořili další potíže.
- Zajistěte, že kód funguje. Místo toho, abyste strávili spoustu času psaním vlastního kódu, jen abyste zjistili, že nefunguje (nebo není kompatibilní s 60% webových prohlížečů), budete vědět, že používáte předem testovaný funkční kód.
Předtím, než začnu pokračovat, chci také objasnit, jak nepoužívat rámce front-end! Zpracování těchto funkcí jako náhrada za schopnost budování kódu vám neudělá žádné výhody. Seznamte se nejdříve s HTML a CSS a potom můžete začít používat zkratky. Zachovejte si svůj rámec jako asistent, ne berle.
Příklady front-end rámců
Ne všechny rámce CSS jsou vytvořeny rovnocenné, proto se ujistěte, že váš výzkum o tom, který z nich nejlépe vyhovuje vašim jedinečným potřebám. Zde je stručný přehled prvních pět:
- Bootstrap: Nejoblíbenější je tam. Má hodně hvězd na Github a spoustu zdrojů, aby vám odpověděli na vaše otázky. Jeden z nejjednodušších je použít, ale někteří říkají, že má velmi výrazný vzhled "Bootstrap".
- Nadace: nabízí velkou flexibilitu a přizpůsobitelnost. Dobré pro ty, kteří mají zkušenosti s vývojem front-endu a chtějí zakrýt základy při zachování velké kreativní kontroly.
- Stylus: Výrazný a stylový jazyk CSS. Tento rámec lze použít pouze v aplikacích Node.js.
- Sémantický uživatelský rozhraní: Stručný, intuitivní a správné ladění kódu. Dává vám spoustu svobody designu a přizpůsobuje se vašim potřebám.
- UI Kit: rámec, který chcete použít, pokud máte zájem o vývoj aplikací pro iOS. Má základní styl, který usnadňuje vytváření vlastního vzhledu stránek.
Závěr
Rámečky jsou neuvěřitelně užitečné nástroje pro návrh front-end, zvláště pokud máte práci, kde se často vyvíjíte. Umožňují vám urychlit pracovní postup a zvýšit produktivitu, aniž byste museli obětovat kvalitu nebo funkčnost, zatímco necháte dveře otevřené pro jedinečný, přizpůsobený vzhled. Nezapomeňte je použít jako nástroj, který doplňuje vaše dovednosti, ne jako způsob, jak snížit zákoutí - a užijte si to!