Привет!
Ты получил эту ссылку, потому что твою резюме показалось мне интересным. Благодарю тебя за проявляенный интерес!

Тестовое задание: React Native, Front dev middle

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

Необходимо написать простое приложение на React.js (с использованием https://redux-orm.github.io/redux-orm/), которое получало бы список товаров и категорий по сети, выводило бы их на экране и предоставляло возможность добавлять их в корзину и создавать заказ.

Корзина и заказ, ради простоты реализации, должны просто храниться локально.

Внешний вид - https://www.figma.com/file/Eb6uT4Pjnk7O14q0YUXtJq/%D0%94%D0%BB%D1%8F-React.js-web-middle?node-id=0%3A1


1.1 Данные

Данные - несколько категорий, содержащие товары.

Для получения данных реализован простой REST интерфейс.

Для получения списка сущностей используется GET запрос вида

https://test2.sionic.ru/api/{model}

Где {model} - название сущности

Параметры запроса передаются виде json кодированной строки. Доступны следующие параметры запроса:

filter - фильтрация по любому свойству сущности, например filter={"category_id":20} для модели Products вернет нам все товары категории с id=20. Также значения можно указывать виде массива, если нужно отфильтровать несколько id, например filter={"category_id":[20,21,22]}

sort - сортировка сущностей по любому свойству, например sort=["name","ASC"] для модели Products отсортирует товары по имени по возрастанию

range - выборка из диапазона, например range=[0,24] вернет нам все сущности с 0-й по 24-ю, всего 25.

За один запрос возвращается не более 50 записей.

Общее количество записей возвращается виде заголовка, например:

Content-Range: Products 0-24/319

Для получения одной записи по ее id используется запрос вида

https://test2.sionic.ru/api/{model}/{id}

Где {model} - название сущности, а {id} - ее id


Доступны следующие методы:

Категории:

GET https://test2.sionic.ru/api/Categories?sort=["name","ASC"]&range=[0,24]

GET https://test2.sionic.ru/api/Categories/21

Свойства:

name - название категории

Товары:

GET https://test2.sionic.ru/api/Products?sort=["name","ASC"]&range=[0,24]&filter={"category_id":20}

GET https://test2.sionic.ru/api/Products/2001

Свойства:

name - название товара

category_id - id категории

description - описание товара

Изображения товаров:

GET https://test2.sionic.ru/api/ProductImages?sort=["image_name","ASC"]&range=[0,24]&filter={"product_id":1001}

GET https://test2.sionic.ru/api/ProductImages/3001

Свойства:

image_name - имя файла изображения

product_id - id товара

image_url - ссылка на изображение

Вариации товаров:

GET https://test2.sionic.ru/api/ProductVariations

GET https://test2.sionic.ru/api/ProductVariations/1

product_id - id товара

price - цена данной вариации товара

stock - количество в наличии

Свойства вариаций:

GET https://test2.sionic.ru/api/ProductVariationProperties

GET https://test2.sionic.ru/api/ProductVariationProperties/1

Свойства:

name - название свойства

type - тип свойства: 0 - строка, 1 - целое число, 2 - число с плавающей точкой, 3 - значение из списка

Значения списков свойств вариаций:

GET https://test2.sionic.ru/api/ProductVariationPropertyListValues

GET https://test2.sionic.ru/api/ProductVariationPropertyListValues/1

Свойства:

product_variation_property_id - id свойства вариации

title - заголовок значения

value - значение

Значения свойств вариаций:

GET https://test2.sionic.ru/api/ProductVariationPropertyValues

GET https://test2.sionic.ru/api/ProductVariationPropertyValues/1

Свойства:

product_variation_id - id свойства вариации

product_variation_property_id - id свойства вариации

value_string - значение типа строка

value_int - значение типа целое число

value_float - значение типа число с плавающей точкой

product_variation_property_list_value_id - id значения свойства вариации из списка



1.2 Приложение

Приложение должно быть написано на React, запускаться на современных браузерах. При старте приложения открывается экран со списком категорий и товаров. Каждый товар можно положить в корзину и, в итоге, сделать заказ. Также должен быть экран вывода списка созданных заказов.

Корзину и заказ нет необходимости реализовывать через сеть, достаточно просто хранить их в local storage.

Будут ли сделаны экраны с данными разными компонентами, одним компонентом или как-то ещё - на усмотрение исполнителя.

На всех экранах приложения должна быть кнопка перехода в корзину, а также кнопка перехода к списку созданных заказов.


1.2.1 Категории

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



1.2.2 Товар

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

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


1.2.3 Заказ


На экране оформления заказа находится форма с текстовыми полями:

• Имя
  
  
• Адрес
  
  
• Телефон
  
  
• Время
  
  

Все поля обязательны. После заполнения всех полей пользователь может нажать на кнопку "Оформить заказ", создастся новый заказ с содержимым текущей выбранной корзины, а сама корзина очистится.


1.2.4 История заказов


На данном экране выводится список всех созданных заказов пользователя, с их содержимым (корзина) и датой создания.


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


Необходимо реализовать:

• Вывод товаров с подгрузкой (infinite scroll)
  
  
• Фильтры в категориях по названиям товаров и цене.
  
  
• Адаптив на разные размеры.
  
  

Дополнение 01/2021 - делаем вариант с 0% скидкой. Скидку никак не обрабатываем.