Необходимо разработать сайт на основе готовых макетов, предоставленных во Figma. Сайт будет работать через HTTP API, без использования базы данных, так вам не нужно ничего хранить, все уже находится в API. Все данные загружаются и отправляются через API. Ответы от API определяют структуру страницы и тип контента (примеры во вложенном файле). Также требуется реализовать чат общения с поставщиками через WebSocket. Сам сервер чата уже есть, вам нужно по API через WebSocket с ним работать только. В товарной плитке есть превью видео короткие в формате mp4, в карточке товара есть M3U8 видео, плеер должен быть кросбраузерным и поддерживать адаптивность.
- Реализовать единую точку входа для запросов к API
- Все данные для отрисовки страниц загружаются из ответа API, то есть ответ API определяет тип и контент страницы по типу handler поля, присылается тип страницы, например карточка поставщика, профиль, настройки какие-то, корзина, и тд и тп (в текущей версии 23 типа обработчиков)
- Реализовать адаптивную верстку для мобильных устройств и десктопов.
- Верстка должна соответствовать макетам из Figma.
- Поддержка современных браузеров (Chrome, Firefox, Safari, Edge).
- Обрабатывать ошибки API (например, 404, 500) и показывать пользователю соответствующие сообщения.
- Использовать ленивую загрузку (lazy loading) для изображений и видео.
- Динамически подставлять мета-теги (title, description) на основе данных из API.
Требования к результату:
1) Готовый сайт, полностью соответствующий макетам из Figma для десктопной и мобильной версий.
2) Корректная работа всех функций, включая чат и видео mp4 и m3u8
3) Код должен быть чистым, хорошо документированным и легко поддерживаемым.
Ожидаю от вас сроки и бюджет.
Если коротко, то суть такая: вам приходит любой web-запрос, вы весь урл и параметры кидаете в единую точку входа API, и вам приходит ответ что рисовать за страницу и какой контент будет на ней. Если что-то нужно лайкнуть, или поменять настройки пользователя, делается это через асинхронные запросы тоже с единой точкой входа
В файле ниже описание схемы URL и примеры запросов и ответов, список обработчиков и примеры асинхронных вызовов для изменения данных и взаимодействия с системой
В файле не окончательный список обработчиков, они будут добавляться еще по мере разработки, это будет рассчитываться и оплачиваться отдельно
Макеты тут https://www.figma.com/design/L2iPy0AXbtpnGbQ6jEFXHt
Примеры вызовов и ответов https://disk.yandex.ru/i/4R3M01vRXEA_lA