Якщо ви ніколи не чули про Bootstrap, структуру, розроблену Twitter для створення прекрасних веб-сайтів, ви пропускаєте! Bootstrap дозволяє досить швидко та легко створити веб-сайт без особливих знань у CSS (Cascading Style Sheets). Якщо ви новачок у програмуванні для Інтернету, вам не потрібно знати нічого про CSS, щоб почати дізнаватися, як працює Bootstrap; все, що вам потрібно, - це один HTML-документ. Ми поглянемо на Bootstrap, покажемо, про що йдеться, як це працює, і якщо це хороший варіант для кожного веб-сайту, який ви створюєте.
Вставлення API завантаження у свій файл HTML
У вас є кілька варіантів для вставки Bootstrap у ваш основний файл проекту. Перший варіант - вставити всі необхідні файли Bootstrap у ваш проект. Це можна зробити, завантаживши пакет і завантаживши його в папку проекту. Звичайно, вам доведеться зв’язати основний файл CSS Bootstrap з вашим документом. На офіційному веб-сайті Bootstrap є покрокове керівництво, як це зробити.
Інший варіант - пропустити завантаження пакета та використовувати мережу доставки вмісту (CDN). CDN дозволяє зв'язати основні файли Bootstrap з вашим HTML-документом, не завантажуючи його ніколи. Звичайно, це не завжди добре для професійних веб-сайтів, тому що я не був би надто швидким, щоб залишити свою компанію чи сторінку портфоліо долі, якби цей сервер колись зійшов. Найкраще мати файли у своєму проекті, але для того, щоб вивчити, CDN зробить просто чудово.
Щоб вставити Bootstrap у свій документ HTML, вам просто потрібно буде ввести наступний код всередині
в своєму документі HTML:Після того, як ці посилання будуть вставлені в цей головний тег, ви повинні бути готові почати використовувати класи Bootstrap. Ваш документ повинен виглядати приблизно так:
Завантаження та класи
Елементи завантаження розбиваються на класи, які є лише купою попередньо написаних CSS, які ви можете вставити у свою розмітку. Вставити класи у свою розмітку досить просто, вам просто потрібно знати назву класу, який ви хочете використовувати, а потім застосувати його до одного з ваших HTML-елементів, використовуючи значення class = "classname", як обговорювалося в попередній статті.
Важкою частиною є з'ясування того, як все це працює разом, щоб створити щось прекрасне. Ви можете ознайомитись з усіма різними класами, доступними у Bootstrap, прямо з офіційної документації. Тепер освоєння Bootstrap - це вже інша історія. Це не те, чого ми можемо навчити вас чи хтось інший. Ви можете дивитися підручник після підручника, але для того, щоб добре використати рамки, це має багато проб і помилок. І це вимагає того, щоб ви з цим працювали у власних проектах.
Зважаючи на це, я закликаю вас запустити свій власний проект HTML на своєму комп’ютері за допомогою Atom або якогось іншого текстового редактора, переглянути, про що йдеться у класах HTML та CSS, а потім почати грати з Bootstrap. А якщо ви знаєте достатню розмітку, можливо, навіть створіть свій власний веб-сайт із портфоліо як тестовий засіб.
Чи є завантажувальний пристрій доступним варіантом для кожного веб-сайту?
Bootstrap - це чудова рамка, але це життєздатний варіант для кожного створеного веб-сайту? Це справді залежить від розробника, а також вимог проекту. У багатьох професійних середовищах у вас не буде вибору, які технології ви використовуєте, оскільки це значною мірою залежить від менеджера проектів. Якщо згаданий менеджер проекту вирішить використовувати Bootstrap, ви також будете поєднувати його з тоною спеціального CSS. Це те, що зазвичай робить ваш веб-сайт унікальним та відмінним від інших веб-сайтів, що використовують Bootstrap.
Я особисто не бачу Bootstrap як чудовий варіант для кожного веб-сайту. Звичайно, це може допомогти і надати деякі ярлики, але я врешті-решт виявив, що проектування з нуля за допомогою CSS - це найкращий маршрут багато в чому завдяки контролю над ним. Але ще раз: якщо ви тільки починаєте займатися веб-програмуванням, зовсім не погано використовувати Bootstrap, але не покладайтеся на це у своїй кар’єрі.
Варто зазначити, що якщо ви початківець розробник, ви не повинні використовувати Bootstrap для всіх проектів у своєму портфоліо. Можна зіткнутися з тим, що ви, можливо, знаєте API, але не зовсім знаєте свій шлях навколо CSS. Однак, у вашому портфоліо добре мати пристойну суміш (або навіть виключно CSS, так як Bootstrap легко забрати).
Закриття
Ось і все, що Bootstrap є в двох словах. Як я вже згадував раніше, я закликаю вас розпочати власний проект HTML і додати деякі елементи різних елементів до початку грати з фреймворком. Тут ви можете знайти всі різні компоненти Bootstrap із поясненнями та прикладами коду.
Bootstrap справді є акуратним інструментом, але пам’ятайте, що не покладатися на нього поодинці! Добре бути з цим ознайомлений і знати свій шлях навколо рамки, але також обов’язково зануритися в CSS, щоб по-справжньому зрозуміти, що відбувається за кадром. Мало того, але і міцне знання CSS компліментує Bootstrap багато, що дозволяє вам по-справжньому зробити кілька унікальних і красивих веб-сайтів за допомогою власного налаштування.