Курс BOOTSTRAP

CSS фреймворк Bootstrap - это популярный инструмент для создания сайтов. С помощью него вы очень быстро будете верстать сайты благодаря продуманной архитектуре и готовым компонентам.

4.9 / 461
Начать обучение Регистрация

О курсе

Bootstrap - это css-фреймворк с готовыми css-классами и html/jquery компонентами, с помощью которых, вы очень быстро сможете создать интерфейс веб-сайта, способный адаптироваться под мобильных устройства.

С помощью Bootstrap, верстка сайтов становиться похожа на сборку конструктора из деталей. Вы сможете за несколько минут встроить верстку на ваш сайт следующих популярных компонентов: Адаптивное горизонтальное меню, красивые кнопки, html-формы с дополнительными элементами, прогресс бар, каталог товаров и многое другое!


Начать обучение

План курса

Программа обучения состоит из видео уроков по фреймворку Bootstap, а также включает интерактивные тесты и задания, позволяющие закрепить полученные вами знания по Bootstrap программированию и созданию сайтов.


Free Level
В этом уроке мы познакомимся с фреймворком Bootstrap, установим его и создадим структуру каталогов для нашего будущего проекта
00:11:20
Free Level
В этом уроке вы научитесь работать с классами фреймворка Bootstrap, такими как .container и .container-fluid
00:05:44
Free Level
Пройдите тестирование
00:00:15
Free Level
Интерактивное упражнение
00:02:00
Free Level
В этом уроке вы узнаете для чего нужен класс row
00:01:12
Free Level
Пройдите тестирование
00:00:15
Free Level
Интерактивное упражнение
00:02:00
Free Level
В этом уроке мы рассмотрим классы для работы с позиционированием блоков в фреймворке Bootstrap
00:06:41
Free Level
Интерактивное упражнение
00:02:00
Free Level
Пройдите тестирование
00:00:15
Free Level
В этом уроке вы узнаете про еще несколько полезных классов фреймворка Bootstrap: hidden-*, show-*, push, pull
00:06:16
Free Level
Пройдите тестирование
00:00:15
Free Level
Интерактивное упражнение
00:02:00
Free Level
Интерактивное упражнение
00:03:00
Free Level
Начнем создавать верстку сайта Киномонстр. Изучим новые классы Bootstrap для создания меню сайта
00:07:58
Free Level
Интерактивное упражнение
00:02:00
Premium Level
17. Navbar. Продолжение
В этом уроке изучим еще несколько классов Bootstrap для работы с навигацией сайта
00:04:57
Premium Level
18. Navbar toggle
Интерактивное упражнение
00:03:00
Premium Level
19. Navbar. Логотип и слоган
В этом уроке мы продолжим создавать верхний блок сайта и сверстаем логотип и слоган
00:07:40
Premium Level
20. Тест
Пройдите тестирование
00:00:20
Premium Level
21. Navbar. Стили для пунктов меню
В этом уроке мы продолжим работать над верхним блоком сайта и напишем CSS-стили для меню
00:07:12
Premium Level
22. Header. Логотип и слоган
Интерактивное упражнение
00:00:30
Premium Level
23. Navbar. Продолжение
В этом уроке мы улучшим внешний вид меню для мобильных устройств
00:03:09
Premium Level
24. Тест
Пройдите тестирование
00:00:15
Premium Level
25. Navbar. Улучшим внешний вид для мобильного устройства
Интерактивное упражнение
00:02:00
Premium Level
26. Header. Заключительная часть
В этом уроке мы закончим создавать header
00:09:16
Premium Level
27. Header. Заключительная часть
Интерактивное упражнение
00:05:00
Premium Level
28. Структура шаблона страниц
В этом уроке мы создадим Footer (нижнюю часть сайта) и структуру для всех страниц
00:11:45
Premium Level
29. Структура шаблона страниц
Интерактивное упражнение
00:02:00
Premium Level
30. Тест
Пройдите тестирование
00:00:10
Premium Level
31. Главная страница. Блок с фильмами
В этом уроке мы начнем создавать блоки с фильмами
00:10:44
Premium Level
32. Главная страница. Блок с фильмами. CSS-стили
В этом уроке мы напишем стили к блоку с фильмами
00:04:57
Premium Level
33. Главная страница. Блок с фильмами
Интерактивное упражнение
00:05:00
Premium Level
34. Главная страница. Записи блога.
В этом уроке мы изучим еще несколько полезных классов фреймворка Bootstrap и создадим блок с постами
00:05:58
Premium Level
35. Главная страница. Классы кнопок
Интерактивное упражнение
00:02:00
Premium Level
36. Тест
Пройдите тестирование
00:00:30
Premium Level
37. Главная страница. Левый блок
В этом уроке начнем создавать левый блок сайта и изучим компонент фреймворка Bootstrap - panel
00:15:11
Premium Level
38. Panel
Интерактивное упражнение
00:03:00
Premium Level
39. Главная страница. Левый блок. Часть 2
В этом уроке продолжим создавать левую часть сайта и создадим панель для формы входа, а также изучим класс input-groups
00:05:17
Premium Level
40. Главная страница. Левый блок. Часть 3
В этом уроке мы создадим еще одну панель в левом блоке сайта, отображающая рейтинг фильмов, а также изучим новый компоненты фреймворка Bootstrap: list-group, badges
00:07:50
Premium Level
41. Panel. Part3
Интерактивное упражнение
00:05:00
Premium Level
42. Главная страница. Левый блок. Часть 4
В этом уроке мы закончим создавать главную страницу сайта Киномонстр и изучим еще несколько полезных классов фреймворка Boostrap
00:07:11
Premium Level
43. Panel. Part 4
Интерактивное упражнение
00:02:00
Premium Level
44. Страница просмотра фильмов. Адаптивный видеоплеер
В этом уроке мы начнем создавать страницу просмотра фильмов и изучим еще один полезный класс Bootstrap, который позволяет встроенное видео на сайт с популярных видеохостингов таких как Youtube, Vimeo сделать адаптивным
00:04:47
Premium Level
45. Страница просмотра фильмов. Часть 2
В этом уроке мы создадим следующий блок страницы просмотра фильмов и познакомимся с компонентом well фреймворка Bootstrap
00:06:11
Premium Level
46. Страница просмотра фильмов. Часть 3
В этом уроке мы завершим создание страницы просмотра фильмов на фреймворке Bootstrap
00:08:55
Premium Level
47. Страница просмотра фильмов. Блок отзывы
Интерактивное упражнение
00:03:00
Premium Level
48. Страница Films. Часть 1
В этом уроке мы создадим еще одну страницу films.html и при создании изучим еще несколько полезных компонентов фреймворка Bootstrap
00:12:48
Premium Level
49. Страница Рейтинг фильмов
В этом уроке мы создадим страницу с рейтингом фильмов, а также изучим новые компоненты фреймворка Boostrap
00:16:07
Premium Level
50. Заключительная часть
В этом уроке мы рассмотрим остальные компоненты фреймворка Bootstrap, которые не затронули ранее в данном курсе
00:08:58


