Скачать 

[ФРОО] Разработка интерфейсов: вёрстка и JavaScript [Артем Кувалдин-Денис Чистяков]

Цена: 195 РУБ
Организатор: Robot
В списке нет видимых участников.
Robot
Robot
Складчик
  • #1

[ФРОО] Разработка интерфейсов: вёрстка и JavaScript [Артем Кувалдин-Денис Чистяков]

Ссылка на картинку

Основы HTML и CSS
HTML и CSS — языки, с помощью которых верстают страницы в интернете. Овладеть основами этих языков совсем нетрудно — это первый шаг к профессии веб-разработчика.
Курс «Основы HTML и CSS» позволит овладеть основами вёрстки веб-страниц, познакомиться с принципами работы внутренних механизмов браузера и способами раскладки элементов на странице. В рамках курса рассматриваются HTML и CSS, а также принципы написания валидного эффективного кода для работы в браузерах. В результате вы освоите способы создания и верстки страниц, которые будут оптимально работать в независимости от браузера и устройства.
JavaScript
JavaScript — единственный язык программирования, который поддерживается всеми браузерами. Его знает любой веб-разработчик. Если вы собираетесь изучать JavaScript, этот курс — отличное начало.
Вы освоите синтаксис JavaScript, его особенности и сложные моменты. Отдельное внимание в курсе мы уделили следующим темам: прототипы, конструкторы, асинхронный код, Node.js и DOM.
Спойлер: Основы HTML и CSS
Неделя 1. Введение в HTML
Первая неделя курса посвящена знакомству с HTML. Вы узнаете, откуда появился этот язык разметки, как он развивается сегодня, из чего состоят HTML-элементы и как разметить ими обычный текст.
Чему я научусь?
  • Понимать структуру HTML-тега и HTML-документа.
  • Разбираться в видах элементов.
  • Задавать атрибут несколькими способами.
  • Работать с комментариями в коде.
  • Понимать, что такое HTML Entity.
  • Узнавать корневые мета-элементы и способы их использования.
  • Работать с Open Graph и его тегами.
  • Группировать контент при помощи элементов.
  • Создавать списки разных типов, нескольких уровней вложенности.
  • Создавать таблицы разной сложности.
  • Описывать разные виды текстов разными видами тегов.
Неделя 2. Введение в HTML, часть 2
На второй неделе мы продолжим изучение HTML. Вы узнаете, что такое семантическая разметка и почему важно соблюдать семантику. Научитесь создавать ссылки в HTML-документе. Вам предстоит попрактиковаться в разметке текста.
Чему я научусь?
  • Описывать код и формулы в тексте.
  • Использовать микроразметку.
  • Создавать ссылки с помощью одного из важнейших элементов в HTML.
  • Разбираться в основных элементах форм. Уметь создавать формы.
  • Использовать ссылки для разных целей.
  • Понимать, для чего используются якоря.
  • Использовать встраиваемые элементы для отображения различного вида содержимого.
  • Разбираться в различных способах написания текстов на разных языках.
Неделя 3. Введение в CSS
Поговорим о том, почему появился CSS и разберёмся в его структуре. Вы научитесь грамотно применять и комбинировать различные типы селекторов (тегов, классов, идентификаторов и атрибутов). Расскажем, что такое псевдоэлементы и псведоклассы, какие они бывают и как с ними работать. Вы разберётесь в том, что такое специфичность, как она высчитывается и как это влияет на порядок применения свойств в CSS.
Чему я научусь?
  • Разбираться, из чего состоит CSS.
  • Уметь грамотно применять и комбинировать различные типы селекторов тегов, классов, идентификаторов и атрибутов.
  • Понимать механизмы работы псевдоэлементов и псевдоклассов.
  • Выбирать способ написания селекторов в зависимости от структуры HTML документа.
  • Понимать, как высчитывается специфичность и как это влияет на порядок применения CSS свойств.
  • Узнать, какие есть единицы измерения в CSS.
  • Уметь увеличивать скорость написания HTML и CSS.
