Доступно

[Javascript.ru] Курс по современной вёрстке (Герман Семикозов)

Тема в разделе "Курсы по программированию"

Цена:
15000 руб
Взнос:
544 руб
Организатор:
Lucky man

Список участников складчины:

1. Lucky man 2. RotterX
Купить
  1. Lucky man Организатор складчин

    [Javascript.ru] Курс по современной вёрстке (Герман Семикозов)

    [​IMG]

    Описание


    Курс по современной вёрстке, цель которого – сделать процесс вёрстки лёгким и понятным, научить создавать компоненты и избегать распространённых ошибок. HTML/CSS - технология, которую легко освоить "по верхам", выучить основные теги и свойства, и что-то сразу можно создавать. Многие разработчики так и делают.

    Цель этого курса - научить не просто свойствам, а правильным подходам к вёрстке, включая организацию кода, стилей, совместимость с мобильными устройствами и многое другое.

    Курс продвинутый, поэтому лучше приходить не с нулевыми знаниями. Хотя и с нуля возможно, мы дадим основы вёрстки дадим до курса, во вводных материалах, они простые, но нужно будет внимательно посмотреть.

    Курс также подойдёт для Javascript-разработчиков и backend-разработчиков, которые хотят повысить свой уровень понимания вёрстки, больше уметь сами в этой области.

    Продолжительность

    Курс идёт около 1 месяца

    Блок 1
    Основы современной вёрстки

    Начнём с проверки понимания и нюансов использования базовых CSS-свойств, основ, которые вы посмотрели дома по вводным материалам.

    Далее разберём компонентную структуру веб-страницы с точки зрения HTML/CSS, подходы к организации и архитектуре CSS-кода: БЭМ, Atomic CSS и др.

    Изучим основы адаптивной вёрстки, единицы измерения. Темизацию на основе CSS-переменных.

    Компоненты:
    • Кнопка (button).
    • Подсказка (tooltip).
    • "Аккордеон" (accordion).
    Блок 2
    Современная адаптивная вёрстка

    Разберем различные способы верстки: статическую, резиновую, адаптивную и разницу между ними.
    • Современные подходы к верстке: flex.
    • Современные подходы к верстке: grid.
    • Верстка для разных экранов, viewport устройства.
    • Медиазапросы (media).
    • Изображения. Методы добавления изображений на страницу - плюсы, минусы и ограничения каждого (background-image, img и object). Способы оптимизации загрузки, поддержка разных разрешений.
    Компоненты:

    • Календарь.
    • Гистограмма.
    • Аватар пользователя.
    • Модальное окно.
    Блок 3
    Верстка форм

    Для заказа пиццы нужно оставить свой номер телефона, а для оплаты картой - ее реквизиты: "заполнить форму". Этот процесс должен быть красивым, удобным, понятным для пользователя. Разберем структуру формы и составляющих ее элементов, изучим нюансы правильной верстки формы.

    Компоненты:
    • Поле ввода.
    • Радио.
    • Чекбокс.
    • Многострочное поле ввода.
    • Кнопка.
    • Вкладки (tabs).
    Блок 4
    Анимация

    Научимся по-разному анимировать элементы интерфейса без использования JavaScript, профилировать анимацию, чтобы сделать её красивой и плавной.
    • Анимация: transition.
    • Анимация: keyframes.
    • Профилирование анимаций. “Тяжелые” для анимирования свойства.
    • Flip-анимации.
    Компоненты:
    • Скелетон.
    • Спиннер.
    • Анимация гистограммы, аккордеона, всплывающей подсказки.
    Блок 5
    Сборка, пре- и постпроцессоры

    Разберём, как пишется и собирается код в современных проектах, пре- и постпроцессоры на основе postCSS, поддержку css-свойств в разных браузерах, современные средства сборки CSS, автопрефиксер и минификацию.
    Скрытый текст. Доступен только зарегистрированным пользователям.Нажмите, чтобы раскрыть...
     
  2. Похожие складчины
    Загрузка...
  3. Lucky man Организатор складчин
    Уведомляем вас о начале сбора взносов.
    Цена продукта: 15000 руб. Взнос с каждого участника: 544 руб.
    Кол-во участников в основном списке: 1 чел.

    Начало сбора взносов 10 Ноябрь 2023 года
     
    Lucky man,
Наверх