Fullstack devolper

На данный момент Frontend devolper.

Мои компетенции и опыт

Профессиональный опыт

Junior Frontend Developer

3KGroup, удалённо

Февраль нужен доступ к резюме Июль нужен доступ к резюме месяцев)

Архитектура и технологии:

Feature-Sliced Design (FSD):

Организовал обучение команды: провёл два подробных воркшопа по 2 часа каждый по основам FSD и разбору конкретного кода нашего проекта.

Разработал шаблон модуля и гайдлайн, которым теперь пользуются все новые участники проекта.

Стэк и инструменты:

Обновил сборку до React 18 + TypeScript 5.0, настроил ESLint + Prettier с корпоративными правилами.

Внедрил Storybook для UI-компонентов, что сократило время дизайно разработки итераций на 25%.

Интегрировал Chakra UI и Material UI, подготовил библиотеку внутренних компонентов, чтобы обеспечить единообразие интерфейсов.

Разработка функционала и UX:

Динамическая навигация

Спроектировал и реализовал иерархический роутинг (group → subgroup → item) с кастомным хук-менеджером состояния и реактивными bread-crumbs.

Провёл UX-тестирование с 5 пользователями: получил 90% одобрение удобства перемещения по разделам.

Real-time уведомления:

Настроил сервер на нужен доступ к резюме + нужен доступ к резюме и интегрировал клиентский модуль: уведомления вылетают мгновенно при любых изменениях в системе.

Внедрил visual cues, чтобы пользователи не пропускали важные события.

Оптимизация производительности:

Разбил сборку на 12 ленивых чанков с нужен доступ к резюме и dynamic imports; initial bundle уменьшился на 40%.

Настроил prefetching критичных модулей через , подняв скорость Time to Interactive до 1.6 с.

PWA и offline-поддержка:

Реализовал Service Worker для кеширования маршрутов и API-запросов, чтобы приложение работало без сети.

Настроил push уведомления через Web Push API, увеличив retention мобильных пользователей на 20%.

Инфраструктура и процессы:

CI/CD пайплайн

Спроектировал и запустил GitHub Actions, включил этапы: линт, unit-тесты, e2e-тесты и авто деплой.

Внедрил канареечный релиз: 10% трафика сначала тестируется в staging, что снизило регрессивные баги на 60 %.

Тестирование и качество кода:

Написал 150+ unit-тестов на Jest + React Testing Library и 30 e2e-тестов в Cypress.

Настроил SonarQube для непрерывного анализа кода: покрытие не опускается ниже 85%.

Метрики и мониторинг:

Ввел DORA-метрики (Lead Time, MTTR) и регулярный отчёт в Confluence, чтобы команда видела свой прогресс.

Настроил сбор метрик производительности через Google Lighthouse API и автоматический отчёт в Slack канале.

Командная коммуникация и лидерство:

Аджайл-практики

Вёл ежедневные стендапы (15 мин) и двухнедельные спринты по Scrum: выступал Scrum мастером каждые чётные спринты.

Проводил ретроспективы с развлечением (мини-игра start-stop-continue), чтобы вовлечение оставалось.

Технические митапы и обмен опытом:

Организовал 6 внутренних Lightning Talks (10 мин каждый) по темам micro-frontend, маршрутизации и оптимизации рендеринга.

Приглашал экспертов из внешних команд на формат “Dev Coffee” для обмена лучшими практиками.

Менторство и онбординг:

Настроил buddy программу: каждому новичку выдавал опытного напарника для прохождения первых задач.

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

Кросс-функциональное взаимодействие:

Работал бок о бок с дизайнерами: участвовал в прототипировании интерфейсов, предлагал улучшения в Figma.

Синхронизировался с бэкендкомандой: формировал требования к API, оптимизировал payload для мобильных клиентов.

Итог за 6 месяцев:

Создал прочную основу для роста проекта и команды: от архитектуры до процесса доставки.

Внедрил передовые практики, которые повысили качество кода, скорость релизов и удовлетворённость пользователей.

Готов масштабировать эти подходы на новые продукты и вести команду к ещё более амбициозным целям!

Fullstack - devolper 

Pancake Production

Июль нужен доступ к резюме Июнь нужен доступ к резюме месяц.

1. Еженедельные синхронизации и Agile-процесс

График встреч:

Основной созвон – каждый понедельник в 10:00.

При необходимости — дополнительный созвон по пятницам для срочных фиксов.

Структура созвонов:

Постановка целей (10 мин): обсуждение приоритетов и распределение задач.

