99 lines
3.2 KiB
Markdown
99 lines
3.2 KiB
Markdown
# Twitch Panels Creator
|
||
|
||
🎨 Веб-приложение для создания и настройки панелей для Twitch-каналов.
|
||
|
||
## 🌐 Демонстрация
|
||
|
||
Приложение доступно по адресу: https://ku6epxboctuk.github.io/twitch-panels/
|
||
|
||
## 📋 Описание
|
||
|
||
Twitch Panels Creator - это инструмент, который позволяет стримерам создавать и настраивать информационные панели для своих Twitch-каналов. Приложение предоставляет удобный интерфейс для управления текстом, фоновыми изображениями и экспорта готовых панелей.
|
||
|
||
## ✨ Основные возможности
|
||
|
||
- ✅ Создание и редактирование текстовых панелей с настройкой шрифта, цвета, размера и выравнивания
|
||
- ✅ Загрузка и обрезка фоновых изображений с настройкой яркости и контраста
|
||
- ✅ Предпросмотр всех панелей перед экспортом
|
||
- ✅ Экспорт панелей в PNG (320x100px) или массовый экспорт в ZIP-архив
|
||
- ✅ Поддержка темной и светлой темы
|
||
|
||
## 🛠️ Технологии
|
||
|
||
- **Frontend Framework:** Svelte 5 с SvelteKit
|
||
- **Язык:** TypeScript
|
||
- **Графика:** Konva.js, Cropper.js
|
||
- **Сборка:** Vite
|
||
- **Стилизация:** CSS с CSS переменными
|
||
- **Тестирование:** Vitest, Playwright
|
||
|
||
## 🚀 Установка и запуск
|
||
|
||
### Клонирование репозитория
|
||
|
||
```sh
|
||
git clone https://github.com/ku6epxboctuk/twitch-panels.git
|
||
cd twitch-panels
|
||
```
|
||
|
||
### Установка зависимостей
|
||
|
||
```sh
|
||
npm install
|
||
```
|
||
|
||
### Запуск сервера разработки
|
||
|
||
```sh
|
||
npm run dev
|
||
|
||
# или запуск сервера и открытие приложения в новой вкладке браузера
|
||
npm run dev -- --open
|
||
```
|
||
|
||
## 📦 Сборка
|
||
|
||
Для создания production-версии приложения:
|
||
|
||
```sh
|
||
npm run build
|
||
```
|
||
|
||
Вы можете предварительно просмотреть production-сборку с помощью:
|
||
|
||
```sh
|
||
npm run preview
|
||
```
|
||
|
||
## 🧪 Тестирование
|
||
|
||
Запуск всех тестов:
|
||
|
||
```sh
|
||
npm run test
|
||
```
|
||
|
||
Запуск тестов с UI:
|
||
|
||
```sh
|
||
npm run test:ui
|
||
```
|
||
|
||
Запуск тестов с покрытием:
|
||
|
||
```sh
|
||
npm run test:coverage
|
||
```
|
||
|
||
## 📄 Лицензия
|
||
|
||
Этот проект распространяется под лицензией MIT.
|
||
|
||
## 🤝 Вклад в проект
|
||
|
||
Вклады приветствуются! Если вы хотите внести свой вклад, пожалуйста, создайте fork репозитория, создайте ветку для вашей функции и отправьте pull request.
|
||
|
||
## 📞 Контакты
|
||
|
||
Если у вас есть вопросы или предложения, пожалуйста, создайте issue в репозитории проекта.
|