Доступно

[WebForMySelf] Технология CSS Grid. Руководство по адаптивной верстке (Денис Булыга)

Тема в разделе "Курсы по программированию", создана пользователем Дейнерис, 16 июн 2019.

Тема найдена по тегам:
Цена:
3582р.
Взнос:
130р.

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

1. Дейнерис
Тип: Стандартная складчина
Оцените эту складчину: /5,
  1. 16 июн 2019
    #1
    Дейнерис
    Дейнерис Организатор
    [WebForMySelf] Технология CSS Grid. Руководство по адаптивной верстке (Денис Булыга)
    [​IMG]


    Автор:
    Денис Булыга

    Что такое верстка:
    Верстка
    - это создание веб-страниц с помощью специальных языков. Верстка — это также интересная, постоянно меняющаяся область деятельности в создании сайтов.
    Это процесс перевода макета сайта, созданного дизайнером в графической программе, в HTML-страницу. При этом используются специальные языки, которые для этого предназначены: HTML, CSS, JavaScript.
    Соответственно, верстальщик — это человек, который занимается кодированием HTML-страницы.
    Верстальщик — это профессия, в которой можно постоянно развиваться, и очень много смежных профессий в веб-разработке неразрывно связаны с версткой.

    CSS Grid – высший пилотаж в верстке:
    CSS Grid
    — это мощная новая технология в верстке. Она позволяет быстро создавать динамические, отзывчивые, современные макеты на чистом CSS. При этом код чище и проще в поддержке, по сравнению с традиционными методами верстки.
    Grid Layout — это новая модель макета, которая обладает мощными способностями контролировать размеры и расположение блоков, а также их содержимого.
    Она представляет собой набор горизонтальных и вертикальных линий, которые образуют сетку, состоящую из рядов и колонок. Технология основана на разделении пространства для макета на столбцы и строки, а также на использовании предсказуемого поведения размеров. Grid позволяет точно позиционировать и масштабировать блоки контента в областях сетки, получаемых при пересечении этих столбцов и строк. Таким образом, получаем очень гибкое поведение верстки при адаптации.

    Возможности CSS Grid:
    Фиксированные и гибкие размеры полос Фиксированные и гибкие размеры полос

    Вы можете создать сетку с фиксированными размерами полос — например, используя пиксели. Вы также можете создать сетку с гибкими размерами, используя проценты или новую единицу измерения — fr, предназначенную для этой цели
    Расположение элемента Расположение элемента
    Вы можете размещать элементы в заданном месте, используя номера строк, имена, или путем привязки к области. Grid также содержит алгоритм управления размещением элементов, не имеющих явной позиции в сетке
    Создание дополнительных полос для хранения контента Создание дополнительных полос для хранения контента
    С Grid вы можете определить явную сетку с макетом, но спецификация также касается контента, размещенного за пределами объявленной области. При необходимости добавляются дополнительные строки и столбцы
    Управление выравниванием Управление выравниванием
    CSS Grid содержит функции, позволяющие точно, легко и интуитивно понятно контролировать, как именно элементы выравниваются после размещения в области сетки, и как выравнивается весь Grid Layout
    Управление перекрывающимся контентомУправление перекрывающимся контентом
    CSS Grid позволяет поместить в одну ячейку сетки более одного элемента. Также области могут частично перекрывать друг друга. Управление перекрывающимся контентом можно удобно контролировать с помощью свойства z-index

    Уроки курса:
    Блок 1. Верстка макета Landing Page (6 часов 36 минут)

    Урок 1. Обзор PSD-макета и готовой верстки Landing Page 4:59
    Урок 2. Экспорт изображений для верстки из Adobe Photoshop CC 2018 7:27
    Урок 3. Установка Node Js, Gulp CLI и инициализация проекта 7:07
    Урок 4. Начало создания автоматизированной сборки при помощи Gulp 4 27:22
    Урок 5. Создание дополнительных задач по автоматизации 19:17
    Урок 6. Подготовка к верстке и детальный обзор проекта 15:55
    Урок 7. Создание HTML-разметки для шапки сайта 7:25
    Урок 8. Полная стилизация шапки сайта 18:52
    Урок 9. Создание разметки для блока баннера 4:58
    Урок 10. Стилизация баннера и написание собственного миксина 22:48
    Урок 11. HTML-структура блока с преимуществами 7:14
    Урок 12. Полная стилизация преимуществ 21:11
    Урок 13. HTML-разметка блока с работами 8:04
    Урок 14. Написание стилей для блока работ 32:53
    Урок 15. Доступность интерактивных элементов и адаптация блока работ 14:05
    Урок 16. Написание структуры для информационного блока 3:37
    Урок 17. Полная стилизация информационного блока 16:15
    Урок 18. Создание разметки для блока скиллов 5:37
    Урок 19. Стилизация блока со скиллами 20:08
    Урок 20. Анимация линий блока прогресса 13:34
    Урок 21. HTML-структура блока новостей 7:51
    Урок 22. Полная стилизация блока с новостями 42:25
    Урок 23. HTML-разметка блока карусели 4:35
    Урок 24. Стилизация карусели и подключение плагина OwlCarousel 30:45
    Урок 25. HTML-разметка блока контактов 7:09
    Урок 26. Полная стилизация блока контактов 20:17
    Урок 27. Полная реализация подвала 4:30

    Блок 2. Верстка главной страницы сайта студии (6 часов 25 минут)
    Урок 1. Обзор макета 3:56
    Урок 2. Экспорт SVG из Adobe Illustrator 2:37
    Урок 3. Подготовка к верстке 6:54
    Урок 4. HTML-разметка шапки сайта 10:21
    Урок 5. Стилизация шапки сайта 33:58
    Урок 6. Адаптив шапки сайта 10:49
    Урок 7. Улучшение типографики 10:42
    Урок 8. Создание разметки для блока меню 3:32
    Урок 9. Стилизация блока меню 25:15
    Урок 10. Доработка меню 13:29
    Урок 11. HTML-разметка блока проектов 19:15
    Урок 12. Стилизация блока проектов. Часть 1 17:09
    Урок 13. Стилизация блока проектов. Часть 2 18:53
    Урок 14. Стилизация блока проектов. Часть 3 44:25
    Урок 15. Адаптация блока проектов 32:22
    Урок 16. HTML-разметка блока студио 16:26
    Урок 17. Стилизация блока студио. Часть 1 23:08
    Урок 18. Стилизация блока студио. Часть 2 12:22
    Урок 19. Адаптация блока студио 19:32
    Урок 20. HTML-разметка блока с новостями 6:47
    Урок 21. Стилизация блока новостей 12:46
    Урок 22. Адаптация блока новостей 8:34
    Урок 23. Разметка подвала 3:13
    Урок 24. Полная стилизация подвала сайта 16:43
    Урок 25. Подключение Google maps 12:16

    Бонусы:
    Бонус 1. Премиум-курс «Учебник по основам HTML для начинающих»
    Бонус 2. Премиум-курс «Учебник по основам CSS для начинающих»
    Бонус 3. Премиум-курс «Верстка сайта для начинающих»
    Бонус 4. Премиум-курс «HTML5. Основы»
    Бонус 5. Премиум-курс «CSS3. Основы»
    Бонус 6. Премиум-курс «Теория и практика адаптивной верстки»
    Бонус 7. Премиум-курс «CSS Grid Layout»
    Бонус 8. Премиум-курс «Flexbox»
    Бонус 9. Премиум-курс «Препроцессор Sass»
    Бонус 10. Мини-курс «Построение сеток при помощи Masonry»

    Доп. бонусы:
    1. Курс «Верстка-Мастер. От теории до верстки популярных шаблонов» стоимостью 7970 руб.
    2. Курс «Веб-дизайнер – профессионал. Создание востребованных макетов» стоимостью 5970 руб.

    Обзор видеокурса:


     
    16 июн 2019
  2. 14 май 2021
    #2
    World
    World Организатор
    Освой Профессию‌ ‌Data‌ ‌Scientist‌ [SkillBox] :victory:
    Вас ждут 8 курсов, онлайн-лекции и практические задания, а также 2 дипломных проекта.
    После обучения вы сможете претендовать на позицию Junior Data Scientist.

    Чему вы научитесь:
    + Программировать на Python
    + Визуализировать данные
    + Разрабатывать интерактивную инфографику
    + Работать с библиотеками и базами данных (Pandas, NumPy и Matplotlib, PostgreSQL, SQLite3, MongoDB)
    + Программировать на R
    + Применять нейронные сети для решения реальных задач
    + Освоите фреймворки для обучения нейронных сетей Tensorflow и Keras
    + Построите рекомендательную систему и добавите её в своё портфолио

    ПОРА ПРОФЕССИЮ МЕЧТЫ ПРЕВРАЩАТЬ В РЕАЛЬНОСТЬ! :girl_witch: https://skladchik.biz/threads/skill...st-valentin-panovskij-aleksandr-panev.233342/
     
    14 май 2021