Посмотреть весь план обучения


Отзывы (161)

Отзывы о курсе по фреймворку Bootstap. Оставьте ваш отзыв после прохождения курса верстки на Bootstrap.

22.06.2018
Дамир Каримов

Хороший курс, можно было бы чуть по подробнее, а так норм

22.06.2018
student_dJP_BlrP

Без базовых навыков по Bootstrap в начале было не понятно, пришлось смотреть видео из других источников, после этого вернулся к курсу стало норм. В первых видео не объясняются назначения классов bootstrap. Вместо объяснений много ссылок на официальную документацию на английском языке. В целом курс был полезен.

20.06.2018
Виктор Попов

Класс спс это лучшее чем просто html и css

18.06.2018
Юрий БУЖКО

Хороший, интересный курс

17.06.2018
Николай Степанов

Спасибо за замечательный курс!

12.06.2018
Boris Vishnevskiy

Отличный курс.

07.06.2018
Григорий Балабанов

Отлично

07.06.2018
Дмитрий

Отличный курс!

05.06.2018
Andreylvaney

Отличный курс!

03.06.2018
Евгений Стратонов

Спасибо за курс! Хотелось бы чтобы в видео была возможность управления скоростью просмотра)

02.06.2018
Елена Струженцева

Отлично! Очень доступно. Спасибо большое!!!!!!!

