Трекер привычек — Создаём настоящее приложение на FlutterFlow 5 и Supabase
Подробный двухчасовой мастер-класс по созданию habit tracker на FlutterFlow (фронтенд) и Supabase (бэкенд). Архитектура, схема данных, авторизация, геймификация (streaks + milestones) — максимальное использование No-code возможностей Supabase.
Суть за 30 секунд
Habit tracker от А до Я: проектирование БД (пользователи, привычки, streaks, milestones) → связка FF + Supabase → CRUD → авторизация → страница профиля. Все подсчёты — на стороне базы данных через views.
📍 Навигация (Timeline)
- 00:00 — Архитектура: Схема данных Supabase (пользователи, привычки, streaks, milestones).
- 05:00 — Связка FF + Supabase: Настройка интеграции, создание таблиц.
- 15:00 — UI приложения: Главная страница, список привычек.
- 30:00 — Добавление привычек: Форма создания, сохранение в Supabase.
- 45:00 — Отметка выполнения: Логика streaks и подсчётов.
- 60:00 — Геймификация: Milestones (3, 7, 30 дней), цветовые индикаторы.
- 75:00 — Авторизация: Страница логина, работа с пользователями.
- 90:00 — Страница профиля: Статистика, редактирование, удаление.
- 110:00 — Итоги: Обзор и рекомендации.
🧠 Ключевые концепции
- Supabase, Habit Tracker, Streaks, Milestones, Database Views, No-code
🛠 Практические фишки
- Все подсчёты на стороне БД: Streaks, статусы достижений, фильтрации — через Supabase views и запросы.
- Геймификация через milestones: 3, 7, 30 дней — цветовые индикаторы мотивируют пользователя.
- Тестовые данные: Генерируйте сиды в Supabase для быстрой проверки UI.
- Авторизация в конце: Сначала постройте основной функционал, затем добавьте страницу профиля и логин.
📌 Резюме
Идеальное видео для начинающих, желающих освоить No-code/Low-code подход к созданию реальных приложений на базе FlutterFlow и Supabase. Акцент на максимальной использовании возможностей Supabase — вся бизнес-логика на стороне базы данных.
📺 Практика (Видео)
- Создание админ-ролей во FlutterFlow (правильный подход)
- FlutterFlow Tricks- Create User Accounts for Others
- Supabase Magic Link Authentication in FlutterFlow
- 6 мощных кастомных компонентов для FlutterFlow
- Создание социального приложения на FlutterFlow и Supabase
- n8n- Полный обзор и туториал по автоматизации
- Advanced Workflow- Как избавиться от ограничений FlutterFlow
- FlutterFlow- API-запросы к Supabase
- Представляем официальный MCP-сервер Supabase
- Название видео
- Создание мобильного дневника на FlutterFlow с локальной базой данных
- Master Forgot and Reset Password in FlutterFlow and Supabase (2025)