Telegram Group Search
⚙️ Мой первый серьезный проект: как я, джун, работал за мидла в британском финтехе

После четырех месяцев испытательного срока меня наконец отправили на первый настоящий проект — в британскую финтех-компанию Trastra (https://trastra.com). Это был совершенно новый уровень. Мне предстояло разрабатывать основное веб-приложение компании и писать код для мобильного приложения на React Native. При этом я никогда раньше не работал с React Native!

По легенде я был мидлом с 4-летним опытом разработки на React + React Native. Да-да, именно в своей первой компании я впервые столкнулся с накруткой опыта. Меня, джуна без коммерческого опыта, компания продала клиенту как мидла с 4 годами опыта! Клиент платил за меня 3500€ в месяц. Я получал... всего 25 000 рублей

🕯 Первое знакомство с "взрослым" Scrum

Trastra была крупной платформой с большой кодовой базой. Впервые в жизни я увидел, как работает настоящая agile-команда:
- 18 специалистов разного профиля
- Полный набор ролей: скрам-мастер, тимлид, 3 фронтендера, 6 бекендеров, 3 QA, 2 аналитика, дизайнер
- Все ритуалы: ежедневные стендапы, планирование спринтов, ретроспективы

🗓 Первые недели адаптации

Первое время было страшно и сложно. Я терялся в таком большом проекте. Но мне помогал мой тимлид из аутстаф-компании:
- Каждый мой коммит и пул-реквест сначала проходил через него
- Он правил мой код: "Смотри, мидл бы здесь сделал иначе..."

Тимлид со стороны Trastra искренне считал, что имеет дело с опытным разработчиком

Уже через месяц работы:
- 90% задач закрывал самостоятельно
- Научился работать напрямую с командой заказчика
- Мои задачи попадали в продакшен — я гордился этим!

💡 Переломный момент

Но когда после нескольких месяцев успешной работы я попросил повышение до 40 тысяч, мне отказали. Этот момент перевернул мое сознание. Я вдруг осознал несправедливость ситуации: вокруг сидели такие же ребята, которые уже 1-2 года работали за 60-100 тысяч, выполняя задачи мидлов и даже сеньоров, но боялись уйти. В тот же день я обновил резюме. Оказалось, мой реальный опыт уже стоил гораздо больше...

📌 На видео мой первый проект. Радуюсь, что сделал валидацию. Кстати, на сайте Trastra показан интерфейс приложения, а на нём то, что я делал. Как раз таки я разрабатывал функциональность SEPA-переводов, историю переводов, создание платежа с вводом реквизитов. Это всё делал я!

Ну и ещё коллаж из фото, рабочий вайб. Как же я был счастлив тогда. "Мама, я — айтишник!"


Кстати, только сейчас заметил, что мокап (это картинка айфона) — это продукт моей будущей компании. Ничего себе отсылка! 🤯😁
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🌐 Работа в международной компании

Когда я во второй раз выходил на рынок труда, у меня уже было около 9 месяцев опыта. Я помню, как обновлял резюме и буквально в первые же дни получил множество приглашений на собеседования. Поиск работы тогда занял всего несколько недель.

После собеседований у меня было несколько предложений, но я выбрал вариант с возможностью удалённой работы и, что важнее, действительно интересным проектом. Так я оказался в компании LS.Graphics (https://www.ls.graphics/) на позиции Junior+ с зарплатой 60 тысяч рублей. Для 2022 года, особенно после моей первой работы в аутсорсе (где я получал 25 тысяч), это было круто.

Почему LS.Graphics?

Эта компания создаёт продукты для дизайнеров: графические элементы, мокапы, плагины и целые сервисы, которые помогают в работе. Но самое крутое — масштаб её влияния. Около 90% клиентов — это европейские и американские компании, включая таких гигантов, как Apple, Microsoft, Nike, IBM и Adobe. Если говорить о России, то среди пользователей продуктов LS.Graphics — Сбер, Яндекс, Авито, Т-Банк и другие крупные компании.

А теперь самое интересное: если вы когда-либо видели мокап iPhone в рекламе или на сайте компаний — с вероятностью 80% он был сделан в LS.Graphics. Да, именно их мокапы Apple использует для презентации своих смартфонов.

🎮 Разработка топового Figma-плагина

Мне посчастливилось работать над плагином для Figma, который входит в топ-6 самых популярных с 1,2 млн пользователей. Figma - основной инструмент 90% дизайнеров мира, и плагин неизменно входил во все авторитетные подборки "Топ-10 лучших плагинов Figma". Ежемесячно через наш плагин создавались десятки тысяч дизайн-проектов.

Когда я присоединился к проекту, передо мной стояла амбициозная задача:
- Провести полный рефакторинг кода
- Внедрить TypeScript и новую архитектуру
- Оптимизировать графический движок (Canvas + Three.js)

Особую сложность представляла работа с графическим движком на базе Canvas (Fabric.js) и 3D-визуализацией (Three.js), которые были основной функциональностью плагина.

За 6 месяцев не осталось ни одного файла, который я бы не изменил. Плагин действительно стал работать быстрее, количество багов уменьшилось, а кодовая база сократилась на 70%.

Вообще, плагин я рефакторил в 3 этапа за 2 года. Каждый раз находилось что-то, что можно было улучшить, потому что я развивался.

🔼 Развитие плагина и новые вызовы

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

Мне удалось глубоко погрузиться в работу с Canvas и Three.js, решая нестандартные задачи.

Одной из ключевых проблем была производительность при работе с большими документами. Я провёл серию оптимизаций:
- Устранил подвисания — переработал алгоритмы обхода дерева элементов, что особенно критично для сложных проектов.
- Ускорил поиск нод — внедрил кеширование, что сократило время обработки запросов.
- Оптимизировал вставку дизайна — раньше на это уходило 3-4 секунды, после доработок время сократилось до 1 секунды.

⚙️ Разработка модуля командной подписки

Помимо работы над самим плагином, я занимался разработкой системы подписки для команд:
- Спроектировал архитектуру — продумал сущности в БД, API и бизнес-логику.
- Реализовал бекенд и фронтенд — от обработки платежей до интерфейса управления подписками.
- Интегрировал платёжную систему — обеспечил безопасное проведение транзакций и автоматическое продление подписок.

Это был полноценный цикл разработки — от идеи и проектирования до релиза и поддержки.

Особенно приятно было, когда этой функцией начали активно пользоваться. В итоге за 7 месяцев купили более 100 командных подписок, а общее количество пользователей в командах достигло около 700. Со временем эта функция стала приносить ещё больше дохода, и всё больше компаний переходили на такой тип подписки.

📌 На картинках — рейтинг плагинов в Figma, а также сам плагин.

В следующих постах я расскажу вам о других проектах, над которыми работал. Будет интересно!
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
➡️ Миграция бекенда и масштабный рефакторинг

Одним из ключевых этапов моей работы в LS.Graphics стала миграция бекенда с Firebase Firestore на MongoDB. Это был мой первый такой опыт работы с бекендом и базами данных. Эти улучшения значительно улучшили производительность и масштабируемость сервиса.

Что было сделано:
- Переписал ядро сервиса, оптимизировал запросы и обновил архитектуру.
- Вместе с командой продумали новую схему хранения сущностей, связи между ними и механизмы взаимодействия.
- Добавил кеширование частых запросов и систему ревалидации, что снизило нагрузку на базу и ускорило отклик сервиса.

🖥 Разработка веб-приложения с графическим редактором

Этот проект стал для меня важной вехой - создание проекта с нуля. На разработку от начального проектирования до выпуска в продакшен ушло около 7 месяцев.

Впервые в своей практике я полностью самостоятельно:
- Проектировал архитектуру приложения
- Выбирал технологический стек
- Составлял техническую документацию
- Осуществлял полный цикл разработки

Для проекта я выбрал Next.js, нам критически был необходим СЕО. Пришлось знатно перелопатить базу данных, для добавления слагов и упрощения структуры данных. Я реализовал сложный поиск продуктов, внедрил расширенный редактор мокапов. Добился отличных показателей СЕО, а так же неплохую скорость. Большая часть страниц отдавалась с сервера моментально. А так же добавили CDN + внедрили общие практики оптимизации изображений.

💎 Разработка графического SVG-редактора

Главным и наиболее сложным проектом в моей карьере стал графический редактор для работы с SVG - аналог Figma, который я разрабатывал в течение года. Это было полноценное standalone-решение, интегрированное с нашей платформой мокапов.

Основные возможности редактора:
- Бесконечный холст с поддержкой множества элементов
- Полный набор трансформаций: перемещение, масштабирование, вращение
- Многоуровневая система слоев с возможностью изменения структуры
- Комплексный SVG-парсер, создающий оптимизированную структуру с правильным именованием элементов и свойств

Система управления состояниями:
- Реализация Undo/Redo через IndexedDB
- Поддержка более 300 состояний холста
- Оптимизированный механизм хранения (сжатие данных)
- Минимизация перерисовок для плавной работы
- Работа с растровыми изображениями: Кадрирование, Обрезка, Трансформации.
- Система горячих клавиш: Более 50 комбинаций, Настраиваемые сочетания
- Экспорт результатов: Поддержка множества форматов
- Модуль предпросмотра перед сохранением

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

Дополнительные проекты и опыт

В рамках работы в LS.Graphics я также реализовал несколько других значимых проектов:

1. Десктопная версия плагина (Electron.js)
2. Единый UI Kit для всех проектов
3. Реализовал 2 AI-сервиса
4. Работал над добавлением новых фич в CRM платформу

Было интересно работать с разными технологиями и продуктами.

📌 На картинках — 3 продукта над которыми я работал

В следующем посте я расскажу о своем первом стартапе и о том, как научился создавать приложения полного цикла: фронтенд, бэкенд, администрирование, настройка и деплой.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
😮 Мой первый стартап — сервис онлайн-записи App-Salute

Навыки, которые я получил на работе, очень пригодились мне. Моя сестра — успешный стилист с собственным бизнесом и большим влиянием в бьюти-сфере своего города. Именно она вдохновила меня на создание приложения, которое было бы дешевле и проще, чем YClients, но удобнее простых аналогов, которыми пользуются небольшие салоны.

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

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

Так в декабре 2022 года появился App-Salute.

🖥 Создание бэкенда

Для бэкенда я выбрал знакомый стек: Node.js, Express.js, MongoDB. На разработку ушло около двух месяцев. Я писал код после основной работы — каждый день по 3–4 часа, а иногда и целые выходные.

Тогда я жил в режиме 24/7. Сейчас, вспоминая это, мне становится не по себе. Никакой личной жизни — с девушкой виделись только перед сном, на выходные почти не выходил. И так — первые три года моей карьеры. Очень много работы.

Я разворачивал БД, настраивал сервер, писал API. Я создал около 60 эндпоинтов, тестировал их в Postman, продумывал структуру данных и связи между ними. Это вам не системный дизайн на собеседовании — это реальная разработка.

С первого раза ничего не было идеально — многое пришлось переделывать.

Самым сложным оказалась работа с датами и записями. Нужно было учитывать множество факторов: свободные слоты, длительность услуг, пересечения. Я прописывал десятки сценариев, мозг буквально дымил. Вот где пригодились алгоритмы!

Запись клиентов — ключевая функция проекта, и я очень боялся, что в продакшене начнется путаница из-за ошибок. Но, как показало время, мой алгоритм оказался надежным — за 2 года ни одного сбоя.

👩‍💻 Разработка фронтенда

Фронтенд я делал в жестких временных рамках — сестра хотела перейти на мое приложение уже через 1,5 месяца. У меня был сырой бэкенд и только начало фронтенда.

Эти полтора месяца я жил в постоянном стрессе. Работал с 17:00 до 23:00 каждый день. Но успел — MVP был готов.

👩‍💻 Деплой приложения

С деплоем пришлось сложнее всего. Пришлось разбираться с VPS, DNS, Nginx, PM2, настройкой MongoDB. Я копался в этом днем и ночью, даже взял отпуск на 10 дней на основной работе, чтобы закончить настройку. И вот релиз.

Прикиньте, все мои отпуска эти 3 года были только для того, чтобы делать свои проекты.

👩‍💻 Рефакторинг и улучшения

Хороший разработчик - это тот, кто через месяц видит недостатки своего кода. Это значит, что ты растешь. Первая версия казалась мне костыльной, и я решил переписать все с нуля.

Новый бэкенд я сделал на Nest.js, PostgreSQL, Docker, а фронтенд — React.js, TypeScript, RTK, FSD. Также я использовал опыт с работы и написал собственный UI Kit со Storybook. Это были 2 независимых приложения: для компаний и для клиентов. Представляете - я вёл разработку сразу двух фронтенд-проектов одновременно! 🤪

На доработку ушло 8 месяцев. Я добавил:
- СМС-рассылку
- Полноценную авторизацию (JWT, OAuth)
- Загрузку изображений и интеграцию с S3
- Групповые услуги
- Управление салонами
- Пополнение счета
- Систему ролей и Личный кабинет клиента

И снова режим 24/7. Было тяжело, но я получал кайф от разработки. Мне нравилось чувствовать себя стартапером, фиксить баги и получать фидбек от пользователей.

Отдельным вызовом стал CI/CD с Docker. Я две недели разбирался с деплоем

📌 Что стало с приложением

За 2 года сервисом пользовались 3 компании и около 800 человек (клиенты и сотрудники). У него был простой, но удобный интерфейс. Сестра использовала его почти все это время и говорила, что он лучше многих аналогов.

1 апреля 2025 года я отключил сервер и удалил файлы проекта. Press F, App-Salute.

Ты дал мне веру в себя. Ты показал, что я могу решить любую задачу. И именно благодаря тебе 30 января 2024 года родился YeaHub.

Честно, пока писал — прослезился🥲
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥 Уникальный опыт, который переоценить невозможно

За три года работы в LS.Graphics я получил то, что редко можно найти даже в крупнейших IT-компаниях: реальную возможность создавать. Вместо того чтобы быть "винтиком" в огромной корпоративной системе, я стал разработчиком, который с нуля проектирует, строит и запускает продукты мирового уровня.

В больших компаниях ты часто ограничен своей узкой специализацией: Frontend, Backend, DevOps. В LS.Graphics я работал полным циклом: от архитектуры и UI до бекенда, оптимизации и деплоя.

Вместо бесконечных доработок форм и кнопок я реализовывал сложные системы: графические редакторы, AI-сервисы, платформы для анимации.

У нас была энергия стартапа — мы постоянно генерировали идеи, спорили, пробовали новое.

Но при этом у компании уже были серьезные продукты, которыми пользовались Apple, Microsoft, Nike, Adobe. Это успешный бизнес с миллионами пользователей.

📈 Быстрый рост

За 4 года я прошел путь от Стажера до разработчика, способного с нуля запускать сложные продукты. В крупных компаниях такой рост занимает 5-7 лет (если вообще возможен).

В корпорациях твои изменения теряются среди тысяч других правок. В LS.Graphics каждая моя строка кода напрямую влияла на продукт, которым пользуются дизайнеры по всему миру.

Этот опыт бесценен. Он дал мне гораздо больше, чем могла бы дать работа в любой крупной корпорации. Потому что здесь я не был "еще одним разработчиком в огромной команде" — я был тем, кто создает.

💱 Развитие экспертизы

Мой профессиональный путь системно вел к текущей позиции:
- Британский финтех — первые серьезные проекты
- LS.Graphics — разработка проектов с нуля и работа с интересными технологиями
- App-Salute — проектирование и разработка стартапа с нуля, погружение в Backend, DevOps
- Ведение YouTube и Telegram-каналов — навыки продвижения, нетворкинг и формирования сообществ
- Менторство — понимание рынка и внутренней кухни IT-компаний. Знакомство с крутыми ребятами

Каждый этап добавлял новые компетенции, которые сейчас помогают в развитии YeaHub.

🥇 YeaHub: год развития

Прошлый год работы над YeaHub научил меня двум главным вещам: как делать сложные технические решения и как управлять командой. За это время у нас поработали 13 бэкенд-разработчиков, 9 дизайнеров, 3 тестировщика и больше 80 фронтенд-специалистов. Сейчас в команде 45 самых сильных участников.

Мы создали систему управления, основанную на трех принципах:
- У каждого есть свои задачи и зона ответственности.
- Все важные решения принимаются открыто
- Есть баланс между самостоятельностью и контролем качества

У меня не было опыта управления проектами. Каждый шаг был для меня новым, каждый успех и каждая ошибка становились ценным уроком. Были критические моменты, когда проект замирал на месяц без активной разработки, но мы находили силы продолжать.

Моя роль как CEO и Tech Lead включает:
- Разработку архитектурных решений и технической стратегии
- Формирование и постоянную актуализацию продуктового видения
- Развитие проекта и построение профессионального сообщества
- Подбор команды и управление специалистами

На ближайший год мы ставим амбициозные цели:
- Расширение команды и профессиональный рост текущих участников
- Активное продвижение проекта на рынке
- Разработка более 20 новых сервисов
- Привлечение новых IT-специалистов в наше сообщество

Наши достижения за 7 месяцев после релиза:
- 2,500+ зарегистрированных пользователей
- 80,000+ посещений
- Стабильные 500+ ежедневных активных пользователей

Примечательно, что эти результаты достигнуты без масштабных маркетинговых вложений.

YeaHub — это open-source платформа, созданная айтишниками для айтишников. Новички могут изучить код реального большого проекта с полным стеком технологий и множеством популярных кейсов.

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

👍 Обучайтесь, общайтесь, растите вместе с https://yeahub.ru
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Техническое собеседование в VK на проект Mail

На собеседованиях в VK всегда интересные и достаточно сложные этапы. Дают алгоритмические задачи, глубоко спрашивают про опыт, задают много теоретических вопросов. Также часто встречаются вопросы на рассуждение — например, как бы вы поступили в той или иной ситуации.

Вопросы:
- Что делают preventDefault и stopPropagation?
- Как работают call, apply и bind? В чем их разница?
- В чем разница между arrow function и function declaration?
- Как ускорить алгоритмическую сложность кода?
- Как ускорить работу функции?
- Как удалить или вставить произвольные элементы из массива?
- Как перехватывать JavaScript-ошибки на странице?
- В чем разница между throw 'message' и throw new Error('message')?
- Чем можно заменить position: sticky, если бы его не существовало?
- Для чего нужен Service Worker?
- Как отменить fetch-запрос?
- Как получать данные в реальном времени?
- Зачем нужен Virtual DOM?
- Зачем нужны State Manager и Контекст? Почему нельзя просто использовать переменные?

Ответы на вопросы тут

#frontend #interview
Please open Telegram to view this post
VIEW IN TELEGRAM
2025/06/11 09:31:41
Back to Top
HTML Embed Code: