Коммерческий проектAvenue Group

OKKP — платформа операционного управления

Главный full-⁠stack разработчик · с нуля

Платформа операционного управления, которую я спроектировал и запустил с нуля: управление сотрудниками, учёт нарушений и отчётные дашборды с ролевым доступом и журналом аудита.

Закрытый код · NDA

Фронтенд

React + TypeScript · SPA · дашборды по ролям
REST

API

Node.js / Express · REST API
  • Авторизация · RBAC
  • Сотрудники
  • Нарушения
  • Отчётность
  • Журнал аудита
SQL · документы · медиа

Данные

PostgreSQL · SQL
MongoDB · документы
Cloudinary · медиа
OKKP — платформа операционного управления — превью
Код закрыт (NDA), поэтому здесь схема архитектуры, которую я построил.Открыть в полном размере

Задача

Avenue Group нужна была единая система для операционной работы — сотрудники, нарушения, отчётность, — причём отчёты должны были работать для сотрудников, которые не пишут запросы.

Решение

Я спроектировал и построил её целиком: SPA на React + TypeScript, REST API на Node.js / Express и слой данных на PostgreSQL + MongoDB, с ролевым доступом, журналом аудита и защищённой загрузкой файлов в Cloudinary. Деплой и поддержка в продакшене — тоже на мне.

Результат

Запущена в продакшен; сотрудники сами выгружают данные для аудита в Excel.

Обзор

В Avenue Group я был главным full-⁠stack разработчиком OKKP — платформы операционного управления, которая начиналась с пустого репозитория. Задача — единая система для повседневной работы компании с чёткими границами между интерфейсом, бизнес-логикой и слоем данных.

Архитектуру я выстроил целиком: SPA на React + TypeScript, REST API на Node.js / Express, данные в PostgreSQL и MongoDB. Поверх неё — ключевые модули: управление сотрудниками, учёт нарушений и отчётные дашборды с ролевым доступом и журналом аудита, а также защищённая загрузка медиафайлов через Cloudinary и Multer.

Отчётность должна была работать для людей, которые не пишут запросы, поэтому выгрузка в Excel позволяет сотрудникам без технической подготовки самостоятельно собирать данные для аудита. Деплой и поддержка в продакшене тоже были на мне, а интерфейс на Tailwind CSS полностью адаптивный.

Что делает

  • Управление сотрудниками, учёт нарушений и отчётные дашборды
  • Ролевой доступ и журнал аудита во всех модулях
  • Защищённая загрузка медиафайлов через Cloudinary и Multer
  • Выгрузка в Excel: данные для аудита без участия разработчика

Что дальше

Ищете full-⁠stack, Python- или AI-⁠разработчика — или нужно сделать что-то похожее? Давайте обсудим.

Готов приступить сразу: офис или гибрид в Москве, либо удалённо; полная занятость или контракт. Отвечаю в течение 48 часов, в Telegram — быстрее.

Связаться TelegramСкачать резюме

Альхассан Альфарран.

© 2026 · Спроектировал и сделал сам. Стек сайта: Next.js, Tailwind и Framer Motion.

Моё местное время: · Москва

Заметки
Как устроен этот сайт

Стек

Next.js (App Router) и React, стили на Tailwind CSS, анимации на Framer Motion. Форма обратной связи отправляет письма через Resend, сайт размещён на Vercel.

Три языка, одна вёрстка

У английской, русской и арабской версий свои адреса (/en, /ru, /ar), а собраны они из одних и тех же компонентов. В вёрстке используются логические CSS-свойства (start/end вместо left/right), поэтому арабская версия отражается справа налево без отдельных стилей. Сервер отдаёт каждую страницу сразу с нужным языком и направлением текста, так что после загрузки ничего не перескакивает, а арабский шрифт загружается, только когда на экране есть арабский текст.

Скорость и доступность

Секции ниже первого экрана не отрисовываются, пока страница не прокручена до них, а быстрое меню загружается при первом открытии. Всем можно пользоваться с клавиатуры — есть ссылка для перехода к содержимому и заметный фокус, — а анимации отключаются, если в системе включено уменьшение движения.

Исходный код на GitHub