Неделя 4. Шрифты и текст
Четвёртая неделя курса посвящена работе со шрифтами и текстом. Вы узнаете о проблемах, связанных с использованием нестандартных шрифтов и способах их решения. Научитесь управлять выводом шрифтов, применять цвет для текста,создавать интересные эффекты с помощью тени. Узнаете, как реализовать многоколоночную развёртку и как грамотно обходить проблему переполнения текста. Полученных навыков вам хватит, чтобы сверстать собственную газету.
Чему я научусь?
  • Понимать различие между векторными и растровыми шрифтами. Смотреть на шрифты с точки зрения типографики.
  • Изменять размер шрифта.
  • Изменять высоту строки, расстояния между буквам и словами.
  • Понимать разницу между начертаниями и их обработкой браузером. Уметь устанавливать их с помощью CSS. Разбираться в общепринятой классификации шрифтов в веб и их аналогами в типографике. Уметь управлять семейством шрифтов с помощью CSS.
  • Использовать основные свойства для работы с текстом.
  • Понимать, что такое цвет переднего плана, применять цвет и устанавливать тень для текста.
  • Реализовывать многоколоночную развертку, обходить проблему переполнения текста.
  • Понимать нюансы расстановки переносов строк внутри слов и пробелов.
  • Применять псевдоэлементы, относящиеся к тексту.
Неделя 5. Анимации в CSS
На пятой неделе вы узнаете про основные виды трансформаций и научитесь создавать анимации только при помощи CSS. Попрактикуетесь в создании анимаций разных уровней сложности.
Чему я научусь?
  • Разбираться в популярных видах анимаций, которые используются в веб-программировании.
  • Понимать, как работают основные преобразования.
  • Применять множественные преобразования.
  • Разбираться, как работают преобразования в трёхмерном пространстве.
  • Делать плавный переход от одного набора свойств к другому.
Неделя 6. Модель отображения, боксы, отступы, границы
На шестой неделе курса вы увидите, что всё есть прямоугольники. Разберётесь с ключевыми понятиями отображения элементов на странице: боксы, отступы, границы. В конце недели вам предстоит сверстать макет необычного интернет-магазина.
Чему я научусь?
  • Понимать, что такое внутренние, внешние отступы и граница.
  • Разбираться, как работают боксы блочного уровня, как высчитываются их размеры и положение, как их изменять.
  • Понимать, что такое визуальная модель форматирования и что влияет на положение бокса.
  • Задавать геометрию на основе информации об особенностях работы процентных значений различных свойств.
  • Разбираться в особенностях математики блочных элементов.
  • Пользоваться боксами инлайн-уровня.
  • Различать инлайновые и инлайн-блочные элементы.
Неделя 7. Модель отображения, позиционирование, порядок наложения, плавающий поток
Позиционированием называется положение элемента в системе координат. Различают четыре типа позиционирования: нормальное, абсолютное, фиксированное и относительное — от них зависит и система координат. На этой неделе вы познакомитесь со всеми типами и научитесь выбирать подходящий для ваших задач.
Чему я научусь?
  • Знать, что такое относительное позионирование элементов.
  • Знать, что такое абсолютное позицонирование. Чем отличается от относительного и как применяется на практике.
  • Знать, что такое фиксированное позиционирование. Знать о нововведениях в спецификации относительной модели позионирования, понимать, что за ними нужно следить.
  • Знать, по каким правилам элементы накладываются друг на друга.
  • Уметь грамотно применять правила, по которым элементы накладываются друг на друга.
  • Понимать, как окружающие элементы взаимодействуют с плавающими элементами.
Неделя 8. Модель отображения, раскладка страниц
Поговорим Flexbox и Grid — современных инструментах для вёрстки макетов. Оба инструмента хороши по-своему и должны использоваться совместно, а не как альтернатива друг другу. В конце недели будет ещё одно практическое задание: вы добавите к магазину красивую витрину.
Чему я научусь?
  • Понимать, какие есть способы создания раскладки страницы с использованием уже известных элементов.
  • Работать с Flexbox и Grid.
  • Создавать раскладку страницы с использованием Flexbox и Grid.
  • Познакомиться со спецификацией Grid, ее особенностями и свойствами.
  • Понимать уместность использования той или иной спецификации в различных ситуациях.