Демонстрация (15 мин): живая демонстрация новых фич в staging‑окружении.

Ретроспектива (5 мин): выявление узких мест и корректировка процесса.

Результат за 1,5 месяца:

Ускорили цикл спринта: среднее время от задачи до релиза — 5 рабочих дней.

Снизили критические баги в продакшене на ~20 %.

2. Backend: микросервисная архитектура и FSD

2.1 Общая структура

Ядро: Python  нужен доступ к резюме , FastAPI, aiohttp для взаимодействия с YouTube API.

Хранилище: PostgreSQL (основные данные), Redis (кэширование).

CI/CD: GitHub Actions + Docker: автоматический билд, тесты и линтинг на ветках develop и main.

2.2 Feature‑Sliced Design (FSD)

Слои:

App: инициализация, логирование, мониторинг.

Pages: REST‑эндпойнты (/channels/{id}/media-kit, /videos/{id}/tracking).

Features: бизнес‑логика расчёта метрик.

Entities: модели Channel, Video, Metrics.

Shared: утилиты форматирования дат, расчёта процентов.

Эффект: фокус на фичах и чёткая структура ускорили подключение новых разработчиков — первый пулл‑реквест уже на второй неделе работы.

3. Frontend: миграция с JSX на TSX и FSD

3.1 Миграция на TypeScript

Исходник: React 17 + JSX, Styled Components.

План:

Настроили нужен доступ к резюме с strict: true.

Переименовали файлы .jsx → .tsx.

Типизация пропсов и стейта, вынесли типы API‑ответов в src/entities.

Подключили ESLint + Prettier для единообразия.

Результаты:

Число runtime‑ошибок упало на 60 %.

Автодополнение в IDE ускорило разработку компонентов на 15 %.

3.2 FSD-структура во фронтенде

css

Копировать

Редактировать

src/

├── app/

│ ├── providers/

│ └── нужен доступ к резюме

├── pages/

│ └── ChannelAdminPage/

├── features/

│ ├── MediaKit/

│ ├── TrackingLinks/

│ └── AudienceAnalytics/

├── entities/

│ ├── channel/

│ └── video/

└── shared/

├── components/

└── utils/

Ключевые компоненты:

MediaKitTile — плитка метрики;

ChannelSwitcher — селект и иконки‑кнопки для выбора канала.

4. Дашборд и пользовательский интерфейс

4.1 Стартовая страница

Описание сервиса и карточки привязанных каналов.

Кнопки “Привязать канал” (OAuth Google) и “Создать медиакит”.

4.2 Админка канала

Шапка: лого, название, тумблер трекинга.

Переключение каналов: Select + иконки.

Media Kit (по умолчанию — 90 дней):

Базовые данные: название, handle, описание (сворачиваемое), логотип, дата создания, язык, категория.

Метрики: подписчики, просмотры, long‑form vs shorts (количество, просмотры, сравнение с предыдущим 30‑дн. периодом %/абс.).

Вовлечённость: ER (лайки+комменты)/просмотры*100, средняя длительность (мин/%), рассчитанные для последних 5 long‑form и 15 shorts.

Аудитория: топ‑5 стран (диаграмма), пол/возраст (столбчатая), устройства (иконки).

Стоимость рекламы: список форматов (интеграция, преролл, мидролл, шортс) с ценами и CPM; расчёт бюджета = views/1000×CPM.

Топ‑5 видео: ролики и shorts за 90 дн. по просмотрам.

Tracking Links:

Модалка создания: URL, период, CPM (редактируемый).

Таблица ссылок: “Копировать”, “Редактировать”, “Просмотреть”.

4.3 Публичная страница ссылки

Мини‑дашборд видео: просмотры, ER, средняя длительность, география, демография.

Калькуляция бюджета кампании (views/1000×CPM) без авторизации.

5. Роль ментора и командный рост

Воркшопы по FSD: 2‑часовые сессии по организации слоёв и срезов.

Pair‑programming: более 10 часов совместного кодирования, поддержка в миграции на TSX.

Документация:

Шаблоны PR‑чек‑листов (тесты, типы, описание).

Гайд «JSX → TSX» в Confluence (150+ просмотров).

6. Итоговые достижения и перспективы

Релизы: новая функциональность каждые 2 недели без регрессий.

Надёжность: продакшен‑инциденты разово, решены за несколько часов.

Вектор развития:

Live‑обновления через WebSocket.

Сравнительный анализ с публичными данными других каналов.

Поддержка TikTok и Instagram Reels.

ML‑модули для прогнозирования роста аудитории и бюджета.

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