Калорія

PWA для оцінки калорійності страви по фото. Ти фотографуєш тарілку і вводиш вагу порції, а застосунок показує інгредієнти, їхні частки, ккал, КБЖВ, «на що впливає» й факти. Також є історія розборів і денна ціль.

• Аналіз фото робить Claude API через серверну функцію api/analyze.js. Ключ зберігається лише на сервері.
• Історія й ціль лежать на телефоні в IndexedDB. Акаунтів поки немає.
• Працює на Android (Chrome, Samsung Internet) та iPhone (Safari), встановлюється на головний екран.

Структура

index.html            розмітка
privacy.html          політика конфіденційності (uk/en)
feedback.js           модуль відгуків: «точно / неточно» під розбором і повідомлення розробнику
admin.html            дашборд тестування (тільки для ADMIN_EMAILS)
app.css               стилі (світла й темна тема)
i18n.js               переклади інтерфейсу (uk, en) і приклад розбору
app.js                логіка: камера, аналіз, історія, ціль, налаштування, встановлення
sw.js                 service worker (оболонка застосунку працює офлайн)
manifest.webmanifest  маніфест PWA
icons/                іконки
api/analyze.js        серверна функція Vercel → Claude API (перевірка входу, денний ліміт)
api/account.js        видалення акаунта разом з усіма даними
api/nutrients.js      калорійність інгредієнта, доданого під час редагування (швидка модель, не з'їдає ліміт)
api/_sb.js            спільні функції для роботи з Supabase
api/stats.js          дані для дашборда
supabase/feedback.sql таблиці відгуків; supabase/feedback_rollback.sql прибирає їх
supabase/schema.sql   таблиці, правила доступу, ліміт, сховище мініатюр
vercel.json           заголовки

Розгортання

1. Ключ Claude API

1. Зайди на https://console.anthropic.com, поповни баланс (Billing).
2. У Limits встанови місячний ліміт витрат, наприклад 10 $, щоб не було сюрпризів.
3. У API Keys натисни «Create Key» і скопіюй ключ. Він показується лише один раз. Нікому його не пересилай.

2. Код на GitHub

Варіант A, без командного рядка:

1. На github.com натисни «New repository», назва kaloriya, Private, «Create».
2. На сторінці репозиторію натисни «uploading an existing file».
3. Розпакуй архів і перетягни вміст папки kaloriya (а не саму папку) разом із підпапками api та icons. Потім натисни «Commit changes».

Варіант B: підключи GitHub до Claude (Settings → Connectors). Тоді Claude сам викладатиме оновлення в репозиторій.

3. Vercel

1. https://vercel.com → «Continue with GitHub».
2. Натисни «Add New…» → «Project» і поруч із kaloriya вибери «Import».
3. Framework Preset: Other. Нічого більше не змінюй.
4. Розгорни Environment Variables і додай:
   • ANTHROPIC_API_KEY — ключ з кроку 1
   • ACCESS_CODE — будь-яке слово, яке ти даватимеш тестувальникам (необов'язково, але дуже раджу: без нього будь-хто з посиланням витрачатиме твій баланс)
5. Натисни «Deploy». Приблизно за хвилину отримаєш адресу на кшталт kaloriya-xxxx.vercel.app.

Змінив ключ чи код? Project → Settings → Environment Variables, потім Deployments → «Redeploy».

4. Встановлення на телефон

• Android: відкрий адресу в Chrome або Samsung Internet. З'явиться смужка «Встановити», або в меню вибери «Встановити застосунок» / «Додати на головний екран».
• iPhone: відкрий адресу в Safari, натисни «Поділитися» і вибери «На початковий екран».
• Під час першого запуску введи код доступу й дозволь доступ до камери.

Акаунти (Supabase)

Вхід без пароля: email і код з листа. Історія, мініатюри фото, ціль і мова зберігаються в акаунті. Те, що до входу лежало на телефоні, переноситься в акаунт під час першого входу.

Налаштування:

1. Supabase → SQL Editor → встав supabase/schema.sql → Run.
2. Authentication → Emails → Templates: у шаблонах Confirm signup і Magic Link має бути {{ .Token }} (код), а не посилання.
3. Authentication → URL Configuration → Site URL: адреса застосунку.
4. Vercel → Environment Variables: SUPABASE_URL, SUPABASE_SECRET_KEY, за бажанням DAILY_LIMIT (за замовчуванням 15).
5. Project URL і publishable key вписані на початку app.js (об'єкт SB). Вони публічні, дані захищають правила доступу в базі.

Поки SUPABASE_URL і SUPABASE_SECRET_KEY не задані, застосунок працює без входу, як раніше.

Відгуки тестувальників

Під кожним розбором є кнопки «Точно / Неточно» (для «неточно» можна дописати, що не так), а в налаштуваннях форма «Написати розробнику». Модуль окремий: feedback.js + таблиці з supabase/feedback.sql.

Як вимкнути:

• Швидко, без зміни коду: Vercel → Environment Variables → FEEDBACK = off → Redeploy. Кнопки й форма зникнуть, решта працює як раніше. Увімкнути назад: видалити змінну або поставити on.
• Повністю: видалити feedback.js і рядок <script src="/feedback.js"> в index.html (або git revert коміту з відгуками), потім запустити supabase/feedback_rollback.sql.

Дашборд тестування

/admin.html — активні користувачі й аналізи по днях, утримання, точність, неточні розбори з коментарями, повідомлення, список тестувальників. Доступ: додай у Vercel ADMIN_EMAILS (через кому) зі своїм email, увійди в застосунок цим email на тому ж пристрої й відкрий /admin.html.

Мови

Мова визначається з налаштувань телефона, а в «Налаштуваннях» її можна змінити вручну. Модель відповідає тією ж мовою (параметр lang у запиті до /api/analyze). Щоб додати мову: у i18n.js скопіюй блок en, переклади значення й додай код мови в LANGS. Потім додай промпт цією мовою в PROMPTS у api/analyze.js.

Донати

Посилання на банку Monobank і Ko-fi задаються на початку app.js в об'єкті DONATE. Порожній рядок ховає кнопку. Кнопки є в «Налаштуваннях», а після 10-го аналізу застосунок раз на місяць ненав'язливо нагадує про підтримку.

Налаштування сервера

• CLAUDE_MODEL (необов'язково) — модель для аналізу фото, за замовчуванням claude-sonnet-5-5.
• CLAUDE_FAST_MODEL (необов'язково) — модель для калорійності доданих інгредієнтів, за замовчуванням claude-haiku-5-5.
• Ліміт запитів на одну IP-адресу: 12 на хвилину (у api/analyze.js, константа RATE).

Що далі

• Акаунти й синхронізація історії між пристроями (наприклад, Supabase).
• Ручне коригування відсотків інгредієнтів.
• Цілі по білках, жирах і вуглеводах.
• Обгортка для Google Play (TWA) і App Store (Capacitor).