Pokud jste nikdy neslyšeli o Bootstrapu, což je rámec vyvinutý společností Twitter pro vytváření krásných webových stránek, tak vám chybí! Bootstrap umožňuje poměrně rychle a snadno navrhnout web bez větších znalostí v CSS (Cascading Style Sheets). Pokud jste na programování webu nováčci, nemusíte vědět něco o CSS, abyste se začali učit, jak Bootstrap funguje; vše, co potřebujete, je jediný dokument HTML. Podíváme se na Bootstrap, ukáže vám, o co jde, jak to funguje a jestli je to dobrá volba pro každý vytvořený web.
Vložení Bootstrap API do vašeho HTML souboru
Máte několik možností pro vložení Bootstrapu do hlavního souboru projektu. První možností je vložení všech potřebných souborů Bootstrap do projektu. To lze provést stažením balíčku a jeho odesláním do složky projektu. Samozřejmě budete muset k vašemu dokumentu připojit primární soubor CSS Bootstrap. Oficiální web Bootstrapu obsahuje podrobného průvodce, jak to udělat.
Druhou možností je přeskočení stahování balíčku a použití sítě pro doručování obsahu (CDN). CDN umožňuje propojit primární Bootstrap soubory s HTML dokumentem, aniž byste ho museli kdykoli stáhnout. To samozřejmě není vždy dobré pro profesionální webové stránky, protože bych nebyl příliš rychlý na to, abych opustil svou obchodní nebo portfoliovou stránku, abych osudoval, kdyby tento server někdy klesal. Je nejlepší mít soubory ve vašem projektu, ale za účelem učení se CDN povede dobře.
Chcete-li do svého dokumentu HTML vložit Bootstrap, stačí do kódu vložit následující kód
značka v dokumentu HTML:Jakmile jsou tyto odkazy vloženy do této značky head, měli byste být všichni připraveni začít používat třídy Bootstrap. Váš dokument by měl vypadat asi takto:
Bootstrap a třídy
Prvky Bootstrap jsou rozděleny do tříd, což je jen banda předem napsaných CSS, které můžete vložit do svého označení. Vkládání tříd do značkování je snadné, stačí znát název třídy, kterou chcete použít, a poté ji aplikovat na jeden z prvků HTML pomocí hodnoty class = ”classname”, jak je uvedeno v předchozím článku.
Obtížná část je přijít na to, jak to všechno společně vytváří něco krásného. Přímo z oficiální dokumentace si můžete vyzkoušet všechny různé třídy dostupné v Bootstrapu. Nyní je zvládnutí Bootstrapu dalším příběhem. To není něco, co bychom vás nebo kdokoli jiný mohli naučit. Výukový program můžete sledovat po výukovém programu, ale abyste se dobře naučili používat rámec, který přichází se spoustou pokusů a omylů. A to vyžaduje, abyste se s tím setkali ve svých vlastních projektech.
S ohledem na to vás žádám, abyste zahájili svůj vlastní projekt HTML na svém počítači pomocí Atomu nebo jiného textového editoru, zkontrolovali, o čem jsou třídy HTML a CSS, a pak si začnou hrát s Bootstrapem. A pokud znáte dostatek značek, možná si jako testovací cvičení můžete vytvořit vlastní webovou stránku portfolia.
Je Bootstrap schůdnou možností pro každý web?
Bootstrap je skvělý rámec, ale je to schůdná možnost pro každý vytvořený web? Skutečně záleží na vývojáři a na požadavcích projektu. V mnoha profesionálních prostředích nebudete mít opravdu na výběr, jaké technologie používáte, protože to bude do velké míry na vedoucího projektu. Pokud se projektový manažer rozhodne použít Bootstrap, budete jej kombinovat s tunou vlastních CSS. To je to, co obvykle dělá váš web jedinečným a odlišným od jiných webů používajících Bootstrap.
Já osobně nevidím Bootstrap jako skvělou možnost pro každý web. Jistě, může to pomoci a poskytnout některé zkratky, ale nakonec jsem zjistil, že navrhování od základů pomocí CSS je nejlepší cestou, hlavně kvůli kontrole, kterou nad tím máte. Ale znovu, pokud jste právě začínají v programování webu, není to špatné používat Bootstrap vůbec, ale nespoléhejte se na to pro vaši kariéru.
Stojí za zmínku, že pokud jste začínající vývojář, neměli byste používat Bootstrap pro všechny projekty ve vašem portfoliu. Může se stát, že budete zběhlý s API, ale nevíte, jak postupovat v CSS. To znamená, že je dobré mít slušnou kombinaci obou ve vašem portfoliu (nebo dokonce výhradně CSS, protože je snadné vyzvednout Bootstrap).
Uzavírání
To je vše, co Bootstrap v kostce. Jak jsem již zmínil, povzbuzuji vás, abyste zahájili svůj vlastní projekt HTML a přidali některé z různých tříd k prvkům, abyste mohli začít hrát s rámcem. Zde najdete všechny různé komponenty, které Bootstrap nabízí, s vysvětlením a příklady kódu.
Bootstrap je skutečně úhledný nástroj, ale nezapomeňte se na něj spolehnout sami! Je dobré se s tím seznámit a znát svou cestu kolem rámce, ale také se ujistěte, že se ponoříte do CSS, abyste skutečně pochopili, co se děje v zákulisí. Nejen to, ale pevné znalosti v CSS doplňují Bootstrap hodně, což vám umožní skutečně vytvořit některé jedinečné a krásné weby s vlastním přizpůsobením.
