Открыто

[loftschool] Веб-разработка для начинающих [12 января - 22 февраля 2021]

Тема в разделе "Курсы по программированию", создана пользователем pikylbkaNomer, 25 ноя 2020.

Цена: 25000р.
Взнос: 4609р.-81%

Основной список: 6 участников

Резервный список: 3 участников

  1. 25 ноя 2020
    #1
    Топикстартер
    Топикстартер ЧКЧлен клуба
    [loftschool] Веб-разработка для начинающих [12 января - 22 февраля 2021]

    [​IMG]

    Записывайтесь и за 6 недель освойте адаптивную вёрстку, JavaScript и получите мощный проект в портфолио.


    Программа курса была переработана!

    Теперь каждая неделя включает в себя:

    • 2-3 обучающих модуля
      Каждый модуль состоит из видеоуроков и методичек.
    • 1 групповую практику
      С наставником и одногруппниками.
    • 1-2 практических вебинара
      С преподавателем.

    Неделя 1 — Git и GitHub, SASS, разметка страницы
    — Верстаем заданные секции из дизайн-макета.
    — Формируем структуру CSS, организуем входной файл стилей с применением SCSS.
    — Размещаем работу в репозитории и на GitHub Pages.
    Открытие профессии
    1 урок (01:09:37)
    Вводное занятие
    1 урок (06:53)

    Figma для верстальщика
    1 урок (04:37);

    SASS
    9 уроков (44:30)
    • 1. Теория (07:05)
    • 2. Компиляция (03:46)
    • 3. Вложенность (nesting) (05:34)
    • 4. Арифметические операции (operators) (00:54)
    • 5. Переменные (variables) (08:16)
    • 6. Примеси (mixins) (04:51)
    • 7. Условия (conditions) (04:34)
    • 8. Наследование (inheritance) (01:50)
    • 9. Циклы (loops) (07:40)

    БЭМ. Разметка элементов страницы
    5 уроков (33:58)
    • 1. Принцип разметки (04:40)
    • 2. Использование классов (04:36)
    • 3. BEM (05:46)
    • 4. Разметка страницы (07:36)
    • 5. Разметка содержимого (11:20)

    Flexbox
    13 уроков (26:26)
    • 1. Введение (00:45)
      Бесплатный урок
    • 2. Флекс-контейнер (01:43)
      Бесплатный урок
    • 3. Выравнивание по главной оси (01:37)
      Бесплатный урок
    • 4. Выравнивание по поперечной оси (01:50)
    • 5. Выравнивание отдельного элемента (01:09)
    • 6. Флекс-элемент – контейнер (00:53)
    • 7. Направление осей (03:18)
    • 8. Многострочный контейнер (02:54)
    • 9. Выравнивание многострочного контента (01:25)
    • 10. Пропорции (02:46)
    • 11. Пропорции при сжатии (01:24)
    • 12. Базовый размер (04:02)
    • 13. Порядок элементов (02:40)

    Terminal

    13 уроков (48:59)
    • 1. Введение. Установка (05:45)
      Бесплатный урок
    • 2. Hello World (01:21)
      Бесплатный урок
    • 3. Навигация (07:26)
      Бесплатный урок
    • 4. Текущая директория (00:27)
    • 5. Создание папок (03:03)
    • 6. Создание файлов (01:55)
    • 7. Удаление файлов (01:53)
    • 8. Копирование. Перемещение. Переименование (03:29)
    • 9. Исправление опечаток (01:35)
    • 10. Поиск. Документация (03:04)
    • 11. Обзор редактора Vim (12:35)
    • 12. Обзор редактора Nano (04:38)
    • 13. Экранирование (01:48)

    GIT
    12 уроков (01:28:36)
    • 1. Введение (07:03)
      Бесплатный урок
    • 2. Начинаем работать с Git (03:01)
      Бесплатный урок
    • 3. Создание нового репозитория (01:09)
      Бесплатный урок
    • 4. Добавление файлов в индекс (область слежения) Git (06:49)
      Бесплатный урок
    • 5. Создание коммита (07:17)
    • 6. Навигация по коммитам. Отмена изменений (12:10)
    • 7. Типичный цикл работы с Git (03:34)
    • 8. Ветвления в Git (11:27)
    • 9. Конфликты при слиянии веток (06:06)
    • 10. Временное (без коммита) сохранение данных (05:25)
    • 11. Работа с удалёнными репозиториями (20:04)
    • 12. Использование GitHub Pages для хостинга проектов (04:31)

    CHOCCO. Разметка
    Воркшоп
    11 уроков (01:18:19)
    • 1. Секция Hero. Разметка (06:41)
    • 2. Секция Hero. Стилизация (13:34)
    • 3. Секция Hero. PP (05:11)
    • 4. Секция Почему. Разметка (04:47)
    • 5. Секция Почему. Стилизация (06:40)
    • 6. Секция Почему. Декор (07:48)
    • 7. Секция Отзывов. Верстка (09:16)
    • 8. Секция Отзывов. Декор (02:09)
    • 9. Форма. Поля (11:34)
    • 10. Форма. Кнопки (04:09)
    • 11. Фиксированное меню (06:30)

    Неделя 2 — SVG, адаптивная и мобильная вёрстка
    — Подготавливаем элементы для последующего программирования на JavaScript.
    — Делаем адаптив.
    — Собираем SVG иконки в спрайт.

    Адаптивная вёрстка
    14 уроков (01:29:18)
    • 1. Теория (15:35)
      Бесплатный урок
    • 2. Типы лейаута (04:16)
      Бесплатный урок
    • 3. Пиксели и проценты (05:41)
      Бесплатный урок
    • 4. Em и rem (04:00)
    • 5. Viewport units (06:08)
    • 6. Медиазапросы (09:55)
    • 7. Mobile First (04:54)
    • 8. Печатные документы (02:43)
    • 9. Применение на практике (13:36)
    • 10. Viewport (02:34)
    • 11. Ретина Теория (03:36)
    • 12. Ретина. Медиазапрос (02:14)
    • 13. Ретина. Суть оптимизации (06:10)
    • 14. Srcset (07:56)
    SVG
    17 уроков (58:05)
    • 1. Теория (10:47)
      Бесплатный урок
    • 2. Элемент SVG (01:15)
      Бесплатный урок
    • 3. Прямоугольник (02:28)
    • 4. Общие свойства (01:29)
    • 5. Окружность (00:49)
    • 6. Эллипс (01:01)
    • 7. Линия (00:52)
    • 8. Многоугольник и полилиния (01:48)
    • 9. Знакомство с Path (04:50)
    • 10. ViewBox (06:21)
    • 11. Группировка (06:45)
    • 12. Фильтры (04:55)
    • 13. Градиенты (03:35)
    • 14. Текст и градиент (01:48)
    • 15. Свойства CSS (01:55)
    • 16. Добавление на страницу (01:18)
    • 17. SVG-спрайт (06:09)
    CHOCCO. Адаптивная верстка
    Воркшоп
    10 уроков (43:51)
    • 1. Настройка лейаута (09:07)
    • 2. Hero (07:27)
    • 3. Hero. Гамбургер меню (03:50)
    • 4. Основное меню (02:57)
    • 5. Perfect Pixel (02:12)
    • 6. Секция Отзывов (01:36)
    • 7. Форма (01:31)
    • 8. Hero. Версия под телефоны (02:32)
    • 9. Остальные секции (07:05)
    • 10. Mobile vs Desktop first (05:34)
    Неделя 3 — JavaScript, работа с DOM
    — Выполняем задачи по JavaScript.
    — Верстаем слайдер.
    — Делаем верстку меню и обеспечиваем его функциональность.

    Вопрос-ответ
    Вебинар

    Основы JavaScript
    14 уроков (02:16:17)
    • 1. Введение (08:20)
      Бесплатный урок
    • 2. Типы данных (06:17)
      Бесплатный урок
    • 3. Оператор If (06:53)
      Бесплатный урок
    • 4. Оператор For (06:34)
    • 5. Функции (09:37)
    • 6. Область видимости и замыкания (12:34)
    • 7. Всплытие (11:10)
    • 8. Типы объявления функций (07:42)
    • 9. Стрелочные функции (16:05)
    • 10. Let (05:41)
    • 11. Const (03:53)
    • 12. Объекты (13:17)
    • 13. Массивы (24:18)
    • 14. Заключение (03:56)


    Работа с DOM
    5 уроков (01:28:46)
    • 1. Введение (21:22)
    • 2. События (09:42)
    • 3. Обработка ввода (27:44)
    • 4. Работа с формами (19:54)
    • 5. Рабочий пример (10:04)

    Обработка ошибок и отладка
    4 урока (01:23:18)
    • 1. Инструменты браузера (19:29)
    • 2. Обработка ошибок (36:12)
    • 3. Стек вызовов (15:10)
    • 4. Отладка (12:27)

    JavaScript. Задачи
    Воркшоп
    16 уроков (01:19:27)
    • 1. Запуск кода (02:40)
    • 2. Фильтрация строки (07:19)
    • 3. Выборка объекта (04:09)
    • 4. Анализ строки (04:31)
    • 5. Фильтрация массива (04:04)
    • 6. Слайдер. Механика работы (03:01)
    • 7. Слайдер. Реализация (08:10)
    • 8. Слайдер. Динамические переменные (08:08)
    • 9. Слайдер. Перенос элементов (04:31)
    • 10. Модальное окно. Генерация разметки. ч1 (02:14)
    • 11. Модальное окно. Генерация разметки. ч2 (04:41)
    • 12. Модальное окно. Закрытие (05:08)
    • 13. Модальное окно. Функция для создания (02:25)
    • 14. Модальное окно. Шаблоны (04:51)
    • 15. Создание блоков (04:52)
    • 16. Закрашивание блоков (08:43)
    Неделя 4 — Обработка ошибок, работа с формами, Ajax
    — Создаём виджеты на странице: аккордеон, слайдер, модальное окно.
    — Реализуем работу формы заказа.
    — Обеспечить обработку ответа от сервера в форме заказа.

    jQuery. Работа с библиотекой
    28 уроков (01:25:05)
    • 1. Теория jQuery (07:28)
      Бесплатный урок
    • 2. Подключение библиотеки (04:27)
      Бесплатный урок
    • 3. Документация (01:32)
      Бесплатный урок
    • 4. Проверка версии (01:01)
    • 5. Селектор (01:24)
    • 6. Document Ready (01:46)
    • 7. Обработка событий (02:32)
    • 8. Свойства элемента (04:22)
    • 9. Размеры элемента (02:29)
    • 10. Работа с классами (03:09)
    • 11. Работа с формами (03:19)
    • 12. Работа со стилями (01:50)
    • 13. Свойства для коллекции (01:46)
    • 14. This в событиях (03:21)
    • 15. Управление коллекцией (04:39)
    • 16. Навигация: родители и потомки (02:35)
    • 17. Навигация: соседи (03:12)
    • 18. Перебор коллекции (02:23)
    • 19. Фильтрация набора (03:55)
    • 20. Контекст (00:57)
    • 21. Добавление элементов (02:53)
    • 22. Удаление и клонирование элементов (01:18)
    • 23. Делегирование событий (01:49)
    • 24. Готовые анимации (05:43)
    • 25. Собственные анимации (01:37)
    • 26. Очередь анимаций (04:00)
    • 27. События страницы (05:49)
    • 28. Отложенный обработчик (03:49)

    Работа с формами. Ajax
    5 уроков (01:19:41)
    • 1. Асинхронные сетевые запросы (15:52)
      Бесплатный урок
    • 2. JSON (13:05)
    • 3. Работа с формами (19:15)
    • 4. Валидация данных (22:42)
    • 5. Отправка данных на сервер (08:47)

    CHOCCO. Виджеты
    Воркшоп
    8 уроков (49:59)
    • 1. Слайдшоу (07:07)
    • 2. Вертикальный аккордеон. Верстка (05:19)
    • 3. Вертикальный аккордеон. Реализация (07:26)
    • 4. Слайдер (10:32)
    • 5. Форма. Вызов модального окна (04:09)
    • 6. Форма. Отправка запроса (04:32)
    • 7. Форма. Валидация (04:41)
    • 8. Форма. Обработка ответа (06:13)
    Неделя 5 — Плагины, Workflow, работа с API
    — Подключаем интерактивную карту google / yandex.
    — Реализуем OnePageScroll.
    — Разделяем структуру проекта на Dev и Prod.
    — Реализуем видео-плеер при помощи HTML5 Video API.

    NPM
    11 уроков (35:05)
    • 1. Что такое npm? (05:50)
      Бесплатный урок
    • 2. Установка и обновление npm (02:33)
      Бесплатный урок
    • 3. Справка по работе с npm (01:28)
      Бесплатный урок
    • 4. Поиск и установка пакетов (04:24)
    • 5. Зависимости пакета (02:09)
    • 6. Файл манифест package.json (03:02)
    • 7. Удаление и обновление пакетов (03:02)
    • 8. dependencies и devDependencies (01:51)
    • 9. Webpack и npx (04:04)
    • 10. npm-скрипты (04:02)
    • 11. npm, git и github (02:40)

    Gulp
    25 уроков (01:42:55)
    • 1. Теория (06:52)
      Бесплатный урок
    • 2. Установка (02:54)
      Бесплатный урок
    • 3. Первый таск (03:54)
      Бесплатный урок
    • 4. Обработка нескольких файлов (03:53)
    • 5. Добавляем плагин (04:42)
    • 6. Серия тасков (03:46)
    • 7. Task Default (01:45)
    • 8. Компилируем Sass (03:56)
    • 9. Склейка файлов (04:02)
    • 10. Слежка за файлами (02:41)
    • 11. Dev-server (08:11)
    • 12. Внешний адрес browser-sync (01:58)
    • 13. Продвинутый импорт стилей (02:07)
    • 14. Автопрефиксы (05:27)
    • 15. Пересчет единиц измерения (01:41)
    • 16. Группировка медиа-запросов (02:29)
    • 17. Минификация (02:14)
    • 18. Sourcemaps (04:53)
    • 19. Сборка JavaScript (05:28)
    • 20. Трансляция ES6 (02:54)
    • 21. Минификация JavaScript (06:02)
    • 22. Генерация SVG-спрайта (05:41)
    • 23. Разделение конфига (04:05)
    • 24. Параллельные таски (01:48)
    • 25. Dev vs Prod (09:32)

    YouTube Iframe API
    6 уроков (27:53)
    • 1. Подготовка (01:37)
      Бесплатный урок
    • 2. Инициализация (06:59)
    • 3. Запуск и остановка (03:06)
    • 4. Продолжительность видео (05:26)
    • 5. Ползунок (06:10)
    • 6. Завершение работы (04:35)

    Подключение Яндекс.Карты
    1 урок (08:49)
    • Подключение Яндекс.Карты (08:49)

    CHOCCO. Интерактивные элементы
    Воркшоп
    15 уроков (01:03:23)
    • 1. Горизонтальное меню. Верстка (02:11)
    • 2. Горизонтальное меню. Открытие элемента (03:13)
    • 3. Горизонтальное меню. Закрытие элементов (05:10)
    • 4. Горизонтальное меню. Мобильная версия (04:39)
    • 5. Горизонтальное меню. Текст (04:24)
    • 6. OPS. Подготовка (02:32)
    • 7. OPS. Обработка скролла (01:41)
    • 8. OPS. Функция сдвига (01:53)
    • 9. OPS. Смена секций (05:07)
    • 10. OPS. Исправление ошибок (03:38)
    • 11. OPS. Управление с клавиатуры (03:00)
    • 12. OPS. Навигация по ссылкам (03:25)
    • 13. OPS. Боковое меню (03:01)
    • 14. OPS. Рефакторинг (11:54)
    • 15. OPS. Мобильная версия (07:35)

    Неделя 6 — Выпускной
    — Работа над проектом.
    — Выдача дипломов за курс.

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

    [​IMG]

    Продажник
     
    3 пользователям это понравилось.
  2. Последние события

    1. Nemo16
      Nemo16 не участвует.
      15 дек 2023
    2. ТаняБриз
      ТаняБриз не участвует.
      8 фев 2023
    3. darmor
      darmor не участвует.
      27 янв 2023
    4. pupsik8
      pupsik8 не участвует.
      23 ноя 2022
  3. Обсуждение
  4. 19 июн 2021
    #2
    Joe_Bloggs
    Joe_Bloggs ДолжникДолжник
    Здравствуйте! А не получится ли как-нибудь организовать складчину для [loftschool] Веб-разработчик? И если нет, то когда сборы для данной складчины?
     

Поделиться этой страницей