22 видеолекции по разработке интерфейсов
Недавно мы рассказывали о летних школах Академии Яндекса и делились записями лекций Школы бэкенд-разработки. Сегодня мы подготовили для вас материалы Школы разработки интерфейсов. Курс рассказывает о возможностях современных инструментов разработки, асинхронном программировании в JavaScript, создании приложений на Node.js и React, работе в Git, типизации, локализации и многом другом.
1. Git — инструмент для совместной работы
Вы познакомитесь с Git изнутри и научитесь использовать его для работы в команде: разберёте механизм ветвления, способы объединения веток, а также правила исправления ошибок и написания регламентов.
Первая часть лекции посвящена организации процесса разработки в популярных IDE (WebStorm, VS Code) и в терминале, а вторая — браузерным инструментам разработчика (Chrome DevTools).
Подробный урок по асинхронному программированию в JavaScript, из которого вы узнаете, как бороться с callback hell, как настраивать циклы событий и очереди задач, как использовать функции async/await и применять debounce и throttle для оптимизации.
Разберёмся с основными концепциями библиотеки RxJS: рассмотрим различия promise и observable, изучим несколько популярных хелперов и операторов, а также поговорим о способах планирования задач.
Вы с нуля напишете приложение на Node.js: познакомитесь с инфраструктурой для разработки, научитесь применять различные подходы к работе с данными и рендерингу приложений, а также разберётесь с логами, безопасностью и протоколом WebSocket.
Дополнительные материалы:
— Теория из прошлогоднего курса
Вводная лекция по React. Разберёмся, зачем он нужен и как с ним работать.
7. Архитектура React-приложения
Какие проблемы возникают с ростом приложения и как React помогает их решать?
Поговорим об архитектурных паттернах: обсудим различия между подходами MVC и Flux, а также детально рассмотрим Redux — самую популярную реализацию Flux.
Как организовать процесс сборки веб-приложений? За какими метриками следить, чтобы команде и пользователям было комфортно? Можно ли использовать подход к настройке параметров ML-модели для улучшения процесса сборки?
Вы узнаете об архитектурном устройстве webpack и познакомитесь со стандартными техниками сборки: chunk splitting, innerGraph tree shaking, dynamic imports, minimizers, deadcode elimination и module concatenation.
9. Автотесты и модульное тестирование
Сначала поговорим об автотестах, а потом подробно разберём модульное тестирование. Вы узнаете, как изолировать внешние зависимости и тестировать взаимодействие с другими модулями, познакомитесь с эффективными приёмами для написания и поддержки тестов, а также попробуете запустить тестирование приложения на React.
10. Интеграционное тестирование
В первой части лекции разберём, что такое интеграционное тестирование, чем оно отличается от модульного и зачем запускать несколько видов тестов в одном проекте.
Во второй части поговорим об автоматизации интеграционных сценариев: научимся настраивать инфраструктуру и рассмотрим инструмент для написания автотестов, используемый в Яндексе.
11. Клиентская оптимизация — метрики
Обсудим виды метрик, способы их сбора и анализа, а также научимся использовать собранные данные для проведения экспериментов по оптимизации скорости загрузки страниц и для оценки результатов.
Поговорим о том, что такое производительность веб-страниц и от чего она зависит. Обсудим основные показатели и инструменты для их мониторинга, а также рассмотрим различные подходы к оптимизации скорости загрузки.
Что такое типизация и для чего она используется в современном вебе? Обсудим общие концепции, особенности устройства TypeScript, типизацию структур, контроль над типами и дженерики. Вы научитесь применять типизацию «в бою»: в практической части проведём миграцию проекта с JavaScript.
14. Функциональное программирование в мире JavaScript
Разберёмся в функциональном программировании: конвейер, композиция, частичное применение, каррирование, неизменяемые данные и чистые функции.
Дополнительные материалы:
15. Практикум по функциональному программированию
Продолжаем тему функционального программирования: на примере простого парсера url учимся писать код в функциональном стиле с использованием библиотеки Ramda.js и практикуемся в каррировании и частичном применении функции.
Пришло время изучить сложные темы в JavaScript. Поговорим о преобразовании типов, метапрограммировании, прототипном наследовании, контексте, возможностях коллекций, итераторах, генераторах и модулях.
Лекция по основам безопасности для разработчиков веб-приложений: рассмотрим уязвимости на сервере и клиенте, а также механизмы защиты от них. Большинство сценариев рассчитано на JavaScript-приложения.
Лекция о мультимедиа-возможностях, доступных в вебе. Научимся создавать графические эффекты и анимацию при помощи CSS, JavaScript, SVG, Canvas и WebGL, познакомимся с аудиотегом и Web Audio API для работы со звуком, разберём актуальные видеоформаты и адаптивные потоковые видеотрансляции, а также рассмотрим API браузера для синтеза и распознавания речи.
19. Работа с сенсорным пользовательским вводом
Обсудим работу с сенсорными событиями в браузере и используемые для этого API. Расскажем, почему есть две актуальные спецификации и рассмотрим их различия, сильные и слабые стороны.
Почему важна доступность интерфейсов и как её добиться? Обсудим принципы, лежащие в основе ассистивных технологий, и основные приёмы, которые делают интерфейс доступным, а также разберём примеры и продемонстрируем процесс работы скринридера.
Вводная лекция по локализации: что такое локаль, как её определить и как работает встроенный API интернационализации. В конце лекции напишем простое ядро i18n.
Дополнительные материалы:
— Работа с мультиязычным контентом
— Логические свойства и значения CSS
Практический урок по локализации: разберём, как параллельная разработка влияет на процесс локализации, и поговорим об автоматизации и других способах эффективной работы с переводами.
Школа разработки интерфейсов — это лекции, семинары и практикумы по созданию удобных, быстрых и надёжных интерфейсов. Занятия ведут сотрудники Яндекса, которые каждый день работают над сервисами с многомиллионной аудиторией. Во время обучения участники не только изучают теорию, но и работают над индивидуальными проектами под руководством куратора.