Интерактивная платформа обучения

## Описание проекта

Интерактивная веб-платформа для онлайн-обучения. Приложение предоставляет структурированные учебные материалы в формате модулей и уроков с различными типами контента: информационные блоки, видеоуроки, интерактивные квизы, открытые вопросы и практические задания.
поект частично написан, важно довести его до состояния MVP в кратчайшие сроки(до двух недель), проект находится на гитхаб в закрытом репозитории, доступ предоставлю человеку с которым сойдемся по условиям и срокам. Важно понимание работы supabase и Vercel, знание vue js будет преимуществом.

## Основные функциональные возможности

- **Система авторизации пользователей** через Supabase

- **Образовательный контент** в виде модулей и уроков

- **Интерактивные элементы** для вовлечения пользователей в обучение

- **Отслеживание прогресса** обучения и система вознаграждений

- **Сохранение прогресса** в localStorage для продолжения обучения

- **Адаптивный дизайн** для различных устройств

## Структура проекта

```

app/

├── index.html              # Главная страница

├── assets/                 # Статические ресурсы

│   ├── css/                # Стили

│   │   ├── main.css        # Основные стили

│   │   ├── components.css  # Стили компонентов

│   │   └── auth.css        # Стили для аутентификации

│   ├── js/                 # JavaScript файлы

│   │   ├── app.js          # Основной скрипт приложения

│   │   ├── auth.js         # Логика аутентификации

│   │   ├── lessons.js      # Логика уроков

│   │   └── progress.js     # Отслеживание прогресса

│   └── img/                # Изображения

├── components/             # HTML компоненты

│   ├── header.html         # Шапка сайта

│   ├── auth-modals.html    # Модальные окна аутентификации

│   └── lesson-modal.html   # Модальное окно урока

└── README.md               # Документация проекта

```

## Технологии

- **Frontend**: HTML5, CSS3, JavaScript (ES6+)

- **Backend**: Supabase для аутентификации и хранения данных

- **Хранение данных**: LocalStorage для сохранения прогресса на устройстве пользователя

- **Модульная архитектура** для обеспечения масштабируемости приложения

### Этап 1: Разработка базовой структуры

- Создание каркаса HTML

- Настройка стилей CSS с использованием переменных и модульного подхода

- Создание компонентов для реиспользования

### Этап 2: Реализация основных функций

- Разработка модуля авторизации через Supabase

- Создание модуля для управления уроками и контентом

- Разработка системы отслеживания прогресса

### Этап 3: Интеграция и тестирование

- Объединение всех модулей в единое приложение

- Тестирование пользовательских сценариев

- Проверка адаптивности для различных устройств

## Запуск проекта

- Добавление API для загрузки контента уроков

- Расширение типов интерактивных заданий

- Реализация системы оценок и обратной связи