Интернет магазин "Шкатулка радости"

Описание

Описание

Gem Bliss Boutique (“Шкатулка радости”) — интернет-магазин украшений и изделий из натуральных камней и самоцветов. Цель проекта — создать не просто каталог товаров, а “живой” бренд-магазин, где покупатель получает эмоцию, доверие и персональный подбор: от витрины и контента (новости, статьи) до интерактивных функций вроде AI-консультанта для подбора изделия и “Карты дня” (Lilo карта).
Ключевые требования: удобный путь к покупке (корзина, избранное, оформление), полноценная админка для управления контентом и товарами без разработчика, масштабируемая архитектура “фронт + бэк”, стабильная работа и быстрая загрузка на мобильных.

Стек технологий (подробно):

Frontend: React (многостраничная структура / роутинг), JavaScript/TypeScript (если используется), HTML5, CSS3/SCSS, анимации (микро-интеракции, плавные переходы), работа с API (Fetch/Axios).

Backend: Node.js, REST API (каталог/заказы/пользователи/контент), авторизация для админки, валидация данных, обработка ошибок, логирование.

БД / кэш: Redis (кэширование, корзина/сессии, быстрые выборки, “карта дня”/результаты подборов при необходимости).

Файловое хранилище: S3-совместимое хранилище (изображения товаров, медиа для статей/новостей).

Админка: полнофункциональная панель управления товарами, категориями, контентом (статьи/новости), заказами, медиа.

Решение

Проектирование структуры магазина: разделил публичную часть (витрина/контент/покупка) и административную (управление данными), описал сущности: товары, категории, атрибуты камней, изображения, статьи/новости, пользователи, избранное, корзина, заказы.

Фронтенд-витрина на React:

каталог и карточки товаров, страницы категорий и товара;

корзина, избранное, пользовательские сценарии покупки;

анимации и микро-интеракции для “премиального” ощущения;

адаптивная верстка для мобильных.

Контент-модуль: разделы новости и статьи с удобной публикацией из админки (структура, медиа, превью, SEO-логика при необходимости).

AI-консультант подбора: реализовал сценарий диалога/опроса, сбор предпочтений (стиль, камень, смысл, бюджет, повод), формирование рекомендаций и выдачу подборок товаров из каталога через API.

“Карта дня” (Lilo): отдельный интерактивный функционал с логикой ежедневного выбора/выдачи карты и аккуратной подачей результата (можно кэшировать результат на день через Redis).

Бэкенд и инфраструктура: REST API для всех ключевых операций (товары/контент/заказы/избранное/корзина), подключение Redis, хранение изображений в S3, разграничение доступа к админке, базовая защита и стабильность.

Стек технологий (подробно): React, JS/TS, роутинг, CSS/SCSS, анимации; Node.js REST API; Redis; S3 storage; админка.

Результат

Получился функциональный бренд-магазин, который продаёт через комбинацию витрины + контента + интерактива: посетитель может читать статьи/новости, выбирать изделия в каталоге, сохранять в избранное, складывать в корзину и оформлять покупку. AI-консультант повышает вовлечённость и помогает быстрее найти подходящее изделие, а “Карта дня” добавляет эмоцию и регулярный повод возвращаться на сайт.
Для владельца бизнеса — полноценная админка делает проект самостоятельным: можно управлять ассортиментом, контентом и заказами без участия разработчика, а S3 и Redis дают устойчивость и скорость при росте каталога и посещаемости.

Презентация проекта