Skip to Content
Quick Install

Quick install

Set up a Next.js project with App Router and TypeScript

npx create-next-app my-app --ts --app --src-dir
cd my-app

Init Vovk and follow the prompts

You will be asked preferred validation library, and a couple of other questions. The command also creates vovk.config.mjs or vovk.config.cjs.

npx vovk-init@draft --channel draft

Create a new segment

The following will create a root segment at ./src/app/api/[[…vovk]]/route.ts.

npx vovk new segment

Create a new controller and a service

The following command will create an example controller and a service for users at ./src/modules/user/ and update the route.ts file.

npx vovk new controller service user

Start the server and navigate to an example endpoint

The dev script runs Next.js server and Vovk.ts watcher in parallel. Once the command is running, Vovk.ts will generate schema files at .vovk-schema/ (needs to be committed) and client library at node_modules/.vovk-client.

npm run dev

Then open http://localhost:3000/api/users?search=John 

Create a React component to display the data

Import the generated client library and use it to fetch data.

import { UserRPC } from 'vovk-client';
// ...
const result = await UserRPC.getUsers({ query: { search: 'John' } });

Deploy

In order to build the client (not the schema) at node_modules you need to run the following command after dependency installation and before building the app.

npx vovk generate
Last updated on
Core ConceptsManual Install 🚧