Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
263 changes: 205 additions & 58 deletions npm/README.md
Original file line number Diff line number Diff line change
@@ -1,17 +1,185 @@
# Veryfront Code

The simplest way to build AI-powered apps. One command. Zero config. Just build.
The full-stack React framework for AI applications. Agents, tools, workflows — one framework, zero config.

```bash
npx veryfront
npx veryfront init my-app
cd my-app
veryfront dev
```

Or install the CLI globally:
## What You Get

Define agents, tools, and workflows as files. They're auto-discovered — no registration, no wiring.

```
my-app/
agents/
assistant.ts # AI agent with model, system prompt, tools
tools/
search.ts # Zod-validated tool the agent can call
prompts/
assistant.ts # System prompt (versioned, swappable)
workflows/
pipeline.ts # DAG workflow with branching + parallelism
app/
layout.tsx # Root layout
page.tsx # Chat UI
api/
chat/
route.ts # Streaming chat endpoint
```

## Define an Agent

```ts
// agents/assistant.ts
import { agent } from "veryfront/agent";

export default agent({
id: "assistant",
model: "openai/gpt-4o",
system: "You are a helpful assistant.",
tools: true, // auto-attach all discovered tools
maxSteps: 10,
});
```

## Define a Tool

```ts
// tools/search.ts
import { tool } from "veryfront/tool";
import { z } from "zod";

export default tool({
id: "search",
description: "Search the knowledge base",
inputSchema: z.object({
query: z.string(),
}),
execute: async ({ query }) => {
// your logic here
return { results: [] };
},
});
```

## Stream to the Frontend

```ts
// app/api/chat/route.ts
import { getAgent } from "veryfront/agent";

export async function POST(req: Request) {
const { messages } = await req.json();
const agent = getAgent("assistant");
const result = await agent.stream({ messages });
return result.toDataStreamResponse();
}
```

## Chat UI in One Line

```tsx
// app/page.tsx
'use client'
import { Chat, useChat } from "veryfront/chat";

export default function Page() {
const chat = useChat({ api: "/api/chat" });
return <Chat {...chat} />;
}
```

## Workflows

DAG-based multi-step workflows with branching, parallelism, and human-in-the-loop.

```ts
// workflows/content-pipeline.ts
import { workflow, step, parallel, waitForApproval } from "veryfront/workflow";

export default workflow({
id: "content-pipeline",
steps: () => [
step("research", { agent: "researcher" }),
parallel("generate", [
step("write", { agent: "writer" }),
step("images", { tool: "imageGenerator" }),
]),
waitForApproval("review", { timeout: "24h" }),
step("publish", { agent: "publisher" }),
],
});
```

## Multi-Agent Composition

Use agents as tools for other agents.

```ts
import { agent, registerAgent, getAgentsAsTools } from "veryfront/agent";

const researcher = agent({ model: "openai/gpt-4o", system: "Research topics thoroughly." });
const writer = agent({ model: "openai/gpt-4o", system: "Write clear, concise prose." });

registerAgent(researcher);
registerAgent(writer);

const orchestrator = agent({
model: "openai/gpt-4o",
system: "Coordinate research and writing.",
tools: getAgentsAsTools(["researcher", "writer"]),
});
```

## Features

| | |
|---|---|
| **Agents** | Define AI agents with memory, tools, and streaming |
| **Tools** | Zod-validated, auto-discovered, type-safe |
| **Workflows** | DAG orchestration with branching, loops, and human approval |
| **Chat UI** | `<Chat />` component + `useChat` hook, ready to go |
| **Multi-agent** | Agent-as-tool composition and delegation |
| **Providers** | Unified interface for OpenAI, Anthropic, Google |
| **MCP Server** | Expose your tools and prompts over Model Context Protocol |
| **OAuth** | 37 pre-configured providers (Google, GitHub, etc.) |
| **Routing** | File-based routing with layouts, SSR, and RSC |
| **Middleware** | CORS, rate limiting, logging, custom pipelines |
| **MDX** | Markdown pages with React components |
| **Deploy** | `veryfront deploy` to managed cloud |

## Templates

```bash
curl -fsSL https://veryfront.com/install.sh | sh
npx veryfront init my-app
```

- **chat** — AI chatbot with agent, tools, and streaming UI
- **rag** — Chat with your docs using retrieval-augmented generation
- **multi-agent** — Agents that delegate to each other as tools
- **workflow** — Multi-step AI pipeline with approvals and parallelism
- **coding-agent** — AI code assistant with file read/write/edit tools
- **saas** — AI SaaS with auth, per-user chat, and memory
- **minimal** — Blank canvas, no extras

## Build & Deploy

```bash
veryfront build
veryfront deploy
```

Your app is live at `https://<slug>.veryfront.com`.

---

## Terminal UI

The dev server includes an interactive TUI with project management.

```
╭──────────────────────────────────────────────────────────╮
│ │
Expand All @@ -26,12 +194,8 @@ curl -fsSL https://veryfront.com/install.sh | sh
╰──────────────────────────────────────────────────────────╯
```

## Terminal UI

The interactive TUI gives you full control from your terminal.

