Начать с HTML
Data API позволяет описать поведение в разметке. JavaScript API пригодится там, где нужен точный контроль.
О проекте / Vegas Studio
VGApp.
Больше возможностей
в привычных вещах.
Набор UI-модулей на чистом JavaScript для интерфейсов, в которых важны детали: от простого уведомления до работы с формами, файлами и таблицами.
Подход
Меньше повторяющегося кода.
Больше внимания продукту.
Типовые задачи интерфейса уже собраны в модули. Вы задаёте разметку, настраиваете поведение и связываете его с логикой приложения.
Собрать свой набор
Используйте готовое приложение VGApp или зарегистрируйте нужные модули в собственном экземпляре.
Связать с приложением
DOM-события, методы и AJAX-сценарии помогают встроить компоненты в существующий интерфейс и серверный API.
Возможности
От одного компонента
до целого сценария.
Модальные окна, формы, загрузка файлов, навигация и работа с данными — в одной библиотеке.
Открыть каталог примеров →- Диалоги и обратная связь
- Модальные окна, подтверждения, уведомления и подсказки.VGModal · VGAlert · VGToast · VGTooltip
- Формы и файлы
- Отправка форм, выбор значений, загрузка и предпросмотр файлов.VGFormSender · VGSelect · VGFiles · VGFilePreview
- Навигация и контент
- Вкладки, боковые панели, сворачиваемые блоки и меню.VGTabs · VGSidebar · VGCollapse · VGNav
- Данные и списки
- Таблицы, подгрузка записей и сортировка вложенных списков.VGTable · VGLoadMore · VGNestable
Первый шаг
Установите.
Подключите. Попробуйте.
Добавьте пакет через npm, подключите стили и вызовите boot() после готовности DOM. Затем возьмите разметку нужного компонента из каталога.
Пример рассчитан на проект со сборщиком, например Vite или Webpack. Способ ручной инициализации смотрите в примерах конкретного модуля.
VGApp на npm ↗
Терминал
npm install vgapp
app.js
import vgapp from 'vgapp';
import 'vgapp/build/vgapp.css';
vgapp.boot();