Onlys: личный кабинет инвестора, фронтенд и бэкенд
Клиент:
Onlys, токены проектов с AI-инфлюенсерами
Сегмент:
Web3, AI-инфлюенсеры
Результат:
Кабинет и API запущены
Направление:
Разработка веб-сервисов
Стек:
React, Node.js, Fastify, Docker
Задача
Onlys выпускает токены проектов с AI-инфлюенсерами: держатели получают долю выручки проекта. Лендинг onlys.fun уже работал, а личного кабинета у инвесторов не было.
Нужен был кабинет, где инвестор входит без пароля, выбирает проект, покупает токены и видит портфель и выплаты. Дизайн должен был продолжать лендинг, а данные идти из собственного бэкенда.
Что сделали
- Спроектировали фронтенд по Feature-Sliced Design: страницы, виджеты, действия пользователя и сущности лежат отдельными слоями, новый раздел добавляется без правки старых.
- Сверстали кабинет на React 18 и Vite: каталог проектов с фильтром, раздел пресейла, карточка проекта с галереей и прогрессом сбора, раздел выплат с графиком по месяцам и выгрузкой в CSV.
- Перенесли в кабинет стиль лендинга: шрифты, салатовый акцент, анимации на Framer Motion. Графики нарисовали на SVG, без тяжёлых библиотек.
- Перевели фотографии в WebP: вес картинок кабинета снизился с 9,3 до 0,3 МБ.
- Написали бэкенд на Node.js и Fastify: API каталога, портфеля и истории выплат на api.onlys.fun.
- Сделали вход через Google: кабинет не спрашивает пароль и хранит только email и публичное имя, сессия живёт в защищённой cookie.
- Подключили покупку токенов: кабинет выставляет счёт и переводит инвестора на страницу оплаты.
- Настроили выкладку: Docker и Traefik на сервере, GitHub Actions выкатывает обновления после каждого пуша в основную ветку.
Что получил клиент
- Кабинет инвестора на React по адресу app.onlys.fun
- API на Node.js и Fastify по адресу api.onlys.fun
- Вход через Google без пароля, покупка токенов, портфель и выплаты в одном окне
- Docker и автоматическая выкатка после пуша в репозиторий
Что делали: Создание сайтов
Отзыв клиента
Лендинга у нас не было, его тоже сделал Нейроюнит. От нас была только идея, всё остальное собрали они: кабинет инвестора на React и API на Node.js, вход через Google без пароля, покупка токенов, портфель и выплаты в одном окне. Фронтенд и бэкенд разделены, новые проекты добавляются через API без пересборки интерфейса. Обновления выходят сами после пуша в репозиторий.
Ярослав, основатель проекта, Onlys
Итог
Кабинет работает на app.onlys.fun, API на api.onlys.fun. Инвестор входит через Google, выбирает проект, оплачивает токены и видит портфель и выплаты в одном месте.
Фронтенд и бэкенд разделены: новые проекты и данные появляются через API без пересборки интерфейса, а обновления выходят сами после пуша в репозиторий.
