Skip to content

Тестовое задание на позицию Front-End разработчика в KazanExpress; TODO-приложение, возведённое в абсолют.

Notifications You must be signed in to change notification settings

ildar-dev/frontend-test-task

 
 

Repository files navigation

Look at me

Easy

  • Каждая новая вкладка в бразуере с приложением - отдельный проект со своим списком задач;
    Система переключения проектов в пределах одной вкладки считается нарушением этого требования!
  • Редактируемое название проекта в качестве заголовка страницы;
  • Список с задачами:
    • Добавление новой задачи в список;
    • Удаление любой задачи из списка;
    • Возможность пометить любую задачу сделанной и возможность убрать эту пометку (mark as done/not done);
  • Вся информация (название проекта, список задач, состояние задач) должна сохраняться при перезагрузке страницы;

Опционально:

  • Возможность добавлять подзадачи в любую задачу (с потенциально бесконечной глубиной);
  • Поле ввода для поиска/фильтрации задач в списке (фильтр должен сохраняться после перезагрузки страницы);
  • Возможность редактирования названия задачи после её создания;

Medium

Все требования easy, включая опциональные. А также:

  • Возможность перемещать любые задачи (со всем списком подзадач) из любого открытого проекта в любой другой открытый проект; - используя copy, cut, paste
  • Нельзя использовать LocalStorage, Cookies, IndexedDB и WebSQL хранилища;
    Если ваше приложение пишет хоть что-нибудь в одно из этих хранилищ - требование считается невыполненным!
    Это касается и библиотек, которые используют эти типы хранилищ: например - vuex-multi-tab-state.
  • Экспорт проекта в файл / импорт проекта из файла;
  • Имя сохраняемого файла должно соответствовать названию проекта.
  • Drag-n-drop для перемещения задач в списке;
  • Сохранение текущего фильтра для возможности его быстрого применения потом;
  • Итоговое приложение должно весить не более 200 KB (сумма всех загружаемых файлов, исключая картинки);

Опционально:

  • Наличие CSS-анимаций для drag-n-drop и фильтрации задач;
  • Использовать TypeScript для 100% кодовой базы (исключая вёрстку и стили);
  • Использовать Vue Composition API или vue@next;
  • Использовать ESLint/TSLint для контроля качества кода (приветствуется использование настройки KazanExpress/TSLint);
  • Использовать сборщик/бандлер (например, webpack) для сборки приложения в SPA;

Hard

Все требования medium, включая опциональные, а также:

  • Итоговое приложение должно весить не более 100 KB (сумма всех загружаемых файлов, исключая картинки); - 59.95 KB if gzip
  • Drag-n-drop с поддержкой тач-скрина; - протестировано нa iphone(latest ios)
  • Масштабируемость на мобильные устройства до 320*480px (iPhone 4);
  • Возможность быстрого просмотра и редактирования описания у любой задачи;

Опционально:

  • SSR;
  • PWA;
  • Опция фильтрации задач по RegExp;
  • Возможность добавлять/удалять именованные списки для задач, между которыми их можно перетаскивать (как в trello);

Insane

Все требования hard, включая опциональные, а также:

  • Нельзя использовать Vue.js или любые другие фреймворки/библиотеки для клиентской части - только нативный JavaScript/TypeScript;
    В том числе:
    • Для реактивности/биндинга данных;
    • Для внесения изменений в DOM;
    • Для бизнес-логики;
    • Да, jQuery/React/Lodash/Underscore/Bootstrap тоже нельзя!
  • Документация на JSDoc, по всем стандартам;
  • Итоговое приложение должно весить не более 50 KB (сумма всех загружаемых файлов, исключая картинки);
  • Итоговый скомпилированный проект должен работать на нативных ES6-модулях с помощью <script type="module">;
  • Наличие Source-Maps для итогового приложения и инструкции по их включению;
  • Полный набор горячих клавиш для каждого действия в приложении - создание/удаление/редактирование тасок/проектов, экспорт/импорт и прочее;
    (Обязательна инструкция со списком всех горячих клавиш.)
  • Оценка качества кода "A" на Code Climate;

Опционально:

  • Использовать Conventional Commitlint;
  • Использовать CustomElements/WebComponents и Shadow DOM;
  • 100% test coverage с использованием Jest/Mocha и Coveralls/Code Climate;
  • Использовать travis.ci, now.sh, GitHub Pages или GitHub Actions для CI/CD; - my page
  • Использовать Service-Worker для уведомления пользователя о новых версиях;
  • Взаимоисключающие пункты:
    • SSR без использования сторонних библиотек;
    • Отсутствие SSR и отсутствие бандлера (webpack, rollup, etc.), node_modules и прочего - т.е. нельзя использовать никакие библиотеки (кроме TypeScript) для обработки кода;

About

Тестовое задание на позицию Front-End разработчика в KazanExpress; TODO-приложение, возведённое в абсолют.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Vue 56.7%
  • CSS 19.9%
  • JavaScript 19.4%
  • HTML 3.7%
  • Shell 0.3%