veryfront 0.0.36 → 0.0.37
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ai/index.js +1 -1
- package/dist/ai/index.js.map +1 -1
- package/dist/cli.js +78 -41
- package/dist/components.js +1 -1
- package/dist/components.js.map +1 -1
- package/dist/config.js +1 -1
- package/dist/config.js.map +1 -1
- package/dist/data.js +1 -1
- package/dist/data.js.map +1 -1
- package/dist/index.js +2 -5
- package/dist/index.js.map +2 -2
- package/dist/templates/ai/ai/agents/assistant.ts +20 -0
- package/dist/templates/ai/ai/prompts/assistant.ts +14 -0
- package/dist/templates/ai/ai/tools/get-weather.ts +29 -0
- package/dist/templates/ai/app/api/chat/route.ts +37 -0
- package/dist/templates/ai/app/layout.tsx +18 -0
- package/dist/templates/ai/app/page.tsx +28 -0
- package/dist/templates/ai/tsconfig.json +18 -0
- package/dist/templates/ai/veryfront.config.ts +9 -0
- package/dist/templates/app/_env.example +16 -0
- package/dist/templates/app/app/api/auth/login/route.ts +53 -0
- package/dist/templates/app/app/api/auth/logout/route.ts +27 -0
- package/dist/templates/app/app/api/auth/me/route.ts +34 -0
- package/dist/templates/app/app/api/auth/register/route.ts +42 -0
- package/dist/templates/app/app/api/stats/route.ts +21 -0
- package/dist/templates/app/app/api/users/route.ts +42 -0
- package/dist/templates/app/app/dashboard/page.tsx +29 -0
- package/dist/templates/app/app/layout.tsx +45 -0
- package/dist/templates/app/app/login/page.tsx +222 -0
- package/dist/templates/app/app/page.tsx +15 -0
- package/dist/templates/app/components/AuthProvider.tsx +51 -0
- package/dist/templates/app/components/DashboardLayout.tsx +142 -0
- package/dist/templates/app/components/FeatureGrid.tsx +98 -0
- package/dist/templates/app/components/Header.tsx +58 -0
- package/dist/templates/app/components/HeroSection.tsx +49 -0
- package/dist/templates/app/components/RecentActivity.tsx +98 -0
- package/dist/templates/app/components/StatsGrid.tsx +126 -0
- package/dist/templates/app/components/Toaster.tsx +113 -0
- package/dist/templates/app/lib/auth-client.ts +38 -0
- package/dist/templates/app/lib/auth.ts +49 -0
- package/dist/templates/app/lib/stats.ts +34 -0
- package/dist/templates/app/lib/users.ts +86 -0
- package/dist/templates/app/middleware/auth.ts +34 -0
- package/dist/templates/app/public/robots.txt +4 -0
- package/dist/templates/app/veryfront.config.js +74 -0
- package/dist/templates/blog/app/about/page.mdx +14 -0
- package/dist/templates/blog/app/archive/page.tsx +42 -0
- package/dist/templates/blog/app/blog/[slug]/page.tsx +47 -0
- package/dist/templates/blog/app/layout.tsx +54 -0
- package/dist/templates/blog/app/page.tsx +13 -0
- package/dist/templates/blog/components/BlogPostList.tsx +53 -0
- package/dist/templates/blog/components/MDXContent.tsx +26 -0
- package/dist/templates/blog/content/posts/hello-world.mdx +29 -0
- package/dist/templates/blog/content/posts/markdown-showcase.mdx +105 -0
- package/dist/templates/blog/lib/posts.ts +76 -0
- package/dist/templates/blog/lib/utils.ts +14 -0
- package/dist/templates/blog/public/robots.txt +4 -0
- package/dist/templates/blog/styles/globals.css +21 -0
- package/dist/templates/blog/veryfront.config.js +39 -0
- package/dist/templates/docs/app/docs/api/page.mdx +102 -0
- package/dist/templates/docs/app/docs/core-concepts/page.mdx +82 -0
- package/dist/templates/docs/app/docs/getting-started/page.mdx +67 -0
- package/dist/templates/docs/app/layout.tsx +41 -0
- package/dist/templates/docs/app/page.mdx +51 -0
- package/dist/templates/docs/components/CodeBlock.tsx +44 -0
- package/dist/templates/docs/components/Header.tsx +49 -0
- package/dist/templates/docs/components/Sidebar.tsx +68 -0
- package/dist/templates/docs/public/robots.txt +4 -0
- package/dist/templates/docs/styles/globals.css +48 -0
- package/dist/templates/docs/veryfront.config.js +47 -0
- package/dist/templates/minimal/app/about/page.mdx +18 -0
- package/dist/templates/minimal/app/layout.tsx +20 -0
- package/dist/templates/minimal/app/page.tsx +26 -0
- package/dist/templates/minimal/veryfront.config.js +29 -0
- package/package.json +1 -1
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
# Core Concepts
|
|
2
|
+
|
|
3
|
+
Understanding these core concepts will help you build better applications.
|
|
4
|
+
|
|
5
|
+
## Architecture Overview
|
|
6
|
+
|
|
7
|
+
Our platform is built on these key principles:
|
|
8
|
+
|
|
9
|
+
### 1. Component-Based
|
|
10
|
+
|
|
11
|
+
Everything is a component that can be composed together:
|
|
12
|
+
|
|
13
|
+
```typescript
|
|
14
|
+
export function MyComponent({ name }: { name: string }) {
|
|
15
|
+
return <div>Hello, {name}!</div>;
|
|
16
|
+
}
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
### 2. File-System Routing
|
|
20
|
+
|
|
21
|
+
Routes are automatically generated based on your file structure:
|
|
22
|
+
|
|
23
|
+
- `app/page.tsx` → `/`
|
|
24
|
+
- `app/about/page.tsx` → `/about`
|
|
25
|
+
- `app/blog/[slug]/page.tsx` → `/blog/:slug`
|
|
26
|
+
|
|
27
|
+
### 3. Server-First
|
|
28
|
+
|
|
29
|
+
By default, components run on the server for better performance:
|
|
30
|
+
|
|
31
|
+
```typescript
|
|
32
|
+
// This runs on the server
|
|
33
|
+
export default async function Page() {
|
|
34
|
+
const data = await fetchData();
|
|
35
|
+
return <div>{data}</div>;
|
|
36
|
+
}
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
### 4. Progressive Enhancement
|
|
40
|
+
|
|
41
|
+
Add client interactivity only where needed:
|
|
42
|
+
|
|
43
|
+
```typescript
|
|
44
|
+
'use client';
|
|
45
|
+
|
|
46
|
+
export function Counter() {
|
|
47
|
+
const [count, setCount] = useState(0);
|
|
48
|
+
return (
|
|
49
|
+
<button onClick={() => setCount(count + 1)}>
|
|
50
|
+
Count: {count}
|
|
51
|
+
</button>
|
|
52
|
+
);
|
|
53
|
+
}
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
## Data Flow
|
|
57
|
+
|
|
58
|
+
Understanding how data flows through your application:
|
|
59
|
+
|
|
60
|
+
1. **Request** - User navigates to a route
|
|
61
|
+
2. **Routing** - System matches the URL to a page
|
|
62
|
+
3. **Data Fetching** - Page fetches required data
|
|
63
|
+
4. **Rendering** - Server renders the HTML
|
|
64
|
+
5. **Hydration** - Client adds interactivity
|
|
65
|
+
|
|
66
|
+
## State Management
|
|
67
|
+
|
|
68
|
+
Manage state at different levels:
|
|
69
|
+
|
|
70
|
+
- **Component State** - Local to a component
|
|
71
|
+
- **Context** - Shared across components
|
|
72
|
+
- **Server State** - Fetched from APIs
|
|
73
|
+
- **URL State** - Stored in query parameters
|
|
74
|
+
|
|
75
|
+
## Performance
|
|
76
|
+
|
|
77
|
+
Built-in optimizations include:
|
|
78
|
+
|
|
79
|
+
- Automatic code splitting
|
|
80
|
+
- Resource prefetching
|
|
81
|
+
- Image optimization
|
|
82
|
+
- Caching strategies
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
# Getting Started
|
|
2
|
+
|
|
3
|
+
This guide will help you get started with our platform in just a few minutes.
|
|
4
|
+
|
|
5
|
+
## Prerequisites
|
|
6
|
+
|
|
7
|
+
Before you begin, make sure you have:
|
|
8
|
+
|
|
9
|
+
- Deno 1.40 or later installed
|
|
10
|
+
- A text editor (we recommend VS Code)
|
|
11
|
+
- Basic knowledge of JavaScript/TypeScript
|
|
12
|
+
|
|
13
|
+
## Installation
|
|
14
|
+
|
|
15
|
+
### Using Deno
|
|
16
|
+
|
|
17
|
+
```bash
|
|
18
|
+
deno install -A -n myapp https://example.com/cli.ts
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
### From Source
|
|
22
|
+
|
|
23
|
+
```bash
|
|
24
|
+
git clone https://github.com/example/myapp
|
|
25
|
+
cd myapp
|
|
26
|
+
deno task install
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
## Creating Your First Project
|
|
30
|
+
|
|
31
|
+
Once installed, create a new project:
|
|
32
|
+
|
|
33
|
+
```bash
|
|
34
|
+
myapp init my-first-project
|
|
35
|
+
cd my-first-project
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
This creates a new project with the following structure:
|
|
39
|
+
|
|
40
|
+
```
|
|
41
|
+
my-first-project/
|
|
42
|
+
├── src/
|
|
43
|
+
│ ├── main.ts
|
|
44
|
+
│ └── utils.ts
|
|
45
|
+
├── tests/
|
|
46
|
+
│ └── main_test.ts
|
|
47
|
+
├── deno.json
|
|
48
|
+
└── README.md
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
## Running Your Project
|
|
52
|
+
|
|
53
|
+
Start the development server:
|
|
54
|
+
|
|
55
|
+
```bash
|
|
56
|
+
myapp dev
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
Your application will be available at `http://localhost:3000`.
|
|
60
|
+
|
|
61
|
+
## Next Steps
|
|
62
|
+
|
|
63
|
+
Now that you have a project running, explore:
|
|
64
|
+
|
|
65
|
+
- [Core Concepts](/docs/core-concepts) - Understand the architecture
|
|
66
|
+
- [Configuration](/docs/configuration) - Customize your setup
|
|
67
|
+
- [Deployment](/docs/deployment) - Deploy to production
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { Sidebar } from "../components/Sidebar.tsx";
|
|
3
|
+
import { Header } from "../components/Header.tsx";
|
|
4
|
+
|
|
5
|
+
export const metadata = {
|
|
6
|
+
title: "My Docs",
|
|
7
|
+
description: "Documentation built with Veryfront",
|
|
8
|
+
};
|
|
9
|
+
|
|
10
|
+
export default function RootLayout({
|
|
11
|
+
children
|
|
12
|
+
}: {
|
|
13
|
+
children: React.ReactNode
|
|
14
|
+
}) {
|
|
15
|
+
return (
|
|
16
|
+
<html lang="en">
|
|
17
|
+
<head>
|
|
18
|
+
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
19
|
+
<link
|
|
20
|
+
rel="stylesheet"
|
|
21
|
+
href="https://cdn.jsdelivr.net/npm/tailwindcss@3/dist/tailwind.min.css"
|
|
22
|
+
/>
|
|
23
|
+
<link
|
|
24
|
+
rel="stylesheet"
|
|
25
|
+
href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-tomorrow.min.css"
|
|
26
|
+
/>
|
|
27
|
+
</head>
|
|
28
|
+
<body className="bg-white">
|
|
29
|
+
<Header />
|
|
30
|
+
<div className="flex">
|
|
31
|
+
<Sidebar />
|
|
32
|
+
<main className="flex-1 px-8 py-6 max-w-4xl">
|
|
33
|
+
<article className="prose prose-slate max-w-none">
|
|
34
|
+
{children}
|
|
35
|
+
</article>
|
|
36
|
+
</main>
|
|
37
|
+
</div>
|
|
38
|
+
</body>
|
|
39
|
+
</html>
|
|
40
|
+
);
|
|
41
|
+
}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
# Welcome to the Documentation
|
|
2
|
+
|
|
3
|
+
Welcome to our comprehensive documentation. Here you'll find everything you need to get started and make the most of our platform.
|
|
4
|
+
|
|
5
|
+
## Quick Start
|
|
6
|
+
|
|
7
|
+
Get up and running in minutes:
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
# Install the CLI
|
|
11
|
+
deno install -A -n myapp https://example.com/cli.ts
|
|
12
|
+
|
|
13
|
+
# Create a new project
|
|
14
|
+
myapp init my-project
|
|
15
|
+
|
|
16
|
+
# Start development
|
|
17
|
+
cd my-project
|
|
18
|
+
myapp dev
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
## Key Features
|
|
22
|
+
|
|
23
|
+
- **Fast** - Built for speed and efficiency
|
|
24
|
+
- **Secure** - Security-first architecture
|
|
25
|
+
- **Scalable** - Grows with your needs
|
|
26
|
+
- **Simple** - Easy to learn and use
|
|
27
|
+
|
|
28
|
+
## Documentation Structure
|
|
29
|
+
|
|
30
|
+
Our documentation is organized into the following sections:
|
|
31
|
+
|
|
32
|
+
### Getting Started
|
|
33
|
+
Learn the basics and get your first project running.
|
|
34
|
+
|
|
35
|
+
### Core Concepts
|
|
36
|
+
Understand the fundamental concepts and architecture.
|
|
37
|
+
|
|
38
|
+
### API Reference
|
|
39
|
+
Detailed API documentation with examples.
|
|
40
|
+
|
|
41
|
+
### Guides
|
|
42
|
+
Step-by-step tutorials for common use cases.
|
|
43
|
+
|
|
44
|
+
### Examples
|
|
45
|
+
Real-world examples and best practices.
|
|
46
|
+
|
|
47
|
+
## Need Help?
|
|
48
|
+
|
|
49
|
+
- Join our [Discord community](https://discord.gg/example)
|
|
50
|
+
- Check out our [GitHub discussions](https://github.com/example/discussions)
|
|
51
|
+
- Email support at support@example.com
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import React, { useState } from "react";
|
|
4
|
+
|
|
5
|
+
interface CodeBlockProps {
|
|
6
|
+
children: string;
|
|
7
|
+
language?: string;
|
|
8
|
+
filename?: string;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
export function CodeBlock({
|
|
12
|
+
children,
|
|
13
|
+
language = "typescript",
|
|
14
|
+
filename
|
|
15
|
+
}: CodeBlockProps) {
|
|
16
|
+
const [copied, setCopied] = useState(false);
|
|
17
|
+
|
|
18
|
+
const handleCopy = async () => {
|
|
19
|
+
await navigator.clipboard.writeText(children);
|
|
20
|
+
setCopied(true);
|
|
21
|
+
setTimeout(() => setCopied(false), 2000);
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
return (
|
|
25
|
+
<div className="relative group">
|
|
26
|
+
{filename && (
|
|
27
|
+
<div className="bg-gray-700 text-gray-300 px-4 py-2 text-sm rounded-t-lg">
|
|
28
|
+
{filename}
|
|
29
|
+
</div>
|
|
30
|
+
)}
|
|
31
|
+
<pre className={`bg-gray-800 text-gray-100 p-4 rounded-lg overflow-x-auto ${
|
|
32
|
+
filename ? "rounded-t-none" : ""
|
|
33
|
+
}`}>
|
|
34
|
+
<code className={`language-${language}`}>{children}</code>
|
|
35
|
+
</pre>
|
|
36
|
+
<button
|
|
37
|
+
onClick={handleCopy}
|
|
38
|
+
className="absolute top-2 right-2 px-3 py-1 bg-gray-700 text-gray-300 rounded text-sm opacity-0 group-hover:opacity-100 transition-opacity"
|
|
39
|
+
>
|
|
40
|
+
{copied ? "Copied!" : "Copy"}
|
|
41
|
+
</button>
|
|
42
|
+
</div>
|
|
43
|
+
);
|
|
44
|
+
}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import React, { useState } from "react";
|
|
4
|
+
|
|
5
|
+
export function Header() {
|
|
6
|
+
const [searchQuery, setSearchQuery] = useState("");
|
|
7
|
+
|
|
8
|
+
return (
|
|
9
|
+
<header className="border-b border-gray-200 bg-white sticky top-0 z-50">
|
|
10
|
+
<div className="px-6 py-4 flex items-center justify-between">
|
|
11
|
+
<div className="flex items-center gap-8">
|
|
12
|
+
<a href="/" className="text-xl font-bold text-gray-900">
|
|
13
|
+
📚 My Docs
|
|
14
|
+
</a>
|
|
15
|
+
<nav className="flex gap-6">
|
|
16
|
+
<a href="/docs" className="text-gray-600 hover:text-gray-900">
|
|
17
|
+
Docs
|
|
18
|
+
</a>
|
|
19
|
+
<a href="/api" className="text-gray-600 hover:text-gray-900">
|
|
20
|
+
API
|
|
21
|
+
</a>
|
|
22
|
+
<a href="/examples" className="text-gray-600 hover:text-gray-900">
|
|
23
|
+
Examples
|
|
24
|
+
</a>
|
|
25
|
+
</nav>
|
|
26
|
+
</div>
|
|
27
|
+
<div className="flex items-center gap-4">
|
|
28
|
+
<input
|
|
29
|
+
type="search"
|
|
30
|
+
placeholder="Search docs..."
|
|
31
|
+
value={searchQuery}
|
|
32
|
+
onChange={(e) => setSearchQuery(e.target.value)}
|
|
33
|
+
className="px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
|
34
|
+
/>
|
|
35
|
+
<select className="px-3 py-2 border border-gray-300 rounded-lg">
|
|
36
|
+
<option>v2.0</option>
|
|
37
|
+
<option>v1.0</option>
|
|
38
|
+
</select>
|
|
39
|
+
<a
|
|
40
|
+
href="https://github.com/example/docs"
|
|
41
|
+
className="text-gray-600 hover:text-gray-900"
|
|
42
|
+
>
|
|
43
|
+
GitHub
|
|
44
|
+
</a>
|
|
45
|
+
</div>
|
|
46
|
+
</div>
|
|
47
|
+
</header>
|
|
48
|
+
);
|
|
49
|
+
}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
|
|
5
|
+
const navigation = [
|
|
6
|
+
{
|
|
7
|
+
title: "Getting Started",
|
|
8
|
+
items: [
|
|
9
|
+
{ title: "Introduction", href: "/" },
|
|
10
|
+
{ title: "Installation", href: "/docs/getting-started" },
|
|
11
|
+
{ title: "Quick Start", href: "/docs/getting-started#quick-start" },
|
|
12
|
+
],
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
title: "Core Concepts",
|
|
16
|
+
items: [
|
|
17
|
+
{ title: "Overview", href: "/docs/core-concepts" },
|
|
18
|
+
{ title: "Architecture", href: "/docs/core-concepts#architecture" },
|
|
19
|
+
{ title: "Data Flow", href: "/docs/core-concepts#data-flow" },
|
|
20
|
+
],
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
title: "API Reference",
|
|
24
|
+
items: [
|
|
25
|
+
{ title: "Core API", href: "/docs/api" },
|
|
26
|
+
{ title: "Components", href: "/docs/api#components" },
|
|
27
|
+
{ title: "Hooks", href: "/docs/api#hooks" },
|
|
28
|
+
],
|
|
29
|
+
},
|
|
30
|
+
];
|
|
31
|
+
|
|
32
|
+
export function Sidebar() {
|
|
33
|
+
const [pathname, setPathname] = React.useState("/");
|
|
34
|
+
|
|
35
|
+
React.useEffect(() => {
|
|
36
|
+
setPathname(window.location.pathname);
|
|
37
|
+
}, []);
|
|
38
|
+
|
|
39
|
+
return (
|
|
40
|
+
<aside className="w-64 border-r border-gray-200 min-h-screen">
|
|
41
|
+
<nav className="p-6 space-y-8">
|
|
42
|
+
{navigation.map((section) => (
|
|
43
|
+
<div key={section.title}>
|
|
44
|
+
<h3 className="font-semibold text-gray-900 mb-3">
|
|
45
|
+
{section.title}
|
|
46
|
+
</h3>
|
|
47
|
+
<ul className="space-y-2">
|
|
48
|
+
{section.items.map((item) => (
|
|
49
|
+
<li key={item.href}>
|
|
50
|
+
<a
|
|
51
|
+
href={item.href}
|
|
52
|
+
className={`block px-3 py-1.5 text-sm rounded-md transition-colors ${
|
|
53
|
+
pathname === item.href
|
|
54
|
+
? "bg-blue-50 text-blue-700"
|
|
55
|
+
: "text-gray-600 hover:text-gray-900 hover:bg-gray-50"
|
|
56
|
+
}`}
|
|
57
|
+
>
|
|
58
|
+
{item.title}
|
|
59
|
+
</a>
|
|
60
|
+
</li>
|
|
61
|
+
))}
|
|
62
|
+
</ul>
|
|
63
|
+
</div>
|
|
64
|
+
))}
|
|
65
|
+
</nav>
|
|
66
|
+
</aside>
|
|
67
|
+
);
|
|
68
|
+
}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
@tailwind base;
|
|
2
|
+
@tailwind components;
|
|
3
|
+
@tailwind utilities;
|
|
4
|
+
|
|
5
|
+
/* Documentation styles */
|
|
6
|
+
.prose h1 {
|
|
7
|
+
scroll-margin-top: 5rem;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.prose h2,
|
|
11
|
+
.prose h3 {
|
|
12
|
+
scroll-margin-top: 4rem;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
/* Code highlighting */
|
|
16
|
+
.prose pre {
|
|
17
|
+
background-color: #1e293b;
|
|
18
|
+
color: #e2e8f0;
|
|
19
|
+
padding: 1rem;
|
|
20
|
+
overflow-x: auto;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.prose code {
|
|
24
|
+
background-color: #f3f4f6;
|
|
25
|
+
padding: 0.125rem 0.375rem;
|
|
26
|
+
border-radius: 0.25rem;
|
|
27
|
+
font-size: 0.875em;
|
|
28
|
+
color: #111827;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.prose pre code {
|
|
32
|
+
background-color: transparent;
|
|
33
|
+
padding: 0;
|
|
34
|
+
color: inherit;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
/* Sidebar active state */
|
|
38
|
+
.sidebar-link-active {
|
|
39
|
+
background-color: #3b82f6;
|
|
40
|
+
color: white;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
/* Search highlight */
|
|
44
|
+
.search-highlight {
|
|
45
|
+
background-color: #fef3c7;
|
|
46
|
+
padding: 0.125rem 0.25rem;
|
|
47
|
+
border-radius: 0.125rem;
|
|
48
|
+
}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
title: "My Docs",
|
|
3
|
+
description: "Documentation built with Veryfront",
|
|
4
|
+
|
|
5
|
+
// Documentation configuration
|
|
6
|
+
docs: {
|
|
7
|
+
sidebar: true,
|
|
8
|
+
search: true,
|
|
9
|
+
versions: ["v1", "v2"],
|
|
10
|
+
},
|
|
11
|
+
|
|
12
|
+
// Theme
|
|
13
|
+
theme: {
|
|
14
|
+
colors: {
|
|
15
|
+
primary: "#0EA5E9",
|
|
16
|
+
secondary: "#6366F1",
|
|
17
|
+
},
|
|
18
|
+
},
|
|
19
|
+
|
|
20
|
+
// Development
|
|
21
|
+
dev: {
|
|
22
|
+
port: 3002,
|
|
23
|
+
open: true,
|
|
24
|
+
},
|
|
25
|
+
|
|
26
|
+
// Import map
|
|
27
|
+
resolve: {
|
|
28
|
+
importMap: {
|
|
29
|
+
imports: {
|
|
30
|
+
"react": "https://esm.sh/react@19.1.1",
|
|
31
|
+
"react/jsx-runtime": "https://esm.sh/react@19.1.1/jsx-runtime",
|
|
32
|
+
"react-dom": "https://esm.sh/react-dom@19.1.1",
|
|
33
|
+
"react-dom/client": "https://esm.sh/react-dom@19.1.1/client",
|
|
34
|
+
"fuse.js": "https://esm.sh/fuse.js@7.0.0",
|
|
35
|
+
},
|
|
36
|
+
},
|
|
37
|
+
},
|
|
38
|
+
|
|
39
|
+
cache: {
|
|
40
|
+
dir: ".veryfront/cache",
|
|
41
|
+
render: {
|
|
42
|
+
type: "filesystem",
|
|
43
|
+
ttl: 5 * 60 * 1000,
|
|
44
|
+
maxEntries: 200,
|
|
45
|
+
},
|
|
46
|
+
},
|
|
47
|
+
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
# About
|
|
2
|
+
|
|
3
|
+
This is a minimal Veryfront starter template.
|
|
4
|
+
|
|
5
|
+
## Features
|
|
6
|
+
|
|
7
|
+
- Fast development with HMR
|
|
8
|
+
- MDX support out of the box
|
|
9
|
+
- Tailwind CSS included
|
|
10
|
+
- Production ready
|
|
11
|
+
|
|
12
|
+
## Getting Started
|
|
13
|
+
|
|
14
|
+
1. Edit pages in the `app` directory
|
|
15
|
+
2. Add components in `components`
|
|
16
|
+
3. Configure your app in `veryfront.config.js`
|
|
17
|
+
|
|
18
|
+
Happy coding!
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export default function RootLayout({
|
|
2
|
+
children,
|
|
3
|
+
}: {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
}) {
|
|
6
|
+
return (
|
|
7
|
+
<html lang="en">
|
|
8
|
+
<head>
|
|
9
|
+
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
10
|
+
<link
|
|
11
|
+
rel="stylesheet"
|
|
12
|
+
href="https://cdn.jsdelivr.net/npm/tailwindcss@3/dist/tailwind.min.css"
|
|
13
|
+
/>
|
|
14
|
+
</head>
|
|
15
|
+
<body className="p-8">
|
|
16
|
+
{children}
|
|
17
|
+
</body>
|
|
18
|
+
</html>
|
|
19
|
+
);
|
|
20
|
+
}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
export default function HomePage() {
|
|
2
|
+
return (
|
|
3
|
+
<div className="max-w-2xl mx-auto">
|
|
4
|
+
<h1 className="text-4xl font-bold mb-4">
|
|
5
|
+
Welcome to Veryfront
|
|
6
|
+
</h1>
|
|
7
|
+
<p className="text-gray-600 mb-8">
|
|
8
|
+
Edit <code className="bg-gray-100 px-1 rounded">app/page.tsx</code> to get started.
|
|
9
|
+
</p>
|
|
10
|
+
<div className="flex gap-4">
|
|
11
|
+
<a
|
|
12
|
+
href="/about"
|
|
13
|
+
className="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600"
|
|
14
|
+
>
|
|
15
|
+
About
|
|
16
|
+
</a>
|
|
17
|
+
<a
|
|
18
|
+
href="https://github.com/veryfront/veryfront"
|
|
19
|
+
className="px-4 py-2 border border-gray-300 rounded hover:bg-gray-50"
|
|
20
|
+
>
|
|
21
|
+
Documentation
|
|
22
|
+
</a>
|
|
23
|
+
</div>
|
|
24
|
+
</div>
|
|
25
|
+
);
|
|
26
|
+
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
title: "My Veryfront App",
|
|
3
|
+
description: "A minimal Veryfront starter",
|
|
4
|
+
|
|
5
|
+
dev: {
|
|
6
|
+
port: 3002,
|
|
7
|
+
open: true,
|
|
8
|
+
},
|
|
9
|
+
|
|
10
|
+
resolve: {
|
|
11
|
+
importMap: {
|
|
12
|
+
imports: {
|
|
13
|
+
"react": "https://esm.sh/react@19.1.1",
|
|
14
|
+
"react/jsx-runtime": "https://esm.sh/react@19.1.1/jsx-runtime",
|
|
15
|
+
"react-dom": "https://esm.sh/react-dom@19.1.1",
|
|
16
|
+
"react-dom/client": "https://esm.sh/react-dom@19.1.1/client",
|
|
17
|
+
},
|
|
18
|
+
},
|
|
19
|
+
},
|
|
20
|
+
|
|
21
|
+
cache: {
|
|
22
|
+
dir: ".veryfront/cache",
|
|
23
|
+
render: {
|
|
24
|
+
type: "memory",
|
|
25
|
+
ttl: 60 * 1000,
|
|
26
|
+
maxEntries: 200,
|
|
27
|
+
},
|
|
28
|
+
},
|
|
29
|
+
};
|