Найти тему
HTML Academy

Акселератор HTML Academy: первый опыт после обучения веб-разработке

Кадр из мультсериала "Футурама"
Кадр из мультсериала "Футурама"

При поиске работы шансы получить хорошую должность увеличиваются, если у вас есть опыт. Работодатель охотнее возьмёт того, кто не только знает теорию, но и уже выполнял реальные задачи. Поэтому при обучении студентов HTML Academy отводит особую роль практике, ведь нам важно подготовить людей к реальной разработке по максимуму. Так, освоение профессий фронтенд- и React-разработчика делится на два этапа: обучение и производство.

Производственный этап

Производство — это практика, которая состоит из трёх ступеней.

Сначала студенты проходят грейдирование . Их задача — самостоятельно выполнить проект в соответствии с критериями , применяя знания, полученные при обучении. Эта ступень помогает студентам оценить уровень своих навыков и узнать, что можно улучшить.

На основе грейдирования студенты попадают в Акселератор . Здесь они учатся взаимодействовать в команде, прокачивают навыки и скорость работы.

После Акселератора начинается стажировка во фронтенд-аутсорсе «Лига А.» , где студенты-стажёры работают уже над коммерческими проектами от настоящих заказчиков за деньги. По завершении этой стадии обучение профессии заканчивается — и выпускники становятся разработчиками.

В этой статье мы подробно разберём практику в Акселераторе.

Как устроен Акселератор

Студенты попадают в Акселератор после грейдирования. Здесь их ждёт командная работа над тремя проектами.

Перед каждым проектом студент получает техническое задание, макет и срок, к которому проект должен быть готов. Завершить проект нужно вовремя, в соответствии с критериями, ориентируясь на замечания наставника и тестировщика.

Команда

Рабочий процесс максимально приближен к реальным условиям. Поэтому студент действует в команде с менеджером, наставником и тестировщиком.

Менеджер контролирует общий ход работы. Он следит за дедлайнами и напоминает о них, а ещё помогает разобраться в документации. Наставник отвечает за техническую часть и проводит итоговую проверку проекта. К нему можно обратиться, если возникают вопросы по выполнению конкретных задач. Тестировщик внимательно испытывает всё, что сделано, и готовит список исправлений.

Менеджер Соня проверяет, что со сроками всё в порядке.
Менеджер Соня проверяет, что со сроками всё в порядке.

Работа над проектом

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

Рабочий чат команды в Slack
Рабочий чат команды в Slack

Чтобы процесс работы был более наглядным, команда использует план, прописанный в карточке проекта. В плане видны видны сроки завершения каждой фазы проекта. Поэтому всем участникам команды всегда понятно, в каком темпе движется рабочий процесс. Такой график позволяет студенту проще планировать время и распределять нагрузку.

План работы в карточке проекта
План работы в карточке проекта

Код-ревью

Дедлайн проекта рассчитан из эталонной скорости младших разработчиков в «Лиге А.» — к этой скорости нужно стремиться, чтобы успешно работать на коммерческих проектах.

Когда проект готов, наставник проверяет код по всем критериям. Если критерий не выполнен, наставник делает об этом памятку в карточке проекта, добавляет комментарий и при необходимости скрин ошибки. После проверки студент приступает к отработке замечаний.

Замечания наставника в карточке проекта
Замечания наставника в карточке проекта

Тестирование

Проект проверяют на выделенном тестовом сервере, чтобы процесс не отличался от тех, которые есть в реальной работе.

В первую очередь тестировщик проверяет соответствие проекта макету и уточняет у менеджера моменты, которые были отражены на макете, но не зафиксированы в техническом задании. Например, на макете отрисована кнопка «Получить консультацию», при этом в техническом задании она не упоминается.

Слава нашёл несоответствия в макете
Слава нашёл несоответствия в макете

Мы испытываем проекты на всех устройствах, операционных системах и браузерах. Добиваемся того, чтобы сайт везде отображался одинаково, вне зависимости от окружения (например, Safari в iOS живёт своей жизнью с закруглением полей у форм по умолчанию). Проверяем «резиновость» вёрстки — на промежуточных разрешениях сетка не должна ломаться, а пропорции отрисованной версии не должны меняться.

Каждый интерактивный элемент на странице должен выделяться при наведении. Это важно для взаимодействия пользователя с сайтом, но новички часто об этом забывают.

Важно также проверить показатели доступности, SЕО и производительности — убедиться, что сайт быстрый и удобный для каждого пользователя, вне зависимости от его физических возможностей. Если условный заказчик проекта решит изменить текст в блоках, добавить кнопки или вставить ещё пару фотографий в слайдер, проекты тестируются и на переполнение — добавление новых элементов не должно ломать сетку.

Насколько это возможно, проверяем работу JavaScript, стремимся, чтобы валидация форм работала и помогала пользователю в работе над сайтом.

Замечания тестировщика в карточке проекта
Замечания тестировщика в карточке проекта

Критерии оценки проектов

В Акселераторе мы оцениваем студентов по следующим показателям:

  • Общий балл за проект при сдаче на первую проверку. За выполнение каждого критерия студент получает соответствующее количество баллов. Максимальная сумма баллов, которую можно набрать, — 100 баллов.
  • Скорость работы в часах и днях при окончательной сдаче проекта (в тот момент, когда проект готов и исправлены все замечания от наставника и тестировщика). Дальше скорость переводится в проценты — относительно эталонной скорости младшего разработчика в «Лиге А.» Например, если проект сдан без проволочек, скорость составляет 100%. Если срок сдачи превышен в 1,5 раза, скорость студента равна 75%. При превышении срока в 2 раза, скорость равна 50%.

Эффективность Акселератора

Одна из основных задач Акселератора — увеличить скорость работы студента. Проанализировав результаты наших студентов, мы получили вот такую картину.

С каждым новым проектом в Акселераторе скорость работы студента возрастает
С каждым новым проектом в Акселераторе скорость работы студента возрастает

Если первый проект студенты делают в среднем на 42% медленнее эталона, то при работе над третьим проектом их скорость увеличивается почти в 2 раза.

Студенты совершают меньше ошибок, учатся анализировать свою работу и самостоятельно тестировать проекты. Таким образом, Акселератор позволяет людям, которые только что прошли обучение на фронтенд- или React-разработчика , набить руку на своих первых проектах. А затем они могут отправляться на оплачиваемую стажировку в «Лигу А.»

Одно лишь теоретическое обучение без связки с практикой ничего не даёт. Поэтому производственный этап необходим для закрепления знаний и отработки навыков. После прохождения грейдирования, Акселератора и «Лиги А.» выпускники, уже имея опыт командной работы с коммерческими проектами и кейсы в портфолио, успешно трудоустраиваются .

Чтобы понять, насколько вам подходит программирование, начните с бесплатных тренажеров HTML Academy.

Они позволят познакомиться с профессией в игровой и доступной форме.

Если процесс понравится, можно переходить к полноценному курсу.