Конструктор чехлов (React + Golang)

Интерактивный веб-редактор для создания дизайнов чехлов под смартфоны.
Пользователь собирает собственный дизайн (текст, картинки) непосредственно на макете телефона, отправляет его администратору, после одобрения получает уведомление о запуске в производство.

---

🚀 Основные возможности

Для пользователя

• Выбор модели телефона (пример: iPhone 11).
• Отрисовка чехла поверх фонового изображения телефона:
  • слой корпуса (model.image);
  • слой камеры (model.camera);
  • слой рамок/контуров (model.edges).
• Добавление элементов на канвас:
  • Текст:
    • перетаскивание мышью;
    • изменение размера шрифта (слайдер);
    • изменение цвета (color input);
    • поворот (слайдер и трансформер Konva);
  • Изображения:
    • загрузка картинок с компьютера;
    • предзагрузка и кэширование изображений через usePreloadImages;
    • изменение размеров, положение, поворот.
• Работа со слоями:
  • список слоёв (текст / картинка);
  • выбор активного слоя;
  • поднятие/опускание слоя (вперёд/назад);
  • удаление слоя.
• Экспорт результата:
  • экспорт готового макета в PNG через Stage.toDataURL (концепт в handleExport).

Для администратора (планируется)

• Личный кабинет администратора.
• Просмотр списка заказов / дизайнов, отправленных пользователями.
• Просмотр макета (PNG + метаданные).
• Изменение статуса: на рассмотрении → одобрено → в производстве → готово.
• Отправка уведомлений пользователю (email / пуш / внутри личного кабинета).

---

🧩 Технологический стек

Frontend

• React (функциональные компоненты, хуки)
• react-konva — отрисовка канваса с текстами/картинками
• @mui/material — UI-компоненты: кнопки, слайдеры, поля ввода, список слоёв
• TypeScript — типизация элементов на канвасе
• SCSS-модули — стилизация (Editor.module.scss)
• react-router-dom (планируется) — маршрутизация:
  • / — публичный редактор/главная;
  • /editor/:modelId — конструктор для конкретной модели телефона;
  • /admin — личный кабинет администратора.

🧱 Backend на Go

Технологический стек

• Go (1.22+)
• PostgreSQL — основная БД
• HTTP-фреймворк (на выбор):
  • Gin — простой и популярный
  • или Fiber / Echo — тоже хорошие варианты
• Доступ к БД:
  • pgx или
  • GORM — если хочется ORM
• Авторизация:
  • JWT (через github.com/golang-jwt/jwt/v5)
• Миграции:
  • golang-migrate или gooseW

---

Пример структуры проекта (Go)