Неделя 9. Браузеры
Девятая неделя посвящена браузерам: вы узнаете об их базовой архитектуре, познакомитесь с устройством движка рендеринга браузера, разберётесь, как браузеры применяют CSS и HTML.
Чему я научусь?
  • Понимать базовую архитектуру браузера.
  • Разбираться с устройством сетевого модуля браузера идвижка рендеринга.
  • Понимать, как устроен анализ HTML и CSS документов и по каким правилам байты превращаются в DOM и CSSOM.
  • Понимать, как происходит формирование render tree и как браузеры применяют CSS.
  • Разбираться, как браузеры рассчитывают геометрию страницы.
  • Понимать, как изменения различных CSS свойств влияют на компоновку страницы.
  • Разбираться, как происходит отрисовка страницы.
  • Понимать особенности исполнения скриптов при анализе документа.
Неделя 10. Фотошоп и графика
Вы научитесь работать с изображениями и графикой. Узнаете о цветовых моделях, форматах изображений в вебе и способах их оптимизации. Итоговая практическая работа — сверстать с нуля макет.
Чему я научусь?
  • Разбираться в какие видах графических изображений, которые используются в веб.
  • Использовать основные цветовые модели в разработке.
  • Знать про растровый и векторный форматы изображений, про их особенности.
  • Понимать, в каких случаях лучше использовать растровый или векторный форматы изображений.
  • Отличать два основных вида оптимизации изображений.
  • Применять соответствующие инструменты для оптимизации изображений.
  • Использовать основные инструменты при работе с макетом.
  • Вставлять изображения при помощи HTML и CSS.
  • Создавать градиентные переходы цветов в CSS.
  • Применять спрайты.
Спойлер: JavaScript
Неделя 1. Основы языка JavaScript
Вы узнаете о предпосылках появления JavaScript и его истории, ознакомитесь с основными типами данных. Настроите окружение и напишите ваши первые программы.
Чему я научусь?
  • Понимать причинно-следственные связи существования языковых конструкций в JavaScript.
  • Разбираться в переменных и константах и правилах/соглашениях их именования.
  • Понимать основные типы данных. Читать, понимать и писать элементарные программы на языке JavaScript.
  • Использовать несколько видов комментариев, понимать различия между ними.
  • Применять арифметические и логические операторы языка, понимать их приоритеты. Рационально использовать несколько видов условных операторов.
  • Понимать, что такое строгий режим и режим совместимости, и использовать его.
  • Запускать код на JavaScript в браузере и с помощью Node.js.
Неделя 2. Типы данных
На этой неделе вы продолжите изучать типы данных, поговорим о более сложных — строках, массивах, объектах, функциях. В лекциях мы постарались продемонстрировать теорию на примерах и подготовили три задачи, которые помогут закрепить изученный материал.
Чему я научусь?
  • Использовать несколько способов объявления строк, работать с их методами.
  • Разбираться в способах объявления массивов и уметь итерироваться по массиву.
  • Создавать и изменять объекты. Итерироваться по ключам объекта, использовать его методы.
  • Понимать, как передавать функции в качестве аргумента.
Неделя 3. Типы данных. Продолжение
На третьей неделе курса рассмотрим нюансы работы с объектами. Познакомимся с обработкой исключений: реакцией программы на возможные проблемы, которые приводят к невозможности или бессмысленности дальнейшей работы вашей программы. В конце недели — очередная задача, с которой вы научитесь организовывать цепочки вызовов функций в JavaScript.
Чему я научусь?
  • Использовать свойства через методы объекта.
  • Отлавливать неконтролируемые исключения.
  • Понимать устройство работы try...catch.
  • Использовать операторы эквивалентности и сравнения, операторы взятия значения, приведения к строке.
  • Работать с оператором объявления полей объекта и его свойствами.
  • Использовать встроенные объекты Data и Math.
  • Понимать способы объявления регулярных выражений в языке JavaScript.
  • Производить поиск и замену по регулярным выражениям.
