// React · TypeScript · Next.js

Frontend
разработчик

Зеленцов Александр

7 лет: от SPA-дашбордов до CMS под ключ

// 01 — задачи

Что я решаю

SPA и дашборды

Админки, личные кабинеты, сервисы реального времени. Redux Toolkit, роутинг, формы, WebSockets.

Сайты с CMS под ключ

Многостраничники, где контент правит редактор, а не разработчик. Next.js + Payload CMS + PostgreSQL.

Figma → код

Верстаю по чужому макету или рисую сам. Адаптив, кросс-браузерность, дизайн-токены.

Тесты: unit и скриншотные

Jest, Vitest, Testing Library. Storybook + Loki — регрессии вёрстки ловятся автоматически.

Интеграции

Онлайн-оплата, SMS, CRM, REST API, типобезопасные клиенты из OpenAPI-схем.

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

Static export, оптимизация LCP и бандла, мета и sitemap. Этот сайт — Lighthouse 95+.

// 02 — инструменты

Стек

Основное

  • React 18
  • TypeScript
  • Redux Toolkit
  • JavaScript
  • HTML
  • CSS/SCSS
  • Tailwind CSS 4

Фреймворки

  • Next.js
  • Payload CMS 3
  • React Router 7
  • PostgreSQL

Тесты

  • Jest
  • Vitest
  • Testing Library
  • Storybook
  • Loki

Инструменты и подходы

  • Vite
  • Git
  • CI/CD
  • Docker
  • REST API
  • OpenAPI
  • FSD
  • Zod
  • Figma

// 03 — работы

Кейсы

скрыто

Сайт с CMS под ключ

задача: Многостраничный сайт, контент должен править редактор без разработчика.

решение: Спроектировал и собрал соло: дизайн в Figma, контент-модель в Payload CMS, live preview для редактора, прод в Docker.

  • Next.js 16
  • Payload CMS 3
  • PostgreSQL
  • Tailwind 4
  • Vitest
скрыто

Промо-сайт производителя

задача: Сайт производителя с версиями под города и приёмом заявок.

решение: Статический Next.js с мультигородской схемой на поддоменах, приём заявок с вложениями без отдельного бэкенда, SEO-обвязка.

  • Next.js
  • TypeScript
  • Tailwind 4
  • FSD
  • SQLite
скрыто

Сайт и CRM для сервиса

задача: Сервису нужен сайт и CRM: бронирования, SMS-уведомления, онлайн-оплата.

решение: Сделал под ключ: дизайн в Figma за две недели, вёрстка, интеграции, скриншотные тесты. Хостинг оптимизировал с $30 до $1/мес.

  • React
  • TypeScript
  • Redux
  • Storybook
  • Loki
скрыто

B2B-сервис реального времени

задача: Дашборд и лендинг для сервиса на WebSockets. Название — под NDA.

решение: Монорепозиторий с Python-бэкендом: дашборд на React 18 + Vite, типобезопасный API-клиент генерируется из OpenAPI-схемы.

  • React 18
  • Vite
  • RTK
  • Tailwind 4
  • OpenAPI
  • Vitest

// 04 — путь

Опыт

  1. с 2023

    ВертексFrontend developer

    Аутсорс: внутренний продукт логистики, затем клиентские проекты. Кросс-функциональная команда.

  2. с 2020

    Saint GhettoFrontend developer

    Фитнес-шеринг: сайт и CRM под ключ, сейчас поддержка. Параллельная занятость.

  3. с 2019

    MAED AcademyHTML-верстальщик

    Старт: сложные адаптивные макеты из Figma, работа в паре с дизайнером.