Velox TS is a TypeScript framework for teams requiring easy type-safety across the entire stack. Built for great DX.
Not tied to React. Use vanilla HTML, web components, React, Vue, Svelte, or no frontend at all—VeloxTS is backend-first.
/backend/src/index.ts
import { databasePlugin, rest, veloxApp } from '@veloxts/velox'
import { db } from './config/database.js';
import { collections } from './router.js';
const app = await veloxApp({ port: 3030 });
await app.register(databasePlugin({ client: db }));
app.routes(
rest(collections, { prefix: '/api' })
);
await app.start();
/backend/src/router.ts
import { createRouter } from '@veloxts/velox'
import { healthProcedures } from './procedures/health.js';
import { userProcedures } from './procedures/users.js';
// Create router and collections from procedure definitions
export const { collections, router } = createRouter(
healthProcedures,
userProcedures,
);
export type AppRouter = typeof router;
/backend/src/procedures/users.ts
import { authenticated, NotFoundError, procedure, procedures } from '@veloxts/velox';
import { hasOrganization } from '../guards/organization.js';
import { UserSchema, GetUserInput } from '../schemas/user.js'; // Zod schemas
export const userProcedures = procedures('users', {
getUser: procedure()
.guard(authenticated)
.guard(hasOrganization)
.input(GetUserInput)
.output(UserSchema)
.query(async ({ input, ctx }) => {
const user = await ctx.db.user.findUnique({ where: { id: input.id } });
if (!user) {
throw new NotFoundError(`User with id '${input.id}' not found`);
}
// Return Prisma object directly - output schema handles Date serialization
return user;
}),
// …
});
/backend/src/guards/organization.ts
import { defineGuard } from '@veloxts/velox';
import type { User } from '@veloxts/auth';
/**
* Guard that ensures user belongs to an organization
*/
export const hasOrganization = defineGuard<User>({
name: 'hasOrganization',
check: (ctx) => !!ctx?.organizationId,
message: 'User must belong to an organization',
statusCode: 403,
});
/frontend/src/api-hook.ts
import { createVeloxHooks } from '@veloxts/client/react';
import type { AppRouter } from '../../backend/src/router.js';
/**
* Zero codegen, Type-safe API hooks with full autocomplete
*/
export const api = createVeloxHooks<AppRouter>();
/frontend/src/pages/UserPage.tsx
import { api } from '../api-hook.js';
export const UserPage: FC<UserPageProps> = ({ id }) => {
const { data } = api.users.getUser.useQuery({ id });
// …
}
Velox TS adapts to your team’s needs. Choose simple SPA, or React Server Components.
End-to-end type-safe APIs. Zero code generation, instant autocomplete.
Traditional REST with OpenAPI docs and full type inference.
Separate frontend and backend. Perfect for existing React apps.
React Server Components. Build UI and backend together.
Modern tooling and conventions that get out of your way
Full TypeScript inference across your entire stack. Catch errors as you type, not at runtime.
Built on the latest Prisma with driver adapters. Full type safety from schema to API.
Sensible defaults, optional configuration. Start coding in seconds, customize when needed.
Direct TypeScript inference. No build steps, no generated files to commit.
Generate procedures, routes, and schemas in seconds thanks to built-in AI skills.
Add Velox TS to existing projects. Migrate one endpoint at a time. No big rewrites required.