<details>
<summary>Keyboard Shortcuts</summary>
<summary>Keyboard shortcuts</summary>

| Key | Action |
|-----|--------|
Expand All @@ -42,40 +206,22 @@ The interactive TUI gives you full control from your terminal.
| `i` | Open in IDE |
| `n` | Create new project |
| `l` | Toggle logs |
| `j` `k` | Scroll logs |
| `?` | Show all shortcuts |
| `q` | Quit |

**When logged in:**

| Key | Action |
|-----|--------|
| `p` | Pull remote project |
| `u` | Push to remote |
| `a` | Login |
| `x` | Logout |

</details>

## Connect Your Coding Agent

Veryfront exposes an MCP server that gives AI coding agents access to live dev server state—errors, logs, and HMR triggers.

### Claude Code
Veryfront exposes an MCP server that gives AI coding agents access to live dev server state — errors, logs, and HMR triggers.

<details>
<summary>Option 1: Install the plugin</summary>
<summary>Claude Code</summary>

```bash
/plugin install veryfront@veryfront/claude-plugins
```

</details>

<details>
<summary>Option 2: Manual configuration</summary>

Add to your `.mcp.json`:
Or add to `.mcp.json`:

```json
{
Expand All @@ -90,27 +236,10 @@ Add to your `.mcp.json`:

</details>

### Codex CLI

<details>
<summary>Configuration</summary>

Add to `~/.codex/config.toml`:

```toml
[mcp_servers.veryfront]
command = "veryfront"
args = ["mcp"]
```

</details>
<summary>Cursor</summary>

### Gemini CLI

<details>
<summary>Configuration</summary>

Add to `~/.gemini/settings.json`:
Add to `.cursor/mcp.json`:

```json
{
Expand All @@ -125,12 +254,23 @@ Add to `~/.gemini/settings.json`:

</details>

### Cursor
<details>
<summary>Codex CLI</summary>

Add to `~/.codex/config.toml`:

```toml
[mcp_servers.veryfront]
command = "veryfront"
args = ["mcp"]
```

</details>

<details>
<summary>Configuration</summary>
<summary>Gemini CLI</summary>

Add to `.cursor/mcp.json` in your project directory (or `~/.cursor/mcp.json` for global config):
Add to `~/.gemini/settings.json`:

```json
{
Expand All @@ -143,13 +283,9 @@ Add to `.cursor/mcp.json` in your project directory (or `~/.cursor/mcp.json` for
}
```

Then restart Cursor or reload the window.

</details>

### Available Tools

Once connected, your agent gets access to:
**Available MCP tools:**

| Tool | Description |
|------|-------------|
Expand All @@ -158,5 +294,16 @@ Once connected, your agent gets access to:
| `vf_get_status` | Dev server status and stats |
| `vf_trigger_hmr` | Trigger hot module reload |

<!-- Auto-deploy proof test: 2026-01-30T12:44:06Z -->
## Documentation

- [Quickstart](https://veryfront.com/code/guides/quickstart)
- [Project Structure](https://veryfront.com/code/guides/project-structure)
- [Agents](https://veryfront.com/code/guides/agents)
- [Tools](https://veryfront.com/code/guides/tools)
- [Workflows](https://veryfront.com/code/guides/workflows)
- [Chat UI](https://veryfront.com/code/guides/chat-ui)
- [API Reference](https://veryfront.com/code/api)

## License

MIT
7 changes: 2 additions & 5 deletions npm/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "veryfront",
"version": "0.1.7-rc.61",
"version": "0.1.7-rc.63",
"description": "The simplest way to build AI-powered apps",
"keywords": [
"react",
Expand Down Expand Up @@ -102,9 +102,6 @@
"node": ">=18.0.0"
},
"peerDependenciesMeta": {
"ws": {
"optional": true
},
"better-sqlite3": {
"optional": true
}
Expand Down Expand Up @@ -147,14 +144,14 @@
"unified": "11.0.5",
"unist-util-visit": "5.0.0",
"vfile": "6.0.1",
"ws": "^8.18.0",
"zod": "3.25.76",
"@deno/shim-deno": "~0.18.0",
"@deno/shim-crypto": "~0.3.1",
"@deno/shim-timers": "~0.1.0",
"undici": "^6.0.0"
},
"peerDependencies": {
"ws": ">=8.0.0",
"better-sqlite3": ">=9.0.0"
},
"devDependencies": {
Expand Down
7 changes: 5 additions & 2 deletions scripts/build/build-npm-dnt.ts
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,11 @@ await build({
engines: {
node: ">=18.0.0",
},
// ws is dynamically imported for Node.js WebSocket upgrade (HMR dev server)
// dnt can't detect dynamic imports, so we add it explicitly
dependencies: {
"ws": "^8.18.0",
},
keywords: [
"react",
"framework",
Expand All @@ -135,11 +140,9 @@ await build({
],
// Optional peer dependencies for platform-specific features
peerDependencies: {
"ws": ">=8.0.0",
"better-sqlite3": ">=9.0.0",
},
peerDependenciesMeta: {
"ws": { optional: true },
"better-sqlite3": { optional: true },
},
devDependencies: {
Expand Down
Loading