Курс Bootstrap программирования верстки веб-сайтов для начинающих Frontend разработчиков с интерактивными заданиями в браузере

О курсе

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

В уроках Bootstrap вы узнаете:

Что такое Grid-system и как позиционировать блоки на сайте
Как быстро сверстать веб-сайт с помощью Bootstrap
Как сделать горизонтальное и вертикальное меню
Какие существуют компоненты в Bootstrap
Как встроить адаптивный видеоплеер на сайт
Как вставить картинку на страницу и сделать ее адаптивной
Как быстро сделать карусель изображений на сайте

Уроки верстки Bootstrap построены таким образом, что вы сможете уже через несколько уроков Bootstrap создать основу каркаса сайта!

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

Создание сайтов на Bootstrap относится к Frontend(фронтенд) и специалисты со знанием Bootstrap ценятся на рынке труда. После завершения курса Bootstrap, мы рекомендуем проходить курс PHP/MySQL.

План курса

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

1
Знакомство и установка
- 1
  Знакомство с Bootstrap. Установка11:20
2
Позиционирование блоков (Grid System)
- 2
  Классы container и container-fluid05:44
- 3
  Выполните тест00:15
- 4
  Grid System02:00
- 5
  Grid System. Класс row01:12
- 6
  Выполните тест00:15
- 7
  Grid Stystem. Класс .row02:00
- 8
  Grid System. Позиционирование блоков06:41
- 9
  Grid System. Классы .col-lg-*, .col-md-*, col-xs-*, col-sm-*02:00
- 10
  Выполните тест00:15
- 11
  Классы для позиционирования при разных размерах экрана06:16
- 12
  Выполните тест00:15
- 13
  Класс hidden-*02:00
- 14
  Классы push и pull03:00
3
Главная страница. Верхняя часть сайта
- 15
  Navbar07:58
- 16
  Navbar02:00
- 17
  Navbar. Продолжение04:57
- 18
  Navbar toggle03:00
- 19
  Navbar. Логотип и слоган07:40
- 20
  Выполните тест00:20
- 21
  Navbar. Стили для пунктов меню07:12
- 22
  Header. Логотип и слоган00:30
- 23
  Navbar. Продолжение03:09
- 24
  Выполните тест00:15
- 25
  Navbar. Улучшим внешний вид для мобильного устройства02:00
- 26
  Header. Заключительная часть09:16
- 27
  Header. Заключительная часть05:00
4
Главная страница. Шаблон страницы
- 28
  Структура шаблона страниц11:45
- 29
  Структура шаблона страниц02:00
- 30
  Выполните тест00:10
5
Главная страница. Фильмы, сериалы, блог
6
Главная страница. Левая часть сайта.
- 37
  Главная страница. Левый блок15:11
- 38
  Panel03:00
- 39
  Главная страница. Левый блок. Часть 205:17
- 40
  Главная страница. Левый блок. Часть 307:50
- 41
  Panel. Part305:00
- 42
  Главная страница. Левый блок. Часть 407:11
- 43
  Panel. Part 402:00
7
Страница просмотра фильмов и сериалов
8
Страницы Фильмы и Рейтинг фильмов
- 48
  Страница Films. Часть 112:48
- 49
  Страница Рейтинг фильмов16:07
9
Заключительная часть
- 50
  Заключительная часть08:58
Получение сертификата об окончании курса

Отзывы (1264)

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

Татьяна Русакова

7 years ago

Курс понравился. Помимо "живых" примеров предлагается список источников для дальнейшего самообучения и саморазвития. Рекомендую!

Роман Куракса

7 years ago

Бегло, но доходчиво. Стоит пройти этот курс.

Александр Гальчин

7 years ago

Давно хотел разобраться в BOOTSTRAP, и этот курс мне реально помог.

Александр Зайцев

7 years ago

Очень понравился!!!

Роман Семенов

7 years ago

Для ознакомления с Bootstrap по верхам — отличный курс. Для углубленного изучения придется рыть самостоятельно. Но это уже особенность новых профессий, так как в вузах такому не учат пока. Вообще, веб-разработчик (как и любой другой специалист в сфере интернета) это самостоятельный и любознательный вечный ученик))

Константин Лавровский

7 years ago

Коротко и чётко, спасибо.

Дмитрий Квачук

7 years ago

Основы и примеры - это колоссальный задел для дальнейшего обучения BOOTSTRAP. Хороший курс. Так держать.

Александр

7 years ago

Курс понравился, много узнал интересного. Теперь главное больше практиковаться.....

Владимир Соловьев

7 years ago

Как введение курс неплох, информация подана легко и воспринимается приятно. Главный недостаток - это только введение. В некоторых местах непонятно как работают те или иные классы, например, как именно класс clearfix делает то, что он делает, т.е. механика работы не разобрана, просто пользуйтесь и все. А, когда я попробовал разобрать верстку не учебного сайта, сделанного на Bootstrap, я обнаружил много классов использующих FLEX, в курсе об этом ни слова - придется разбираться самостоятельно.

Никита Толмач

7 years ago

Хороший курс, намного меньше кода)

Александр Прокопец

7 years ago

Хороший старт! Всем советую, после прохождения курса никаких сложностей с bootstrap-ом не возникает. Автору спасибо =)

Nadezhda Kudasheva

7 years ago

Курс очень простой и для новичка очень подойдет.

ЧАСТО ЗАДАВАЕМЫЕ ВОПРОСЫ

Обучение разделено на видео лекции, интерактивные задания и тесты. В видео лекциях вы получаете теоретический материал и с помощью интерактивных заданий закрепляете теорию на практике. Вы пишите код прямо в браузере и мгновенно получаете результат проверки вашего кода - верно или нет. Практически в каждом уроке есть ссылки на дополнительные материалы и исходный код.