vef framework · react
Composable React, layer by layer.
The documentation focuses on how to build applications with the exported APIs from `@vef-framework-react/*`, including routing, requests, forms, CRUD pages, and approval-flow integration.
@vef-framework-react/starterbootstrap · routing · layouts · CRUD
@vef-framework-react/componentsforms · options · charts · icons
@vef-framework-react/corerequests · query · stores · atoms
@vef-framework-react/devVite · ESLint · Stylelint · Commitlint
- The entry point focuses on one thing: wiring apiClient, router, and appContext into createApp.
- Data dictionaries, file URLs, and permission checks enter the page system through appContext.
- Routing, theme, query, and notifications are mounted by the starter layer.
Main Flow
Establish the shell first, then build the product on top
The most effective way to understand VEF is to follow the same shape as a real application: bootstrap the shell, assemble the runtime, and then build pages on top.
- 01
Establish the Foundation
Set up the project tooling once through defineViteConfig, ESLint, and Stylelint.
- 02
Assemble the Main Runtime
Create the apiClient, router, and application entry so auth, permissions, query, and routing work together.
- 03
Build Pages on Top
Use Page for regular screens, ProTable for data-heavy pages, and CrudPage with createCrudKit for CRUD workflows.
Core Surfaces
These API surfaces matter first
These capabilities cover the most common application tasks and represent the most central, most stable parts of the framework.
Application Entry and Layout
createApp, createRouter, login routes, access-denied routes, Page, ProTable, and CrudPage all live in the main application shell.
Requests, Cache, and State
ApiClient, useQuery, useMutation, createStore, createComponentStore, and atom form the page-level data layer.
Components, Forms, and Theme
The component system is already integrated with theming, notifications, form fields, permissions, and option transformation.
Reusable CRUD Pages
A unified API for search areas, tables, form scenes, delete flows, and batch actions.
Page-Level Helper Hooks
Data dictionaries, option transformation, permission checks, loading-state checks, and common interaction hooks are all exported in one place.
Approval Flow Editor
Can be embedded independently and extended through plugins for users, roles, departments, and form fields.
Suggested Entry Points
A practical reading path into the framework
These four pages are a good starting path for understanding the structure of the framework and moving quickly into implementation work.
Start with Installation
Confirm dependencies, runtime requirements, and the minimum project setup.
See the Minimal App Skeleton
Follow the full bootstrap path through createApp, createApiClient, and createRouter.
Read the CRUD Page Guide
A good starting point for understanding search areas, tables, and form scenes in admin pages.
Browse the Package API Map
Useful when starting from a need and mapping it back to the right package and entry point.