marti-sveltesystem Svelte Themes

Marti Sveltesystem

optemized system marti(Client version for Windows and Android)

🏫 Marti Light - Школьная система

Современная, минималистичная система управления школой, построенная на Svelte 5 и SvelteKit.

✨ Особенности

🎨 Современный дизайн

  • Минималистичный интерфейс с акцентом на удобство использования
  • Адаптивный дизайн для всех устройств
  • Темная тема (автоматическое переключение)
  • Плавные анимации и переходы
  • Современная типографика с системой отступов

🔐 Аутентификация

  • JWT токены для безопасной авторизации
  • Регистрация школ с полной информацией
  • Автоматическое сохранение сессии
  • Защищенные маршруты

📊 Управление данными

  • Новости школы с поддержкой изображений
  • Учителя с контактной информацией
  • Классы с назначением классных руководителей
  • Расписание занятий с детальной информацией
  • Секции и кружки для внеклассной деятельности
  • Доска почета для достижений учеников
  • Меню столовой с ежедневным рационом

🌐 Мультиязычность

  • Русский и казахский языки
  • Переключение языков в реальном времени
  • Локализованный контент для всех разделов

📱 Адаптивность

  • Мобильные устройства - полная поддержка
  • Планшеты - оптимизированный интерфейс
  • Десктоп - расширенная функциональность

🛠 Технологии

  • Svelte 5 - современный реактивный фреймворк
  • SvelteKit - полнофункциональный веб-фреймворк
  • TypeScript - типизированный JavaScript
  • CSS Variables - система дизайна
  • Date-fns - работа с датами
  • REST API - взаимодействие с бэкендом

🚀 Установка и запуск

Предварительные требования

  • Node.js 18+
  • npm или yarn

Установка

# Клонирование репозитория
git clone <repository-url>
cd marti-light

# Установка зависимостей
npm install

# Запуск сервера разработки
npm run dev

Сборка для продакшена

# Сборка проекта
npm run build

# Предварительный просмотр
npm run preview

🔑 Аутентификация

Тестовые данные

Регистрация новой школы

  1. Перейдите на /register
  2. Заполните все обязательные поля
  3. После успешной регистрации войдите в систему

📡 API Endpoints

Система использует REST API с базовым URL: https://walrus-app-fioy4.ondigitalocean.app/api

Основные эндпоинты:

  • POST /auth/login - Вход в систему
  • GET /auth/me - Информация о текущей школе
  • GET /news - Список новостей
  • POST /news - Создание новости
  • GET /teachers - Список учителей
  • POST /teachers - Создание учителя
  • GET /classes - Список классов
  • POST /classes - Создание класса
  • GET /schedule - Расписание занятий
  • POST /schedule - Создание расписания

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

src/
├── lib/
│   ├── api/
│   │   └── client.ts          # API клиент
│   ├── components/
│   │   ├── Modal.svelte       # Модальные окна
│   │   ├── NewsCard.svelte    # Карточки новостей
│   │   ├── TeacherCard.svelte # Карточки учителей
│   │   └── ClassCard.svelte   # Карточки классов
│   ├── stores/
│   │   └── auth.ts           # Store аутентификации
│   └── types/
│       └── api.ts            # TypeScript типы
├── routes/
│   ├── +layout.svelte        # Главный layout
│   ├── +page.svelte          # Главная страница
│   ├── login/                # Страница входа
│   ├── register/             # Страница регистрации
│   ├── news/                 # Новости
│   ├── teachers/             # Учителя
│   ├── classes/              # Классы
│   ├── schedule/             # Расписание
│   ├── sections/             # Секции
│   ├── honor-board/          # Доска почета
│   └── canteen/              # Столовая
└── app.css                   # Глобальные стили

🎨 Система дизайна

Цветовая палитра

  • Primary: #6366f1 (индиго)
  • Success: #10b981 (зеленый)
  • Warning: #f59e0b (желтый)
  • Error: #ef4444 (красный)
  • Info: #3b82f6 (синий)

Типографика

  • Шрифт: Inter, system fonts
  • Размеры: 0.75rem - 2.5rem
  • Вес: 400, 500, 600, 700

Отступы и размеры

  • Базовый отступ: 0.25rem (4px)
  • Радиусы: 0.375rem - 1.5rem
  • Тени: 4 уровня глубины

📱 Адаптивность

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

  • Мобильные устройства (320px+)
  • Планшеты (768px+)
  • Десктоп (1024px+)
  • Большие экраны (1200px+)

🔧 Разработка

Структура компонентов

  • Модульная архитектура с переиспользуемыми компонентами
  • TypeScript для типобезопасности
  • Svelte stores для управления состоянием
  • CSS переменные для консистентности дизайна

Лучшие практики

  • Компонентный подход к разработке
  • Типизация всех API взаимодействий
  • Обработка ошибок на всех уровнях
  • Loading состояния для лучшего UX

🚀 Производительность

  • Быстрая загрузка благодаря Svelte
  • Оптимизированные изображения и ресурсы
  • Lazy loading для компонентов
  • Кэширование API запросов

📄 Лицензия

MIT License - свободное использование и модификация.

🤝 Вклад в проект

  1. Форкните репозиторий
  2. Создайте ветку для новой функции
  3. Внесите изменения
  4. Создайте Pull Request

Marti Light - современное решение для управления школьными процессами с акцентом на простоту и эффективность. # marti-sveltesystem

Top categories

Loading Svelte Themes