01.06.2018
Светлана Авдеева

Хороший курс, но без дополнительного изучения не обойтись. Спасибо

26.05.2018
Denis Tokarev

+++

25.05.2018
student_GRogUpTY

Познакомился с очень интересной библиотекой. Думаю ее использование позволит быстро создавать легкие и стильные сайты.

23.05.2018
Сергей Кулюкин

Все понятно и доступно.

22.05.2018
Дмитрий Клянчин

Курс отличный! Спасибо

17.05.2018
student_eCSU85iP

Супер

14.05.2018
Kambulat

Спасибо за курс.

13.05.2018
Александр Горкин

Хороший курс

12.05.2018
Сергей Жучков

Отлично!

09.05.2018
Эдуард Иловайский

Замечательный фреймворк, имеющий возможность для творчества.

06.05.2018
student_G67j1_2J

Отличный курс, спасибо))

05.05.2018
student_wenSahc8

Спасибо! Очень понравился курс!

05.05.2018
Ольга Мананикова

Супер!!! Жутко нравится! Пока все понятно, но не знаю как вставить сову-карусель с маленькими картинками, что прокручивалась пользователем из 10-12 картинок, видная часть 4- 5 картинок

04.05.2018
Александр

Всё доходчиво!

02.05.2018
Руслан Землянский

Отличный курс

30.04.2018
Мурат Суйесинов

Отлично! рекомендую всем)

24.04.2018
Юлия Белоусова

Спасибо, Сергей . Вполне доступно и понятно. Идем дальше....))))

24.04.2018
Геннадий Приходько

Мне очень понравилось

24.04.2018
Venera Mansurova

Спасибо! Понятные объяснения.

21.04.2018
Александр Фоменко

Все просто :)

13.04.2018
Глубокая Наталья

Высший уровень! Все разложено по полочкам.

10.04.2018
Tim ED

Отличное Bootstrap . . . Очень классное !

10.04.2018
Александр Крискевич

Отличный курс. Но уже вышел Bootstrap 4, а отличия между ними огромные :)

08.04.2018
Иван Краснобаев

Для понимания основ использования bootstrap - вполне даже хорошо. Единственный минус - интерактивные задания: малейшее несоответствие (лишний пробел или строка, не виляющие на результат) авторскому коду приводит к ошибке, хотя по факту задание выполнено.

04.04.2018
Viktoriia Presniakov...

Понятный и очень интересный курс.

02.04.2018
Андрей Гераськин

Спасибо, хороший курс

01.04.2018
Денис Климов

Спасибо!

01.04.2018
Yevhenii Khodos

Спасибо! Интересно и познавательно!

30.03.2018
Євгеній Чудновський

Все четко и ясно.

23.03.2018
Александр Сабельнико...

Было интересно!

16.03.2018
Нисембаум Андрей Льв...

Хороший курс, для тех кто не знаком с Bootstrap. Курс позволяет разобраться с тем как все устроенно. С остальным будет легко разобраться в процессе работы над своими проектами и читая документацию на официальном сайте. Единственный минус, это задания. Они легкие и в них нет особого смысла. Спасибо автору за этот курс!

14.03.2018
Николай Ходонович

Очень хорошо

12.03.2018
Ярослав Зовский

Всё ясно и понятно объясняется. Спасибо

Начать обучение

Преподаватель

Author FructCode
Сергей Никонов

- Опыт в веб-разработке более 10 лет 

- Работал над высоконагруженными веб-проектами в крупных компаниях США и ЕВРОПЫ 

- Провел несколько десятков оффлайн и онлайн семинаров на тему веб-разработки 

Всего заданий: 50

Интерактивные задания: 17

Видеоуроки: 25

Тесты: 8


Продолжительность: ~4 часа
  • student_po6Kz19Z
    1245 xp
    1
  • Алексей Чуркин
    1245 xp
    2
  • Илья Сахарюк
    952 xp
    3
  • Виктор Попов
    923 xp
    4
  • Сергей Волков
    743 xp
    5
  • У вас 0 XP за курс BOOTSTRAP

    Бросить вызов?