011be12af0716fffc43e8d52c8056879e0bfb187
Team Status Board
Панель управления статусами команды — внутренний инструмент для отслеживания состояния сотрудников в реальном времени.
Возможности
- ✅ Просмотр всех сотрудников команды
- ➕ Добавление новых сотрудников (имя, должность)
- 🔄 Изменение статуса в реальном времени без перезагрузки страницы
- 🗑️ Удаление сотрудников из списка
- 🔔 Уведомления о выполненных операциях
- 📱 Адаптивный дизайн
Стек технологий
Бэкенд
- Python 3.8+
- FastAPI — современный веб-фреймворк
- SQLAlchemy — ORM для работы с БД
- SQLite — встроенная база данных
- Uvicorn — ASGI сервер
Фронтенд
- React 18 — библиотека UI
- Vite — сборщик и dev-сервер
- Axios — HTTP-клиент
Инфраструктура
- Git — контроль версий
- Bash — автоматизация запуска
Быстрый старт
Требования
- Python 3.8 или выше
- Node.js 18 или выше
- Bash (WSL2 на Windows, Linux или macOS)
Запуск
# Клонирование репозитория
git clone <repository-url>
cd "Team status board"
# Запуск (автоматическая установка зависимостей и запуск)
./start.sh
После запуска приложение будет доступно по адресам:
- Фронтенд: http://localhost:3000
- Бэкенд API: http://localhost:8000
- API документация (Swagger): http://localhost:8000/docs
API Endpoints
| Метод | Endpoint | Описание | Статус-код |
|---|---|---|---|
GET |
/api/employees |
Получить всех сотрудников | 200 |
POST |
/api/employees |
Добавить сотрудника | 201 |
PUT |
/api/employees/{id}/status |
Обновить статус сотрудника | 200 |
DELETE |
/api/employees/{id} |
Удалить сотрудника | 204 |
Примеры запросов
Добавить сотрудника:
curl -X POST http://localhost:8000/api/employees \
-H "Content-Type: application/json" \
-d '{"name": "Иван Иванов", "position": "Разработчик"}'
Изменить статус:
curl -X PUT http://localhost:8000/api/employees/1/status \
-H "Content-Type: application/json" \
-d '{"status": "На встрече"}'
Удалить сотрудника:
curl -X DELETE http://localhost:8000/api/employees/1
Доступные статусы
| Статус | Описание | Цвет |
|---|---|---|
| 🟢 Online | В сети, доступен | Зеленый |
| 🟡 На встрече | Занят на встрече | Желтый |
| ⚫ Offline | Не в сети | Серый |
| 🔵 В отпуске | В отпуске | Синий |
| 🔴 Болеет | На больничном | Красный |
Структура проекта
.
├── backend/
│ ├── main.py # FastAPI приложение + CRUD
│ ├── requirements.txt # Python зависимости
│ └── team_status.db # SQLite БД (создается автоматически)
├── frontend/
│ ├── src/
│ │ ├── App.jsx # Основной React компонент
│ │ ├── App.css # Стили компонента
│ │ ├── main.jsx # Точка входа React
│ │ └── index.css # Глобальные стили
│ ├── index.html # HTML шаблон
│ ├── package.json # Node.js зависимости
│ └── vite.config.js # Конфигурация Vite
├── .gitignore # Игнорируемые файлы
├── start.sh # Скрипт автозапуска
└── README.md # Документация
Разработка
Ручной запуск бэкенда
cd backend
python -m venv venv
source venv/bin/activate # или venv\Scripts\activate на Windows
pip install -r requirements.txt
python main.py
Ручной запуск фронтенда
cd frontend
npm install
npm run dev
Git-гигиена
Проект использует .gitignore для исключения:
node_modules/— зависимости Node.jsvenv/— виртуальное окружение Python__pycache__/— кэш Python*.db— файлы базы данных.env— файлы окружения
Коммиты выполняются атомарно — одно изменение = один коммит.
Устранение неполадок
Порт 8000 или 3000 уже занят
Скрипт start.sh автоматически освобождает порты. Если это не помогло:
# Linux/WSL
lsof -i :8000 # найти PID
kill -9 <PID>
# Windows (PowerShell)
Get-Process -Id (Get-NetTCPConnection -LocalPort 8000).OwningProcess | Stop-Process
Ошибки при установке зависимостей
# Обновить pip
pip install --upgrade pip
# Очистить кэш npm
npm cache clean --force
База данных не создается
Убедитесь, что у скрипта есть права на запись в директорию backend/:
ls -la backend/
Лицензия
Внутренний инструмент, все права защищены.
Description
Languages
JavaScript
38.8%
Shell
23.2%
CSS
20.2%
Python
16.3%
HTML
1.5%