Oleksandr Khutornyi
Предложите Oleksandr работу над вашим следующим проектом или зарегистрируйте профиль фрилансера и начинайте зарабатывать прямо сейчас.
Рейтинг
Уровень владения языками
Навыки и умения
Портфолио
- Все работы 6
- Java 1
- Интернет-магазины и электронная коммерция 1
- Создание сайта под ключ 1
- Веб-программирование 3
-
89 825 UAH Я всадник
Веб-программированиеiRide — это динамичная веб-платформа для сети мотошкол, мотосервисов и площадок по продаже мотоциклов в Запорожье и Днепре. Проект разработан с нуля для автоматизации взаимодействия с клиентами, презентации услуг компании и сбора лидов.
Роль в проекте: Fullstack Developer (Единственный разработчик)
… Тип проекта: Коммерческий / Case Study
Технологический стек
Backend: Java 17, Spring Boot, Spring MVC
Frontend: HTML5, CSS3 (Modern Flexbox/Grid), JavaScript (Vanilla ES6)
Шаблонизатор: Thymeleaf
Архитектура: MVC (Model-View-Controller)
1. Умная геолокация и кастомизация контента (Spring Boot + Cookies)
Проблема: Сеть работает в двух городах с разными ценами, графиками и адресами. Нужно показывать релевантный контент без принудительной регистрации.
Решение: Реализована система сохранения выбора города в Cookies (selectedCity). Создан контроллер, который при первом визите на любую страницу сайта (даже если пользователь пришел с Google сразу на внутреннюю страницу) проверяет наличие куки. Если она отсутствует — Thymeleaf рендерит модальное окно выбора города, блокируя интерфейс. После выбора страница обновляется без потери контекста с помощью HTTP-заголовка Referer.
2. Премиальный UX/UI и адаптивность (Premium UI)
Эффект Glassmorphism: Для карточек и модальных окон использован современный эффект размытия фона (backdrop-filter: blur). Для обеспечения кроссбраузерности на мобильных устройствах (в частности iOS Safari) интегрированы вендорные префиксы и fallbacks для устаревших систем.
Fullscreen-Бургер Меню: Разработана адаптивная навигация для мобильных устройств. Меню разворачивается на весь экран с помощью CSS clip-path: circle() (эффект плавного раскрытия кругом из точки клика). Интегрирована динамическая задержка появления элементов (Staggered Animation с помощью CSS-переменных --i). Для предотвращения багов прокрутки во время открытого меню реализовано блокирование body { overflow: hidden } на уровне JavaScript.
3. Клиентская валидация данных без сторонних библиотек
Проблема: Пользователи часто ошибались при вводе номеров телефонов (вводили буквы, не дописывали цифры), что приводило к потере лидов.
Решение: Написан кастомный JavaScript-модуль для маски ввода телефона на чистом JS (Vanilla). Скрипт автоматически подставляет национальный префикс +380 при первом нажатии на цифру, блокирует ввод любых букв или спецсимволов (регулярные выражения \D), автоматически форматирует строку и ограничивает длину до стандартного украинского формата. Дополнительно добавлена HTML5 pattern валидация для защиты от отправки неполных номеров.
-
67 369 UAH ПАУЗА
Веб-программированиеPAUSE — это высокотехнологичный веб-сайт для студии лазерной эпиляции в Киеве, ориентированный на высокую конверсию и премиальный опыт пользователя. Главная особенность проекта — интеллектуальная система онлайн-бронирования визитов в реальном времени с автоматической передачей данных на бэкенд.
Интерфейс разработан с фокусом на мобильные устройства, скорость загрузки (Core Web Vitals) и эффекты погружения (smooth-анимации, элементы стеклянного морфизма). Технологический стек (Tech Stack)
Бэкенд: Java 17, Spring Boot, Spring MVC, Spring Data JPA
…
База данных: PostgreSQL (миграции, оптимизация сохранения и выборки данных по датам и часам)
Фронтенд: HTML5, CSS3 (Custom Grid Layouts, Glassmorphic UI), JavaScript (Vanilla ES6 для высокой скорости)
Шаблонизатор: Thymeleaf (серверный рендеринг для SEO-оптимизации и быстрого First Contentful Paint)
API и Интеграции: Telegram Bots API (мгновенное уведомление администраторов)
DevOps и Инструменты: Docker, Git, Linux (VPS), Google Search Console
Выполненные работы и Реализованный функционал
1. Архитектура и Бэкенд (Spring Boot & DB)
Разработка REST API для динамического управления услугами, категориями, свободными датами и временными слотами (обработка через BookingFormDTO).
Логика валидации слотов: Реализован алгоритм проверки доступности времени на стороне сервера, который полностью исключает риск овербукинга (двойной записи на одно и то же время).
База данных: Спроектирована реляционная структура в PostgreSQL для хранения прайс-листов, категорий зон и логов текущих бронирований.
2. Премиальный UX/UI и Фронтенд-оптимизация
Гибкий прайс-аккордеон: Создан интерактивный прайс-лист с использованием современного подхода CSS Grid (переход grid-template-rows от 0fr до 1fr) для идеально плавной анимации развертывания таблиц без рывков и резких скачков контента.
Универсальное интерактивное модальное окно записи:
Разработана двухуровневая система выбора «Категория -> Зона эпиляции» с динамическим подтягиванием цен, длительности и автоматическим заполнением скрытых полей формы для отправки на сервер.
Кастомный интерактивный календарь и сетка временных слотов с визуальным блокированием (классы disabled и fully-booked) уже занятых или прошедших часов.
Оптимизация под мобильные экраны: реализован лимит высоты (max-height: 85vh) и скрыты системные скроллбары пользователя с помощью CSS для сохранения чистоты дизайна.
3. Автоматизация и Уведомления (Telegram Integration)
Интегрирован модуль автоматической отправки заявок в Telegram-канал студии сразу после успешного подтверждения формы (submit). Уведомление содержит полную информацию о записи: Имя, Телефон, Выбранная зона, Стоимость, Дата и точное Время визита.
4. Скорость и SEO (Core Web Vitals)
Минимизировано использование тяжелых сторонних JS-библиотек — весь интерактив (календарь, маски телефонов, валидация, анимация) написан на чистом JavaScript (Vanilla ES6). Это обеспечило мгновенную загрузку страницы на смартфонах даже в условиях слабого мобильного соединения.
Настроена правильная семантическая структура тегов для полной индексации поисковыми роботами Google.
Бизнес-результат разработки
Сайт преобразован из базовой страницы-визитки в автономный инструмент генерации лидов. Клиент получает возможность записаться на процедуру в несколько кликов, а администраторы студии мгновенно видят новые брони в мессенджере, что снизило время обработки одной заявки до нескольких секунд.
-
359 300 UAH эрадрон
Интернет-магазины и электронная коммерцияПроект Eradrone посвящен разработке и продвижению решений в сфере аграрных дронов. Его цель — помочь фермерам и агрокомпаниям автоматизировать обработку полей, мониторинг посевов и снизить затраты за счет использования современных беспилотных технологий.
В рамках проекта реализовано:
… презентационный сайт агродронов,
описание услуг и технических решений,
возможность обращения/заказа консультации,
техническую реализацию веб-части (frontend + backend).
Проект сочетает аграрную тематику и веб-разработку, ориентирован на реальный бизнес и практическое применение технологий.
-
404 213 UAH PizzaYM
Создание сайта под ключПроект: PizzaYM — Современное Веб-приложение для Заказа Пиццы
Описание проекта
PizzaYM — это динамичное, интерактивное и интуитивно понятное веб-приложение, созданное для быстрого и удобного заказа пиццы онлайн. Главная цель проекта — обеспечить пользователю качественный клиентский опыт (UX) от момента выбора ингредиентов до оформления доставки, минимизировав количество кликов.
… Стек технологий (Tech Stack)
Выбери и оставь то, что было использовано в проекте:
Frontend: HTML5, CSS3/SCSS, JavaScript (ES6+) / React.js / Vue.js
Управление состоянием: Redux Toolkit / Context API / Pinia
Стилизация: Tailwind CSS / Styled Components / Bootstrap
Backend & База данных: MySql
Инструменты: Vite / Webpack, Git, GitHub
Ключевой функционал, который я реализовал
Интерактивный каталог товаров: Удобная сетка пицц с динамической фильтрацией по категориям (мясные, вегетарианские, острые и т.д.) и сортировкой по цене или популярности.
Система корзины (Cart System): Реализован полный цикл управления корзиной — добавление, удаление, изменение количества порций, автоматический пересчет общей стоимости и количества товаров в реальном времени без перезагрузки страницы.
Конфигуратор продукта: Возможность выбора размера пиццы и типа теста с динамическим изменением цены в зависимости от выбранных параметров.
Форма оформления заказа (Checkout): Валидация данных пользователя (имя, телефон, адрес доставки) перед отправкой заказа.
Адаптивный дизайн (Responsive Web Design): Сайт полностью оптимизирован под все типы устройств — от мобильных телефонов до широкоформатных мониторов (Mobile-first подход).
Мои достижения и технические вызовы
Оптимизация производительности: Настроил эффективное управление состоянием приложения, что позволило избежать лишних повторных рендеров компонентов при активной работе с корзиной.
Чистый код и архитектура: Использовал компонентный подход, разделяя логику приложения и интерфейс, что делает проект легким для поддержки и масштабирования.
Работа с асинхронными данными: Реализовал плавную загрузку данных меню с сервера с обработкой состояний загрузки (Skeleton loaders) и возможных ошибок сети.
-
67 369 UAH СкайНет бот
JavaКастомизированный бот для отслеживания флота с интеллектуальной логикой безопасности
Я разработал SkyNet, специализированное решение для отслеживания, предназначенное для логистических и транспортных компаний. Этот бот предоставляет общий обзор операций флота, преобразуя сложную GPS-телеметрию в упрощенный интерфейс мониторинга в реальном времени.
… Динамическая логика статуса и визуализация
Суть системы основана на адаптивном алгоритме отслеживания статуса. Чтобы обеспечить максимальную эффективность для менеджеров флота, я внедрил систему визуализации с цветовой кодировкой, которая отражает текущее состояние каждого транспортного средства:
Активный статус: Подтверждает, что транспортное средство находится в движении с устойчивым соединением данных.
Ожидание/статичный статус: Автоматически определяет, когда транспортное средство остановилось на короткий срок или на запланированный перерыв.
Критический/офлайн статус: Подчеркивает транспортные средства, которые находились в статичном состоянии слишком долго или потеряли соединение неожиданно.
Этот визуальный подход позволяет пользователям одновременно отслеживать десятки единиц без необходимости анализировать отдельные журналы данных.
Проактивные функции защиты от глушения и безопасности
Ключевым техническим моментом этого проекта является специализированная логика для обнаружения помех сигнала. Стандартные системы отслеживания часто не могут отличить простую потерю сигнала от преднамеренной попытки заблокировать GPS/GSM сигнал.
SkyNet запрограммирован на выявление конкретного паттерна падения сигнала, вызванного устройствами глушения. Если соединение транспортного средства подавлено, бот немедленно запускает оповещение высокого приоритета и изменяет статус транспортного средства на отчетливый цвет предупреждения. Это позволяет оператору мгновенно реагировать на потенциальные нарушения безопасности или попытки кражи.
Ключевые технические возможности:
Интеграция API в реальном времени с GPS-оборудованием.
Автоматизированный мониторинг времени простоя транспортного средства и операционной эффективности.
Мгновенная система оповещения о несанкционированных остановках или потере сигнала.
Оптимизированный бэкенд для обновлений с низкой задержкой и высокой надежностью.
Это решение идеально подходит для бизнеса, ищущего легкую, но мощную альтернативу тяжелому программному обеспечению для управления флотом, с акцентом на безопасность и интуитивно понятный пользовательский опыт.
-
538 950 UAH F7
Веб-программированиеПроект F7
F7 — это платформа для преподавателей английского языка и их учеников, которая обеспечивает полный функционал для онлайн-обучения. Проект включает:
… Кабинет пользователя с доступом к урокам и материалам
Подписку и оплату курсов через интегрированные платежные системы
Систему уроков с контролем доступа после оплаты
Авторизацию и аутентификацию, восстановление пароля, удаление аккаунта
Полноценный сайт со всеми необходимыми функциями для работы преподавателей и учеников
Этот проект демонстрирует мой опыт в полноценной веб-разработке, включая frontend + backend, логику доступа, платежные интеграции и безопасность пользователей.
Активность
| Последние ставки 10 | Бюджет | Добавлена | Сроки | Ставка | |
|---|---|---|---|---|---|
|
Интернет-магазин обуви
25 000 UAH
|
|||||
|
Магазин промышленного швейного оборудования
22 000 UAH
|
|||||
|
Создание сайтов, блокчейн разработчики
12 864 UAH
|
|||||
|
Доработка/переработка интернет-магазина зоотоваров на сайте груминг-салона
15 000 UAH
|
|||||
|
Разработка сайта-конструктора фотокниг и фоторамок
17 965 UAH
|
|||||
|
Full-stack разработка
202 106 UAH
|
|||||
|
Необходимо создать современный корпоративный лендинг для компании в сфере консалтинга/финансов.
25 000 UAH
|
|||||
|
Разработка CRM системы для товарного бизнеса
27 000 UAH
|
|||||
|
Разработка 4-страничного сайта-опроса (2 экрана/блока)
9000 UAH
|
|||||
|
Разработка премиального сайта под ключ – техническое задание и условия
51 456 UAH
|