Кейсы и проекты
Список постоянно обновляется
Ниже собраны живые примеры интерфейсов и мини-игр, которые я разрабатывал «с нуля» без бэкенда и сторонних CMS. Все кейсы открываются в браузере, работают офлайн и демонстрируют именно фронтенд-часть: верстку, логику, анимацию и производительность.
UI / UX детали
Тонкая настройка цвета, тени, микро-анимаций и фидбеков на каждое действие.
Производительность
Метрики Lighthouse, FPS-каунтеры и «чистый» бандл без лишних килобайт.
Интерактив
Canvas, WebGL, drag-n-drop и игровые механики на чистом JavaScript.
Экспорт данных
Генерация CSV, JSON или изображений прямо в браузере без сервера.
👉 Нажмите «Посмотреть проект», чтобы открыть демо в новой вкладке. Исходный код каждого кейса доступен на GitHub по запросу.
Проекты и выполненные Кейсы
Описание проекта
Программа для контроля своего времени с интуитивным интерфейсом и подробной статистикой. Помогает эффективно планировать и отслеживать затраты времени.
Основные функции:
- Учет времени по проектам и задачам
- Графики и отчеты по продуктивности
- Экспорт данных в CSV
- Настраиваемые категории и теги
Использованные технологии
Скриншоты проекта:
Описание проекта
Администратор сети, разработанный на Python и NMap. Предназначен для мониторинга и управления сетевой безопасностью.
Основные функции:
- Сканирование сети и устройств
- Обнаружение открытых портов
- Мониторинг активности в сети
- Генерация отчетов о безопасности
Использованные технологии
Скриншоты проекта:
Описание проекта
Полный рефакторинг и переписывание игры с React (3000+ строк) на чистый Vanilla JS. Цель — улучшить производительность, сократить время загрузки и убрать зависимости.
Основные функции:
- Уменьшение размера бандла на 85% (без React + Webpack)
- Ускорение первой отрисовки на 40% за счёт отказа от VDOM
- Архитектура «Entity–Component–System» на чистых классах ES6
- Анимация через requestAnimationFrame и Canvas 2D
- Локальное хранилище состояния без сторонних библиотек
Использованные технологии
Скриншоты проекта:
Описание проекта
Браузерный генератор статических сайтов из Markdown. Drag-and-drop файл → получаем готовый HTML-сайт за 60 секунд, без серверов.
Основные функции:
- Pure JavaScript (ES2023)
- Live-preview и instant ZIP-экспорт
- Responsive тема + SEO meta-теги
- Работает офлайн, вес < 150 KB
Использованные технологии
Описание проекта
Внутренний сервис для деплоя ПО в закрытых сетях. Python-backend отправляет плейбуки Ansible по SSH и отслеживает статус установки на каждом хосте в реальном времени.
Основные функции:
- REST API: /deploy, /status, /logs
- Ansible-роли для SAP, Docker, PostgreSQL, Nginx
- WebSocket-стрим логов установки
- JWT-авторизация и RBAC
Использованные технологии
Скриншоты проекта:
Описание проекта
Личный репозиторий «Python-скриптотека», который я собирал для себя и теперь делюсь с сообществом. Начинается с самых базовых логических операций и заканчивается алгоритмическими паттернами.
Основные функции:
- 100+ примеров от if/else до рекурсивных деревьев
- Готовые паттерны: «обход графа», «декораторы», «генераторы», «кэш»
- Пошаговые комментарии + playground-файлы
- Zero-dependency: запускается в любом Python ≥ 3.8
Использованные технологии
Описание проекта
Мини игра с не Мини сюжетом. Сюжет игры из личной вселенной, исторически сложенный. Процедурная генерация, продвинутая физика (логика). Файловое сохранение - без серверной части.
Основные функции:
- Дизайн - в разработке
- Ключевая механика - в разработке
- Физика - в разработке
- Работает на всех устройствасх - vanila JS, без привязки к типу устройств
Использованные технологии
Описание проекта
Здесь появятся новые кейсы после рефакторинга: React → Vanilla JS и другие миграции. Следите за обновлениями
Основные функции:
- Zero-dependency миграции
- Performance-сравнения
- Шаблоны и гайды в code-ing
- Различное - нужное и не очень