Импровизированное собеседование на позицию Junior Frontend-разработчика на React: кандидатка отвечает на вопросы по HTML, CSS, TypeScript и React, а интервьюер уточняет и дополняет ответы. Обсуждаются семантическая вёрстка и доступность, Schema.org и Open Graph, Flexbox/Grid, типы, enum, generics, React Hooks, Virtual DOM, state-менеджеры, SSR, фрагменты, HOC и ключи списков. В конце интервьюер положительно оценивает ответы, однако это не является результатом реального найма.
Для интерактивных элементов предпочтительны нативные теги вроде button: иначе придётся вручную воспроизводить клавиатурную навигацию, состояния и доступность.
Семантическая разметка прежде всего помогает доступности, в частности корректной работе screen reader; влияние обычных semantic-тегов на индексирование не следует переоценивать.
Schema.org используют для структурированных данных о продукте, отзыве, авторе и рейтинге; Open Graph — отдельный набор метаданных.
Flexbox удобен для раскладки по одной оси, а CSS Grid — для сеток с колонками и строками.
TypeScript, по мнению участников, особенно полезен в крупных проектах: редактор заранее показывает несоответствия типов и структуру данных API.
Generics позволяют написать одну функцию для разных типов, а ограничение T extends Interface задаёт обязательную форму передаваемых данных.
useEffect управляет побочными эффектами и зависимостями; для подписок следует возвращать cleanup-функцию, вызываемую при размонтировании.
SSR отдаёт уже отрендеренный HTML, после чего клиент гидратирует страницу; это может улучшить первое отображение и снизить объём работы браузера на слабых устройствах.