Socks Service

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

Что умеет приложение

• регистрация, вход и выход пользователя;
• генератор носков с выбором цвета, узора и изображения;
• предпросмотр готового дизайна;
• сохранение дизайна в избранное;
• добавление дизайна в корзину;
• изменение количества товаров в корзине;
• оформление заказа с отправкой письма на почту магазина;

Стек

Клиент

• React
• React Router
• Vite
• Axios

Сервер

• Node.js
• Express
• PostgreSQL
• Sequelize
• JWT
• Cookie Parser
• Nodemailer

Структура проекта

SocksService/
├── client/                 # React-приложение
│   ├── public/             # изображения, цвета, узоры и иконки
│   └── src/
│       ├── app/            # роутинг и корневые компоненты
│       ├── entities/       # API-клиенты сущностей
│       ├── features/       # формы и пользовательские сценарии
│       ├── Pages/          # страницы приложения
│       ├── shared/         # общие утилиты и UI
│       └── widgets/        # Header, Footer, переходы страниц
├── server/                 # Express API
│   ├── db/                 # модели, миграции и сиды Sequelize
│   └── src/
│       ├── configs/        # CORS, cookies, JWT, server config
│       ├── controllers/    # обработчики запросов
│       ├── middlewares/    # middleware
│       ├── routes/         # API routes
│       ├── services/       # бизнес-логика
│       └── utils/          # вспомогательные функции
└── README.md

Страницы

Путь	Назначение
/	Главная страница
/auth	Вход и регистрация
/generateSocks	Генератор дизайна носков
/favourites	Избранные дизайны
/basket	Корзина
*	Страница 404

Запуск локально

Запустите сервер:

cd server
npm install
npm run dev

Запустите клиент во втором терминале:

cd client
npm install
npm run dev

Деплой на Netlify

Проект настроен через netlify.toml:

• сборка клиента выполняется командой из netlify.toml;
• папка публикации: client/dist;
• serverless-функции: server/netlify/functions;
• запросы /api/* перенаправляются в /.netlify/functions/api/*.