🖥️ Портфолио-сайт в стиле редактора кода

Интерактивное портфолио – веб-приложение, имитирующее интерфейс VS Code, с работающим терминалом, играми, ИИ-диалогом и сменой тем.

💡 Сделано с нуля – от идеи и дизайна до вёрстки, фронтенда, бэкенда, базы данных и деплоя. Весь код написан самостоятельно, без использования готовых шаблонов.

🌐 Ссылки на работающий проект:

• Главный сайт: https://stairus-projects.ru
• Документация API (Swagger UI): https://stairus-projects.ru/docs

📌 Возможности

• Интерфейс как в VSCode: вкладки, проводник, сайдбар, терминал.
• 11 цветовых тем, переключаемых в отдельной вкладке или через терминал.
• Встроенный терминал с командами:
  • math – вычисление математических выражений.
  • ai – диалог с YandexGPT.
  • cat – случайные факты о котиках.
  • ttt – игра «Крестики-нолики» против бота.
  • theme – смена темы.
  • help, clear, exit.
• Форма обратной связи с валидацией на клиенте и сервере.
• Полностью адаптивная вёрстка (320px+).

🧰 Технологии

| Область | Технологии | |---------------|-----------------------------------------------------------------| | Фронтенд | TypeScript, SCSS, Vite, HTML5 | | Бэкенд | Python 3.12, FastAPI, PostgreSQL, SQLAlchemy, Pydantic | | Интеграции | YandexGPT API (OpenAI-совместимый клиент) | | DevOps | Docker, Nginx, Git |

🏗️ Архитектура

• Клиент: SPA с динамической подгрузкой модулей. Сборка – Vite.
• Сервер: FastAPI (слойная архитектура: API → сервисы → БД).
• База данных: PostgreSQL (хранит сообщения, игровые состояния, диалоги с ИИ, сессии).
• Контейнеризация: Docker Compose связывает postgres, backend и nginx.

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

my_site/
│
├── client/                         # Фронтенд (Vite + TypeScript)
│   ├── src/
│   │   ├── scripts/                # Основная логика: модули, терминал, API
│   │   ├── style/                  # SCSS (БЭМ-блоки, глобальные стили)
│   │   └── assets/                 # Изображения, иконки, спрайты
│   └── dist/                       # Сборка для продакшена
│
├── server/                         # Бэкенд (FastAPI)
│   ├── app/
│   │   ├── __init__.py
│   │   ├── config.py               # Конфигурация из переменных окружения
│   │   ├── dependencies.py         # FastAPI-зависимости (сессия БД, AI-клиент)
│   │   ├── exceptions.py           # Пользовательские исключения
│   │   ├── handlers.py             # Глобальные обработчики ошибок
│   │   ├── logging_config.py       # Настройка логирования (файлы + консоль)
│   │   ├── main.py                 # Точка входа FastAPI
│   │   ├── middleware.py           # CORS, управление сессиями
│   │   ├── tags.py                 # Теги для группировки эндпоинтов
│   │   ├── utils.py                # Вспомогательные функции (error_response и др.)
│   │   ├── api/                    # Эндпоинты (терминал, контакты)
│   │   ├── database/               # Модели SQLAlchemy, настройки БД
│   │   ├── schemas/                # Pydantic-схемы (вход/выход API)
│   │   ├── services/               # Бизнес-логика (процессоры команд терминала)
│   │   └── logs/                   # Файлы логов (all.log, errors.log)
│   └── requirements.txt
│
└── README.md

✨ Ключевые особенности

• Игра «Крестики-нолики» с умным ботом, состоянием игры в БД.
• Общение с ИИ с сохранением контекста диалога.
• Безопасность: вычисление выражений через simpleeval, валидация ввода, CORS.
• Качество кода: аннотации типов, логирование, docstring (на русском), проверка mypy.
• Валидация данных через Pydantic на всех эндпоинтах (как на вход, так и на выход).

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

Результат Lighthouse в Google (Performance, Accessibility, Best Practices, SEO).

📦 Репозитории проектов

• GitHub: Stairuss
• GitFlic: stairus

📬 Контакты

• ВКонтакте: vk.com/id164444388
• Max: max.ru/u/...
• Email: pvy.vapsis@mail.ru (или через форму обратной связи на сайте)