Фронтенд-разработка

Front-End Development

Что охватывает

Фронтенд-разработка — это работа над той частью приложения, к которой прикасается человек: документом, его оформлением, его поведением и конвейером, который всё это доставляет. Сюда попадают языки платформы, фреймворк, из которого вы их собираете, и два качества, от которых зависит, удобен ли результат, — доступность и скорость. Обычно эту область описывают через инструменты, которые меняются, а не через эти слои, которые не меняются.

Почему это важно

Здесь становится видимым любое продуктовое решение, и здесь же у результата самая широкая аудитория толкователей: браузер рисует страницу одному человеку, скринридер описывает её другому, поисковый робот индексирует для третьего. Если разметка и доставка сделаны правильно, они служат всем сразу. Именно поэтому основы, о которых здесь речь, переживают любой фреймворк.

Входящие навыки

  • Каскадные таблицы стилей (CSS) (02-frontend/05-css) — каскад, блочная модель и системы раскладки.
  • JavaScript (02-frontend/06-javascript) — язык, который заставляет страницу отвечать на действия.
  • React (02-frontend/29-react) — один из распространённых способов собрать приложение из компонентов.
  • Доступность (WCAG / a11y) (02-frontend/11-accessibility-wcag-a11y) — сделать результат пригодным для работы с клавиатуры и со вспомогательными технологиями.
  • Веб-производительность (Core Web Vitals) (02-frontend/26-web-performance-core-web-vitals) — измеряемый опыт страницы, пока она загружается и отвечает на действия.

С чего начать

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