Как верстать быстро? Foundation / Sprint 11

В этом видео про быструю вёрстку с библиотекой стилей Foundation. А также про работу с формами с помощью JS. Мы рассмотрим страницу для составления списка гостей на свадьбу. Расскажу максимально детально как использовать специальные циклы для массивов map, filter и reduce на простых примерах. 0:00:00 Введение 0:01:00 Использование библиотеки готовых стилей 0:02:00 Добавление библиотеки на сайт 0:03:14 Удаление начальных полей 0:04:34 Добавление кнопок и работа с классами 0:05:39 Создание страницы с использованием компонентов 0:06:36 Обсуждение использования библиотек в компаниях 0:07:32 Работа с формами 0:08:35 Введение в систему сеток в библиотеках 0:09:46 Понимание колонок в системе сеток 0:10:52 Объяснение диапазонов колонок 0:12:00 Демонстрация отзывчивых стилей 0:13:10 Обсуждение HTML и предстоящего сценария 0:14:15 Адаптация к мобильным устройствам с помощью библиотеки 0:15:21 Стили по умолчанию браузера и роль библиотеки 0:16:22 Объяснение назначения библиотеки 0:17:21 Пользовательские стили и библиотека 0:18:27 Использование элемента таблицы в HTML 0:19:34 Структура таблицы HTML 0:20:39 Трудности запоминания тегов HTML 0:21:46 Важность правильного использования тегов таблицы 0:22:53 Добавление функциональности к кнопке “Добавить“ с помощью JavaScript 0:24:00 Отправка данных формы с помощью клавиши “Enter“ 0:25:05 Предотвращение перезагрузки страницы при отправке формы 0:26:12 Эволюция отправки формы в веб-разработке 0:27:09 Получение данных, введенных пользователем 0:28:16 Краткие техники кодирования для получения данных 0:29:19 Работа с радиокнопками 0:30:21 Работа с выделенными элементами HTML 0:31:26 Работа с флажком в HTML 0:32:31 Добавление данных в массив с помощью JavaScript 0:33:32 Использование оператора OR в JavaScript 0:34:39 Изучение данных, хранящихся в массиве 0:35:44 Сброс полей формы после отправки 0:36:49 Создание функции для сброса формы 0:37:53 Функция таблицы для отображения данных формы 0:39:01 Очистка и обновление содержимого таблицы 0:40:05 Объяснение логики селектора в JavaScript 0:41:11 Объяснение селекторов класса и идентификатора в JavaScript 0:42:07 Заполнение таблицы данными из массива 0:43:09 Введение в циклы в JavaScript 0:44:13 Демонстрация функции map в JavaScript 0:45:16 Понимание обработки массива с помощью функции map 0:46:20 Иллюстрация обработки массивов на практике 0:47:23 Дальнейшее обсуждение функции map и обработки массивов 0:48:17 Использование функции map для создания элементов HTML 0:49:30 Отладка и анализ вывода кода 0:50:31 Демонстрация конкатенации строк для обработки HTML 0:51:41 Дальнейшие пояснения по обработке HTML 0:52:47 Понимание функции join в JavaScript 0:53:50 Обсуждение тернарного оператора в JavaScript 0:54:54 Разъяснение роли элемента body в HTML-таблицах 0:56:01 Заключительное объяснение и демонстрация состава HTML-таблицы 0:57:05 Обсуждение комментариев и синтаксиса HTML 0:58:10 Уточнение сложности объясняемых концепций 0:59:15 Представление функции reduce в JavaScript 1:00:21 Глубокое погружение в функцию reduce 1:01:21 Сравнение функций map, filter и reduce 1:02:23 Пример использования reduce для суммирования в массиве 1:03:24 Подробное объяснение функции reduce на примере суммы 1:04:23 Роль аккумулятора в функции reduce 1:05:26 Обсуждение различных вариантов использования функции reduce 1:06:16 Объяснение начального значения в функции уменьшения 1:07:20 Важность map и reduce для эффективного кодирования 1:08:14 Объяснение функции reduce с объектами и преобразование строки в число 1:09:20 Накопитель как контейнер для суммарного значения в функции reduce 1:10:18 Окончательное вычисление с помощью функции reduce 1:11:32 Введение в функцию join с примерами 1:12:35 Обсуждение роли разделителя в функции join 1:13:47 Реакция зрителей и вопросы и ответы о сложности обсуждаемых тем 1:14:50 Навигация по автозавершению кода и всплывающим подсказкам в редакторе 1:15:57 Введение в документацию JavaScript по массивам Задачи на спринт: 1: Библиотека стилей - 2: Личный кабинет пользователя -