Архітектура

SkillForge — це система з трьох шарів: React frontend, Laravel API backend і PostgreSQL база даних.

Огляд системи

Frontend (React 19 + Vite)
          |
          | HTTP (axios)
          v
Backend (Laravel 12 API + Sanctum)
          |
          v
PostgreSQL (Docker)

Шар frontend

Основні технології:

• React 19
• Vite
• Tailwind CSS
• shadcn/ui primitives
• react-router-dom
• @dnd-kit (ordering UX)
• react-markdown + remark-gfm + remark-github-blockquote-alert

Ключові відповідальності:

• захист маршрутів з урахуванням ролей (співробітник vs адміністратор)
• сценарій споживання контенту (курс, урок, квіз)
• адміністраторські інтерфейси керування
• візуалізація прогресу та результатів
• рендеринг і редагування Markdown

Спільні групи компонентів:

• components/common: базові UI-примітиви для всіх сторінок, наприклад лоадери
• components/course: метадані курсу та допоміжні функції композиції
• components/admin: перевикористовувані форми редагування для адміністратора
• components/markdown: обгортки для рендерера та редактора Markdown

Шар backend

Основні технології:

• Laravel 12
• Laravel Sanctum
• PHPUnit/Laravel test tooling

Ключові відповідальності:

• аутентифікація і життєвий цикл токенів
• авторизація з урахуванням ролей і видимість даних
• CRUD для курсів, уроків, квізів і питань
• прогрес уроків і оцінювання квізів
• життєвий цикл призначень із дедлайнами
• життєвий цикл запрошень (створення, повторне надсилання, відкликання, прийняття)
• статистика для адміністраторів

Шар бази даних

Основні сутності:

• users
• courses
• lessons
• quizzes
• questions
• results
• lesson progress
• course assignments
• invites

Міграції та seed-дані зберігаються в каталогах Laravel backend і мають вважатися джерелом істини.

Правила доступу під час виконання

• Співробітники бачать лише опублікований контент.
• Адміністратори можуть керувати як чернетками, так і опублікованим контентом.
• Маршрути адміністраторів захищені на frontend і backend.
• Публічне прийняття запрошень навмисно залишається без аутентифікації.

Модель навчання

• Курс містить уроки й квізи в одній впорядкованій послідовності.
• Уроки потрібно позначати як завершені.
• Квізи потрібно складати щонайменше на 80%.
• Завершення курсу вимагає, щоб усі уроки були завершені, а всі квізи — складені.

Модель контенту Markdown

Тіла уроків пишуться в Markdown і рендеряться всередині застосунку.

Підтримувані можливості рендерингу:

• заголовки, виділення, списки, посилання
• таблиці та fenced code blocks
• task lists і стандартні GFM-фічі
• alert callouts: note, tip, warning, caution
• вкладені картинки