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

🚀 Установка и запуск

Клонирование репозитория

git clone https://github.com/ku6epxboctuk/twitch-panels.git
cd twitch-panels

Установка зависимостей

npm install

Запуск сервера разработки

npm run dev

# или запуск сервера и открытие приложения в новой вкладке браузера
npm run dev -- --open

📦 Сборка

Для создания production-версии приложения:

npm run build

Вы можете предварительно просмотреть production-сборку с помощью:

npm run preview

🧪 Тестирование

Запуск всех тестов:

npm run test

Запуск тестов с UI:

npm run test:ui

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

npm run test:coverage

📄 Лицензия

Этот проект распространяется под лицензией MIT.

🤝 Вклад в проект

Вклады приветствуются! Если вы хотите внести свой вклад, пожалуйста, создайте fork репозитория, создайте ветку для вашей функции и отправьте pull request.

📞 Контакты

Если у вас есть вопросы или предложения, пожалуйста, создайте issue в репозитории проекта.