Travel Agent. HTML верстка лендинга Travel Agent на Gulp сборке. Autocomplete, календарь. Часть 1
Сверстаем лендинг туристического сайта на Gulp сборке. HTML, SCSS, flexbox и CSS Grid. Подключим скрипт для автокомплита и подсказок при вводе текста - . Используем плагин для выбора даты через календарь (datepicker) easepick js.
Материалы со стрима будут опубликованы в Telegram канале: friZxyBulgNmYjE6
Ссылка на макет:
Урок по Gulp сборке:
Готовый код и графика для урока: 9XtDDNBdHAk4Yjhi (пост за 24 Августа 2023)
Чат верстальщиков ВебКадеми: QAxmsKj2HyWfEKzz
Плейлист по верстке макета Travel Agent
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Бесплатный курс “Создай свой первый сайт на HTML5 и CSS3“
От установки редактора, до публикации в сети.
👉 Получить уроки, конспекты, макет и код из уроков:
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Курс по созданию и верстке сайтов:
Обучение с наставником, 3 месяца, результат, гарантия.
Научим создавать веб-сайты и зарабатывать на этом.
💻 Курс “Frontend разработчик. JavaScript React“:
Обучение с наставником, 3 месяца, результат, гарантия.
💻 Курс “Разработка сайтов на PHP MySQL“:
Создание сайтов с системой управления.
Присоединиться к курсу можно прямо сейчас.
🏁 Обучение с нуля
💁♂️ Обучение с наставником
🎯 Доведение с нуля до результата
🏢 Помощь с трудоустройством
💵 Поможем взять первый заказ на фрилансе
💳 возможна рассрочка
💳 если курс не понравится, вернём деньги в первую неделю
💈 Сайт школы ВебКадеми:
💈 Вступайте в группу Вконтакте:
💈 Подписывайтесь на Telegram:
Тайм коды:
00:00 Старт трансляции
00:30 Начало стрима
01:38 Где взять макет и материалы к уроку
02:45 Обзор макета
04:15 Gulp сборка на которой верстаем макет
05:15 Общение
06:10 Старт работы со сборкой
08:30 Общение с чатом
11:25 Работы учеников
13:22 Общение с чатом
18:00 Вопрос про хостинг для верстальщика
21:30 Вопрос про Tailwind
26:58 Верстка шапки с навигацией
49:55 Общение с чатом
50:30 Минимальный стек для frontend junior
51:52 О мотивации к изучению
54:30 Вложенность селекторов в SCSS
59:20 О новых фишках вложенности в CSS
1:00:48 Что делать если не можешь самостоятельно сверстать макет. Постоянно забрасываю
1:03:19 Есть ли преимущество SCSS перед SASS
1:04:05 Можно ли учить Gulp без знания JS
1:05:35 Что посоветуете по изучению JS
1:07:40 Верстка. Подключение шрифтов
1:11:05 Настройки переменных в проекте
1:14:15 Верстка первой секции Discover
1:26:05 Общение с чатом
1:28:20 Roadmap по изучению JS
1:29:52 Какой компьютер используешь для работы
1:33:05 Верстка. Подчеркивание для заголовка
1:35:45 Верстка. Форма поиска тура
1:53:05 Общение с чатом
1:53:43 Про шаблонизатор PUG
1:54:40 Про ноутбуки
1:55:24 Про SVG в верстке
1:56:47 Стоит ли сейчас изучать программирование, верстку
1:57:47 Реально ли найти работу верстальщиком
1:58:55 Опрос, что верстаем дальше
2:00:48 Сколько времени займет переход в frontend разработку
2:02:53 Верстка. JS скрипт для autocomplete
2:12:28 Свои стили для
2:20:00 Выбор варианта в автокомплите
2:22:22 Поиск пакетов с городами в JSON
2:25:21 Общение с чатом
2:26:25 Можно ли составить конкуренцию WordPress используя Next JS и CMS Strapi
2:28:53 Вопргос про “миллион“ файлов и папок в сборке
2:29:58 Почему фронты не любят верстку
2:30:20 Свои решения для создания сайтов на фрилансе
2:32:13 Верстка. Блок с подсказкой
2:47:11 JS. Перенос автокомплита в отдельный файл
2:53:10 Позиционирование блока с подсказкой
2:55:50 Верстка блока scroll down
3:01:50 Анимация вращения по кругу для блока scroll down
3:04:00 Общение с чатом
3:05:20 PHP Mailer для продвинутой отправки почты
3:06:10 Gulp и PHP файлы в проекте
3:09:40 Можно ли заказать верстку
3:12:29 Чем отличается CSS от SCSS
3:13:04 Планируется ли курс по WordPress
3:13:47 Gulp и PHP файлы в проекте часть 2
3:14:55 Ссылка на курс по PHP
3:15:14 Верстка. Календарь Easepick datepicker для выбора даты
3:29:47 Общение с чатом
3:30:55 Вопрос про корзину на JS
3:31:34 Верстка. Добавление выбора времени в плагин Easepick
3:36:40 Верстка. Формат для даты и времени в Easepick
3:38:00 Меняю цвет у footer
3:38:32 Завершение, общение с чатом
3:39:25 Как добавлять Google карту на сайт
3:41:15 Общение, готовый код с урока
3:43:25 Финал
#HTML #CSS #верстка #WebCademy #ВебКадеми #HTML5 #CSS3 #html #css #html5 #css3 #javascript #js #gulp
300 views
1
0
4 weeks ago 00:22:58 1
[loric123] ТНО СУПЕР ИВЕНТЫ (щит-посты)
4 weeks ago 00:47:31 353
Техничка Ивентора I Gosha travel
4 weeks 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
Ранний заезд и поздний выезд в отель на о.Хайнань, Китай. Инструкция от Павла Георгиева.