Неделя 4. Функции
JavaScript — выразительный язык, который имеет свои особенности. Работа с функциями, такие понятия как всплытие и замыкание переменных зачастую приводят в замешательство новичков. На этой неделе разберемся с этими тонкостями. А в качестве практической задачи вас ждет работа с коллекцией однотипных объектов.
Чему я научусь?
  • Производить рекурсивный вызов.
  • Понимать особенности и недостатки нескольких способов работы с аргументами.
  • Работать со свойством функции arguments.
  • Объявлять функции несколькими способами.
  • Создавать области видимости с помощью функций.
  • Понимать механизм всплытия переменных.
  • Уметь создавать модули.
  • Понимать механизм замыкания.
Неделя 5. Контекст исполнения
С понятием контекста исполнения в JavaScript связано ключевое слово this. Это мощный инструмент, но разобраться в нем непросто. Заключительная неделя курса будет интересна не только новичкам, но и программистам, которые хотят освежить этот аспект в памяти. В качестве практического задания — создание библиотеки, позволяющей подписываться на события и получать по ним уведомления.
Чему я научусь?
  • Понимать сходства и различия this в разных языках программирования.
  • Понимать, чему будет равен this на различных участках кода.
  • Понимать, чему будет равен this в зависимости от того, как вызван код: вызов функции, вызов метода, заимствование метода, конструктор.
  • Изменять контекст использования методов функций call, bind, apply.
  • Использовать замыкания для сохранения текстов.
  • Понимать влияние строгого режима на контекст исполнения.
  • Разбираться, как определяется контекст при использовании оператора eval.
Неделя 6. Прототипы
Чему я научусь?
  • Понимать, как работает механизм прототипов в языке и какие задачи он решает.
  • Разбираться в прототипах по умолчанию для объектов разных типов в языке.
  • Связывать объекты с прототипами тремя разными способами. Понимать преимущества и недостатки каждого из них.
  • Понимать, как работают поля, помеченные как неизменяемые в прототипах.
  • Понимать, как работают сеттеры и геттеры в прототипах.
Неделя 7. Конструкторы
Чему я научусь?
  • Создавать конструкторы объектов.
  • Создавать объекты при помощи конструкторов.
  • Автоматически привязывать прототипы к создаваемым объектам.
  • Автоматически встраивать объекты в цепочки прототипов при создании.
  • Инспектировать связи между объектами и прототипами, используя методы isPrototypeOf и getPrototypeOf.
  • Инспектировать связи между объектами и конструкторами, используя оператор instanceof.
  • Создавать объекты при помощи метода create.
  • Создавать простые «классы» и конструировать объекты с их помощью.
Неделя 8. Асинхронный код
Чему я научусь?
  • Разбираться, что такое очередь событий и стек вызовов в JavaScript.
  • Понимать, как системные таймеры взаимодействуют с очередью событий.
  • Понимать, что такое блокирующие операции и как ведет себя асинхронный код с блокирующими операциями.
  • Использовать функции setInterval и setTimeout по назначению.
  • Работать с файловыми системами через синхронные и асинхронные функции.
  • Разбираться в способах организации асинхронного года. Понимать их достоинства и недостатки.
  • Объявлять и применять промисы.
  • Объединять несколько промисов в цепочку.
Неделя 9. Node.js
Чему я научусь?
  • Понимать в общих чертах как устроена платформа Node.js.
  • Понимать, что такое модуль в контексте платформы.
  • Создавать простой модуль.
  • Использовать пакетный менеджер npm для установки зависимостей.
  • Писать файл-манифест package.json к модулю для фиксирования зависимостей.
  • Создавать простой http-сервер.
  • Создавать простой http-клиент.
  • Работать с файлами.
Неделя 10. DOM
Чему я научусь?
  • Понимать, что такое DOM.
  • Искать элементы DOM дерева и осуществлять обход по ним.
  • Управлять атрибутами и свойствами элементов.
 
Зарегистрируйтесь , чтобы посмотреть скрытый авторский контент.
Похожие складчины

Войдите или зарегистрируйтесь, чтобы комментировать и скачивать складчины!

Учетная запись позволит вам участвовать в складчинах и оставлять комментарии

Регистрация

Создайте аккаунт на форуме. Это не сложно!

Вход

Вы уже зарегистрированы? Войдите.

Сверху