cmtt-ru / vacancy-frontend

Тестовое задание на позицию Frontend Engineer

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Вакансия Frontend Engineer

Описание вакансии

Требования

  • Опыт веб-разработки
  • Знание HTML, CSS, JavaScript, Vue
  • Знание фундаментальных основ клиент-серверного взаимодействия
  • Знание паттернов проектирования
  • Понимание принципов и задач ООП
  • Умение оптимизировать производительность
  • Опыт продвинутой настройки Webpack
  • Умение писать красивый и задокументированный код

Будет плюсом

  • Понимание работы SSR, CSR, (Re)Hydration, Prerendering, Isomorphic/Trisomorphic Rendering
  • Опыт работы с Service Workers, Shared Workers
  • Понимание принципов оптимизации Time to Interactive, Time to First Byte, First Paint, First Contentful Paint, First Input Delay, Estimated Input Latency
  • Знания в области безопасности, понимание принципов CORS, CSP, STS, CSRF
  • Знание TypeScript
  • Опыт написания Unit и End-to-end тестов
  • Опыт работы со Storybook
  • Контрибуции в Open-source проекты, активность на GitHub

Задачи

  • Разработка frontend-части нашей платформы, на которой работают vc.ru , dtf.ru, tjournal.ru
  • Создание и поддержка компонентов дизайн-системы
  • Оптимизация производительности модулей платформы

Условия

  • Работа в голодной до сложных задач команде
  • Разумное и мягкое отношение к понятию «рабочий график»
  • Удалённая работа
  • Испытательный срок — три месяца
  • Нужно будет пройти тестовое задание

Дополнительно

  • Присылайте, пожалуйста, ссылки на ваши GitHub-профили, если хочется что-то показать
  • Мы готовы рассматривать студентов и начинающих веб-разработчиков на позицию Intern и Junior Frontend Developer
  • Студентам предоставляется гибкий график и возможность совмещения с учебой

Перейти к вакансии

Тестовое задание

Задача

Разработать приложение-фреймворк для создания административных страниц.

Требования

  • Приложение должно быть написано на Vue
  • Для сборки приложения нужно использовать Webpack
  • Нельзя использовать vue-cli, сборку настраиваем вручную
  • Верстаем по макету, стремимся сделать pixel-perfect, уделяем внимание мелочам
  • Уделяем внимание структуре приложения, разделению на абстрактные части
  • Само приложение представляет из себя общий лэйаут админки + набор компонентов, из которых можно собирать страницы.
  • Примеры компонентов: таблица, кнопка, поле поиска
  • Содержание меню и содержание страниц должно задаваться каким-то конфигом. То есть в этом конфиге описана структура меню + для каждой страницы указан список блоков с их данными (например таблица с такими-то данными + кнопка с таким-то текстом и ссылкой)
  • Все методы, аргументы, свойства, переменные, возвращаемые значения, типы и основные логические моменты должны быть продокументированы в формате jsdoc
  • Иконки можно взять с https://feathericons.com
  • Для стилей можно использовать PostCSS

Бонусные пункты

  • Адаптировать верстку под мобилки
  • Использовать TypeScript (через Vue.extend)
  • Настроить проверку синтаксиса с помощью ESlint

Как оформить результат

  • Выложить полученный код в отдельный репозиторий GitHub
  • Захостить решение на GitHub Pages, чтобы был доступ к тестированию

Примечания

  • Макеты сделаны в размере x2
  • Верстаем по картинке
  • Шрифт Roboto

Макеты

Главный экран, меню, пример страницы с блоком "Таблица"

Поповеры

Функциональность кнопок внутри выпадающих меню и у кнопки "Добавить пользователя" реализовывать не нужно. Главное, чтобы обработчики задавались конфигом.

About

Тестовое задание на позицию Frontend Engineer