create-gravibase-ui

CLI-утилита для быстрого создания React-приложения с готовой системой авторизации через Gravibase Authenticator API.

Эта команда создает демонстрационное приложение для работы с API аутентификации Gravibase. Оно может стать отправной точкой для вашего проекта!

🛠️ Установка

1. Установите Node.js

   Если Node.js не установлен, скачайте и установите Node.js 14 или новее:

   • https://nodejs.org/

   Проверьте установку:

   node --version  # должно быть >= 14.0.0
   npm --version

2. Используйте утилиту через npx (без установки):

   npx create-gravibase-ui [каталог]

   Или установите пакет глобально:

   npm install -g create-gravibase-ui
   create-gravibase-ui [каталог]

📖 Использование

Создание проекта

npx create-gravibase-ui [каталог]

Важно: Имя каталога должно совпадать с кодом проекта в Gravibase. Например:

Если каталог не указан, будет запрошено имя каталога.

Что делает скрипт

После запуска утилита автоматически:

1. Создает новый каталог с React-приложением
2. Копирует шаблон с готовой системой авторизации
3. Настраивает код проекта в .env.development (имя каталога = код проекта)
4. Устанавливает все зависимости (npm install)
5. Запускает приложение в режиме разработки (npm run dev)
6. Открывает браузер с приложением

Для остановки приложения нажмите Ctrl+C.

Запуск приложения вручную

Если вы остановили приложение и хотите запустить его снова:

cd [каталог]
npm run dev

⚙️ Настройка созданного приложения

Код проекта

Код проекта автоматически устанавливается из имени каталога и записывается в .env.development как VITE_PROJECT_CODE.

В режиме разработки запросы авторизации проксируются на https://<код_проекта>.apps.gravibase.ru.

Переопределить адрес бэкенда можно через VITE_PROXY_TARGET в .env.development:

VITE_PROJECT_CODE=myproject
VITE_PROXY_TARGET=https://myproject.apps.gravibase.ru

После изменений перезапустите npm run dev.

Продакшен: приложение использует window.location.origin как базовый URL (фронт и API с одного домена).

📚 Что создается

Созданное приложение включает:

• Vite + React + TypeScript — современный стек разработки
• Авторизация через Gravibase Authenticator API:
  • Форма входа (/login)
  • Форма регистрации (/register)
  • Обновление профиля и смена пароля (/change-password)
  • Принятие согласий (/consents)
• Автоматическое управление токенами — обновление access token, обработка 401 ошибок
• Тулбар пользователя — отображение имени пользователя и кнопка выхода

🔗 Ссылки

• Gravibase - https://app.gravibase.ru/
• Документация - https://docs.gravibase.ru/about