Travel Agent. HTML верстка на Gulp сборке. Шаблоны в gulp-file-include. Вертикальный swiper. Часть 3
3 часть. Сверстаем лендинг туристического сайта на Gulp сборке. Шаблоны в gulp-file-include. Вертикальный swiper.
Материалы со стрима будут опубликованы в Telegram канале: friZxyBulgNmYjE6
Плейлист по верстке макета Travel Agent
Ссылка на макет:
Урок по Gulp сборке:
Чат верстальщиков ВебКадеми: QAxmsKj2HyWfEKzz
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Бесплатный курс “Создай свой первый сайт на HTML5 и CSS3“
От установки редактора, до публикации в сети.
👉 Получить уроки, конспекты, макет и код из уроков:
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Курс по созданию и верстке сайтов:
Обучение с наставником, 3 месяца, результат, гарантия.
Научим создавать веб-сайты и зарабатывать на этом.
💻 Курс “Frontend разработчик. JavaScript React“:
Обучение с наставником, 3 месяца, результат, гарантия.
💻 Курс “Разработка сайтов на PHP MySQL“:
Создание сайтов с системой управления.
Присоединиться к курсу можно прямо сейчас.
🏁 Обучение с нуля
💁♂️ Обучение с наставником
🎯 Доведение с нуля до результата
🏢 Помощь с трудоустройством
💵 Поможем взять первый заказ на фрилансе
💳 возможна рассрочка
💳 если курс не понравится, вернём деньги в первую неделю
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💈 Сайт школы ВебКадеми:
💈 Вступайте в группу Вконтакте:
💈 Подписывайтесь на Telegram:
Тайм коды:
00:00 План того что сделаем на стриме
02:10 Чат
02:35 Верстка. Открываем проект
05:59 Возможности gulp-file-include
09:23 Работа с секцией testimonials
11:37 Шаблон с передачей данных
18:53 Директива @@loop. Вывод шаблона несколько раз с разными данными
21:10 JSON файл с данными и директива @@loop
27:00 Цикл для вывода одинаковой разметки в шаблоне. Выводим рейтинг
32:52 Условия в шаблоне. Выводим серые звездочки
35:10 Ввожу данные из макета в JSON файл
37:55 Редактируем сборку, слежение за всеми файлами в html директории
40:53 Промежуточный итог того что сделали
42:40 Общение с чатом
45:38 Как сделать смену языка на сайте
47:52 Насколько востребован PixelPerfect
49:15 Вопросы по gulp-webp. Ответ в комментариях к видео
50:34 Где взять идеи для pet проектов в портфолио frontend разработчика
51:49 Вопросы по gulp-webp. Ответ в комментариях к видео
52:15 СИЭСС или КЭСЭС
53:02 Помогают ли занятия спортом
53:40 Верстка. Секция testimonials. Бегущий вертикальный swiper без задержек
56:48 Правка верстки. Колонки для карточек
59:55 Подключаем новый swiper
1:05:03 Правка подключения первого swiper в секции popular
1:11:10 Три колонки под 3 слайдера
1:14:00 Настройки для плавной анимации swiper
1:17:04 Плавные переходы в CSS
1:18:45 Одинаковая высота для слайдов
1:20:20 Выводим карточки в слайдах
1:22:00 Правка высоты слайдов
1:24:40 Выводим 6 слайдов вместо трех
1:25:30 Правка отступов чтобы видеть тень у карточек
1:27:14 Делаем 2 и 3 swiper для остальных колонок с карточками
1:31:50 Фишка с высотой вертикального слайдера. Высота должны быть меньше вьюпорта
1:34:40 Общение с чатом. Как сделать чтобы рейтинг был кликабельный
1:34:55 Как сделать альтернативную БД без хостинга
1:38:09 Зачем SCSS в 2к23
1:39:46 Снова про Tailwind
1:40:52 Можно ли сделать разные направления у втертикальных слайдеров
1:44:00 Верстка. Шаблон и данные из макета в слайдер в секции Popular
1:50:34 Завершение стрима
#HTML #CSS #верстка #WebCademy #ВебКадеми #HTML5 #CSS3 #html #css #html5 #css3 #javascript #js #gulp
56 views
0
0
1 month ago 00:22:58 1
[loric123] ТНО СУПЕР ИВЕНТЫ (щит-посты)
1 month ago 00:47:31 353
Техничка Ивентора I Gosha travel
1 month ago 00:04:33 1
[VideoFromSpace] Most Underrated Place to Go in Our Solar System - ’Travel Agents’ Explain
1 month ago 00:02:39 1
[Movieclips] Atomic Blonde (2017) - This is the Game Scene (8/10) | Movieclips
1 month ago 00:16:08 4
Великие Луки, Псковская область - Щит России (г.)
1 month ago 01:33:00 864
Оман - обзор направления и отельной базы; зачем ехать и что посмотреть в стране
1 month ago 00:00:11 53
Video by Online Travel Agent
1 month ago 00:00:16 145
Clip by @turagent_mariia
1 month ago 01:02:25 181
Обзор отеля Radisson Blu Resort Maldives 5* на Мальдивах
1 month ago 01:07:58 1
C’EST GRAVE! Un agent de l’ONU admet que la guerre est le seul moyen de gagner beaucoup d’argent
1 month ago 00:03:45 13
Слово “agent“ может иметь несколько значений, связано с действиями, выполненными от имени другого человека
1 month ago 00:54:03 1
CNN: “Biden devrait démissionner et installer Kamala avant la certification de l’élection“-MDL NEWS
1 month ago 00:53:52 2
Топовый тур-агент
1 month ago 00:02:49 65
[Netflix] Carry-On | Official Trailer | Netflix
1 month ago 00:16:08 2.4K
Ранний заезд и поздний выезд в отель на о.Хайнань, Китай. Инструкция от Павла Георгиева.