Тестовое задание компании Paraweb

Результат выполнения:

Просмотр

Используемый стек:

• HTML5
• SCSS
• Vite
• Vue.js
• Vanilla JS
• Vuex (pinia)
• Swiper
• Vue-select
• Moment
• Axios
• Vue-datepicker

---

Задание:

Кроссбраузерная и семантическая верстка по макету

Техническое задание:

Предпочтительный стек: HTML5 + SCSS + Vanilla JS, при желании можно использовать фреймворк.

Макет: https://www.figma.com/file/06yGqefmmaDyMTsEcbJiBH/Test-task-for-Junior-frontend-developer?node-id=0%3A1

Требования к верстке:

• Валидность, кроссбаузерность (IE11+)
• Адаптивность до 320px по ширине экрана
• HTML должен быть семантичен, структура классов и блоков должна быть по БЭМ
• Если используются JS библиотеки, они должны быть подключены через npm

Примечания:

• Шапка фиксирована вверху экрана
• Фильтр прилипает под шапку
• Список карточек запросить с JSON заглушки https://mocki.io/v1/a5814d24-4e22-49fc-96d1-0e9ae2952afc
• фильтрация карточек должна осуществляться на клиенте, по автору и дате при изменении соответсвующих контролов фильтра при желании можно использовать фреймворк
• По мере верстки страницы отправлять коммиты в git, для того чтобы можно было оценить общий прогресс и фактическое время на разработку.

Команды

npm ci (preferable)    # установка зависимостей проекта (предпочтительный способ)
npm i                  # установка зависимостей проекта
npm run dev            # запуск сервера разработки
npm run build          # сборка проекта
npm run preview        # локальная предварительная версия рабочей сборки