Разработчик создает полноценный SaaS-продукт с Claude Cowork: Приложение с табло счёта MLB, включающее аутентификацию, платежи и виджет для встраивания.

Обзор проекта

Разработчик создал полноценный SaaS-продукт под названием ScorePorch, используя сессии Claude Cowork. ScorePorch — это персонализированное приложение для отображения результатов MLB, которое включает фронтенд, бэкенд, аутентификацию, платежи и встраиваемый виджет.

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

• Фронтенд: Vite + React
• Бэкенд: API на Express/Vercel serverless
• Аутентификация: Supabase (email + Google OAuth)
• Платежи: Stripe с синхронизацией через вебхуки
• Источник данных: MLB Stats API для живых данных
• Новости: RSS-ленты MLB.com

Функции приложения

Пользователи выбирают свою любимую команду и получают дашборд, оформленный в цветах этой команды. Дашборд включает:

• Живые результаты
• Положение в дивизионе
• Обратный отсчёт до следующей игры
• Новости, связанные с командой, из RSS-лент MLB.com
• Полные статистические сводки

Бесплатный тариф предоставляет доступ к одной команде, а платные тарифы открывают многокомандный функционал и встраиваемый виджет.

Детали встраиваемого виджета

Встраиваемый виджет был создан как изолированный через Shadow DOM, адаптивный к контейнеру компонент, который можно добавить на любой сайт с помощью одного тега script. Виджет весит всего 23 КБ и не имеет зависимостей. Claude Cowork помог разработать стратегию изоляции, чтобы CSS виджета не влиял на стили страниц, на которые он встраивается.

Опыт разработки с Claude Cowork

Разработчик отметил, что Cowork эффективно справился со всем жизненным циклом продукта, а не только с генерацией кода. Конкретные совместные задачи включали:

• Итерации над процессами аутентификации
• Отладку крайних случаев вебхуков Stripe
• Решение проблем с CORS для кросс-доменных запросов виджета
• Создание лендинга на Framer

Непрерывность контекста между сессиями создала ощущение работы с сооснователем, который помнит предыдущую работу.

Возникшие сложности

• Аутентификация: PKCE-поток постоянно ломал обратный вызов, что потребовало перехода на implicit flow
• Ограничения API: API ESPN фактически не работал, что потребовало перехода на RSS MLB.com для новостей
• Интеграция с Git: Cowork не может напрямую пушить в git (EPERM на index.lock), что потребовало обходного пути, при котором разработчик клонирует в /tmp и пушит оттуда

Дополнительная разработка

Разработчик создал плагин Cowork для ScorePorch, позволяющий другим разработчикам, создающим дашборды, добавить живое табло MLB в свои проекты с помощью команды /add-scoreboard [team-name]. Плагин включает руководства по интеграции для React, Next, Vue, Svelte, WordPress, Squarespace и Webflow.

Приложение доступно по адресу app.scoreporch.com.