Look at the Nuxt 3 documentation to learn more.
Цель данного задания — узнать уровень подготовки Frontend разработчика, а также умение выполнять недостающие части задания самостоятельно.
Архитектура, дизайн и дополнительные библиотеки по желанию разработчика.
- Создать новый проект на vue.js + включить в него бибилиотеку Vuetify.js
- Проект представляет собой главный экран, где показан якобы личный кабинет пользователя с ключевой информацией: название магазина, выбранный город, сегодняшняя дата, общее кол-во товаров и тд.
- Использовать готовые компоненты UI от Vuetify
- Данные о компании должны быть динамически подгружены с backend сервера по адресу https://bitbucket.org/ilakhmotkin/front-end-assesment-ru/raw/09c0e12a2b5325e71f36c08e7e29dc8eefbdb081/company-response.json
- Где-то на экране должна быть кнопка "Выбрать город"
- При нажатии на кнопку нужно показать список городов и текущий выбранный город.
- Список городов запрашивать с сервера динамически по адресу https://bitbucket.org/ilakhmotkin/front-end-assesment-ru/raw/7bc28b7ede222e25fe44fec52ad1e74a03168501/cities-response.json
- При выборе города из списка — нужно поменять выбранный город на главном экране.
- name - Название магазина, может быть разной длины
- status - статус товаров магазина
- today - сегодняшняя дата
- totalProducts - общее количество товаров
- availableProducts - товар в наличии
- nonAvailableProducts - товар без наличия
- cities - массив с городами
- name - название города
- code - код города
- Разработчик должен уделить внимание дизайну и аккуратной верстке с использованием сетки, row, flex и тд (Пример для вдохновения)
- Должен быть порядок в .vue, .js, .css/.sass файлах
- Учитывая что работа на Vue.js, нужно использовать компоненты для всего где уместно
- Обработка ошибок будет плюсом
- Понятные commit сообщения в гите на английском будет плюсом
- Мутация данных и манипуляция данных должна происходить в state, компоненты должны содержать минимум бизнес логики
- Использование mixin, vuex, mapgetters, mutations, actions будет плюсом
- В логике по сохранению выбранного города привязываться не к названию города, а к коду, т.к. название динамически может меняться на сервере
- Дату показать в удобном для чтения формате во временном поясе Алматы
- Чтобы не усложнять проект, время на выполнение 1 день.
Выполненное задание должно состоять из Vue.js проекта, чтобы можно было запустить одной командой npm install && npm serve.
Готовую работу можно запушить на публичный bitbucket/github репозиторий (желательно) или прислать в виде zip (нежелательно).
Разработчик в праве распоряжаться своим кодом, поэтому можно указать любую лицензию по усмотрению. Так как репозиторий публичный, этот код никак не может быть нами использован. Результат выполнения данной задачи свободно разрешается демонстрировать другим компаниям.