Ако никога не сте чували за Bootstrap, рамка, разработена от Twitter за създаване на красиви уебсайтове, вие пропускате! Bootstrap прави доста бързо и лесно да се създаде уебсайт без много познания в CSS (Cascading Style Sheets). Ако сте нови за програмирането в мрежата, не е нужно да знаете нещо за CSS, за да започнете да научавате как работи Bootstrap; всичко, от което се нуждаете, е един единствен HTML документ. Ще разгледаме Bootstrap, ще ви покажем за какво става въпрос, как работи и дали е добър вариант за всеки уебсайт, който изграждате.
Вмъкване на API на Bootstrap във вашия HTML файл
Имате няколко опции за вмъкване на Bootstrap във вашия основен файл на проекта. Първата възможност е да поставите всички необходими Bootstrap файлове във вашия проект. Можете да направите това, като изтеглите пакета и го качите в папката на вашия проект. Разбира се, ще трябва да свържете основния CSS файл Bootstrap с вашия документ. Официалният уебсайт на Bootstrap има стъпка по стъпка ръководство за това как да направите това.
Другата възможност е да пропуснете изтеглянето на пакета и да използвате мрежа за доставка на съдържание (CDN). CDN ви позволява да свържете основните файлове Bootstrap с вашия HTML документ, без изобщо да го изтегляте. Това, разбира се, не винаги е добро нещо за професионалните уебсайтове, тъй като нямаше да бъда прекалено бърз, за да оставя бизнеса си или страницата на портфолиото си на съдбата, ако този сървър някога изпадне. Най-добре е файловете да са във вашия проект, но за целта на обучението CDN ще се справи добре.
За да вмъкнете Bootstrap във вашия HTML документ, просто трябва да поставите следния код вътре в
маркер във вашия HTML документ:След като тези връзки се поставят в този главен маркер, трябва да сте готови да започнете да използвате класове Bootstrap. Вашият документ трябва да изглежда така:
Bootstrap и класове
Елементите на Bootstrap се разбиват на класове, които са само куп предварително написани CSS, които можете да вмъкнете във вашата маркировка. Вмъкването на класове в вашата маркировка е лесно, просто трябва да знаете името на класа, който искате да използвате и след това да го приложите към един от вашите HTML елементи, използвайки стойността class = „classname“, както беше обсъдено в предишна статия.
Трудната част е да разберем как всичко това работи заедно, за да създаде нещо красиво. Можете да проверите всички различни класове на Bootstrap направо от официалната документация. Сега овладяването на Bootstrap е друга история. Това не можем да ви научим или някой друг. Можете да гледате урок след урок, но за да се възползвате добре от използването на рамката, това идва с много проби и грешки. И това изисква да се заемете с това в собствените си проекти.
Имайки това предвид, ви моля да стартирате свой собствен HTML проект на вашия компютър, използвайки Atom или някакъв друг текстов редактор, прегледайте какви са HTML и CSS класовете и след това започнете да играете с Bootstrap. И ако знаете достатъчно маркиране, може би дори създайте свой собствен уебсайт за портфолио като тестово упражнение.
Дали Bootstrap е жизнеспособна опция за всеки уебсайт?
Bootstrap е чудесна рамка, но дали е жизнеспособна опция за всеки уебсайт, който създавате? Това наистина зависи от разработчика, както и от изискванията на проекта. В много професионални среди наистина няма да имате избор какви технологии използвате, тъй като това до голяма степен зависи от Project Manager. Ако споменатият Project Manager избере да използва Bootstrap, вие ще го комбинирате и с много потребителски CSS. Това обикновено прави уебсайта Ви уникален и различен от другите уебсайтове, използващи Bootstrap.
Аз лично не виждам Bootstrap като чудесен вариант за всеки уебсайт. Разбира се, може да помогне и да предостави някои преки пътища, но в крайна сметка установих, че проектирането от основата с CSS е най-добрият маршрут до голяма степен заради контрола, който имате над него. Но още веднъж, ако току-що започвате да се занимавате с уеб програмиране, изобщо не е лошо да използвате Bootstrap, но не разчитайте на това за кариерата си.
Струва си да се отбележи, че ако сте начинаещ разработчик, не трябва да използвате Bootstrap за всички проекти във вашето портфолио. Може да се окаже, че може да сте специалисти в API, но не знаете изцяло как да заобикаляте CSS. Това каза, че е добре да имате прилична смес от двете в портфолиото си (или дори изключително CSS, тъй като е лесно да вземете Bootstrap).
Затваряне
Това е всичко, което Bootstrap е накратко. Както споменах по-рано, насърчавам ви да стартирате свой собствен HTML проект и да добавите някои от различните класове към елементи, за да започнете да играете с рамката. Тук можете да намерите всички различни компоненти, които Bootstrap предлага с обяснения и примери за код.
Bootstrap наистина е чист инструмент, но не забравяйте да не разчитате само на него! Хубаво е да сте запознати с него и да знаете пътя си около рамката, но също така не забравяйте да се потопите в CSS, за да разберете наистина какво се случва задкулисно. Не само това, но и твърди познания в CSS комплиментира Bootstrap много, което ви позволява наистина да направите уникални и красиви уебсайтове със собствена персонализация.
