Skip to content
Open
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
1 change: 1 addition & 0 deletions .vitepress/config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,7 @@ j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
{
text: 'Standards',
items: [
{ text: 'Bun', link: '/standards/bun' },
{ text: 'TypeScript', link: '/standards/typescript' },
{ text: 'NestJS', link: '/standards/nestjs' },
{ text: 'Nuxt', link: '/standards/nuxt' },
Expand Down
10 changes: 5 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,16 +8,16 @@ Built with [VitePress](https://vitepress.dev/).

```bash
# Install dependencies
npm install
bun install

# Start dev server
npm run docs:dev
bun run docs:dev

# Build for production
npm run docs:build
bun run docs:build

# Preview production build
npm run docs:preview
bun run docs:preview
```

The dev server runs at `http://localhost:5173` by default.
Expand Down Expand Up @@ -92,6 +92,6 @@ docs/
The production build outputs to `.vitepress/dist/`. Deploy this folder to any static hosting provider (Netlify, Vercel, GitHub Pages, Cloudflare Pages, etc.).

```bash
npm run docs:build
bun run docs:build
# Deploy .vitepress/dist/
```
359 changes: 359 additions & 0 deletions bun.lock

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion docs/backend/api-docs.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ This means that every controller endpoint and every DTO property must be properl
## Installation

```bash
npm install @nestjs/swagger swagger-ui-express
bun add @nestjs/swagger swagger-ui-express
```

## Setup in main.ts
Expand Down
20 changes: 10 additions & 10 deletions docs/backend/database.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,8 +20,8 @@ You edit the per-slice `.prisma` files. The `prisma-import` tool merges them. Pr
## Installation

```bash
npm install @prisma/client
npm install -D prisma prisma-import
bun add @prisma/client
bun add -d prisma prisma-import
```

Install the **Prisma Import** VSCode extension (`ajmnz.prisma-import`) for syntax highlighting and IntelliSense in split schema files.
Expand All @@ -33,13 +33,13 @@ Add the prisma-import config and scripts to your `package.json`:
```json [package.json]
{
"scripts": {
"generate": "npx prisma-import --force",
"premigrate": "npx prisma-import --force",
"migrate": "dotenv -e .env.dev -- npx prisma migrate dev && dotenv -e .env.dev -- npx prisma generate",
"migrate:prod": "dotenv -e .env.prod -- npx prisma migrate deploy",
"studio": "dotenv -e .env.dev -- npx prisma studio",
"generate": "bunx prisma-import --force",
"premigrate": "bunx prisma-import --force",
"migrate": "dotenv -e .env.dev -- bunx prisma migrate dev && dotenv -e .env.dev -- bunx prisma generate",
"migrate:prod": "dotenv -e .env.prod -- bunx prisma migrate deploy",
"studio": "dotenv -e .env.dev -- bunx prisma studio",
"docker": "docker compose up -d",
"predev": "npm run docker && npm run migrate"
"predev": "bun run docker && bun run migrate"
},
"prisma": {
"import": {
Expand Down Expand Up @@ -217,9 +217,9 @@ When you change a model:
```bash
# 1. Edit the slice .prisma file
# 2. Merge schemas and create migration
npm run migrate
bun run migrate
# 3. View data in Prisma Studio (optional)
npm run studio
bun run studio
```

The `premigrate` hook runs `prisma-import --force` automatically before each migration, so you only need one command.
Expand Down
10 changes: 5 additions & 5 deletions docs/backend/getting-started.md
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ Every feature lives inside `src/slices/`. Infrastructure slices go under `setup/

## Prerequisites

Make sure you have Docker, Node.js 24+, and npm installed. Create an `.nvmrc` file at the project root to lock the Node version:
Make sure you have Docker, Node.js 24+, and [Bun](/standards/bun) installed. Create an `.nvmrc` file at the project root to lock the Node version:

```
24
Expand Down Expand Up @@ -309,14 +309,14 @@ import { UserService } from '#/user/domain/user.service';
```

::: tip Why # instead of @?
The `@` symbol is already used for scoped npm packages like `@nestjs/common`. Using `#` makes it immediately clear that the import points to an internal slice.
The `@` symbol is already used for scoped packages like `@nestjs/common`. Using `#` makes it immediately clear that the import points to an internal slice.
:::

## Quick Start

```bash
# 1. Install dependencies
npm install
bun install

# 2. Copy environment file
cp .env.example .env.dev
Expand All @@ -325,10 +325,10 @@ cp .env.example .env.dev
docker-compose up -d

# 4. Run database migrations
npm run migrate
bun run migrate

# 5. Start development server
npm run start:dev
bun run start:dev

# 6. Open Swagger UI
open http://localhost:3000/api
Expand Down
2 changes: 1 addition & 1 deletion docs/ecosystem/ranch.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ It's the production answer to "how do I run a fleet of agents without writing my

```bash
bun add -g @cleanslice/ranch
# or: npm install -g @cleanslice/ranch
# or: bun add -g @cleanslice/ranch

ranch dev # offers to clone, then starts api + app + admin + local k3d
```
Expand Down
8 changes: 4 additions & 4 deletions docs/examples/user-slice.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ Run the migration:

```bash
cd api
npx prisma migrate dev --name add-user
bunx prisma migrate dev --name add-user
```

## Step 2: Backend — Domain Layer
Expand Down Expand Up @@ -604,10 +604,10 @@ app/slices/user/

## Verification

1. Start the API: `cd api && npm run start:dev`
1. Start the API: `cd api && bun run start:dev`
2. Check Swagger: Open `http://localhost:4000/api` — you should see all user endpoints
3. Generate the SDK: `npx @hey-api/openapi-ts -i http://localhost:4000/api-json -o app/slices/setup/api/data/repositories/api -c axios`
4. Start the app: `cd app && npm run dev`
3. Generate the SDK: `bunx @hey-api/openapi-ts -i http://localhost:4000/api-json -o app/slices/setup/api/data/repositories/api -c axios`
4. Start the app: `cd app && bun run dev`
5. Visit `http://localhost:3000/users` — the user list page should render

## What's Next?
Expand Down
20 changes: 10 additions & 10 deletions docs/frontend/api-integration.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ CleanSlice generates a fully typed API client from your backend's OpenAPI/Swagge
The flow is straightforward:

1. Your NestJS API generates a `swagger-spec.json` file at startup
2. You run `npm run build:api` in the Nuxt app
2. You run `bun run build:api` in the Nuxt app
3. `@hey-api/openapi-ts` reads the spec and generates TypeScript code
4. Feature slices import the generated services and types via the `#api` alias

Expand All @@ -25,10 +25,10 @@ swagger-spec.json ──build:api──> slices/setup/api/data/repositories/ap

```bash
# Code generator (dev dependency)
npm install -D @hey-api/openapi-ts
bun add -d @hey-api/openapi-ts

# Runtime client
npm install @hey-api/client-axios axios
bun add @hey-api/client-axios axios
```

Add the build script to your `package.json`:
Expand All @@ -37,8 +37,8 @@ Add the build script to your `package.json`:
{
"scripts": {
"build:api": "openapi-ts",
"dev": "npm run build:api && nuxt dev",
"build": "npm run build:api && nuxt build"
"dev": "bun run build:api && nuxt dev",
"build": "bun run build:api && nuxt build"
}
}
```
Expand Down Expand Up @@ -131,7 +131,7 @@ API_URL=http://localhost:3333
For production builds, pass it as a build argument:

```bash
API_URL=https://api.yourapp.com npm run build
API_URL=https://api.yourapp.com bun run build
```

## Generated SDK Structure
Expand All @@ -156,7 +156,7 @@ slices/setup/api/data/repositories/api/
```

::: warning
The files in `data/repositories/api/` are auto-generated. Any manual edits are overwritten the next time you run `npm run build:api`.
The files in `data/repositories/api/` are auto-generated. Any manual edits are overwritten the next time you run `bun run build:api`.
:::

## Barrel Exports
Expand Down Expand Up @@ -355,7 +355,7 @@ import {

## Regenerating the SDK

Run `npm run build:api` whenever:
Run `bun run build:api` whenever:

- Backend API endpoints change
- DTOs are added or modified
Expand All @@ -366,10 +366,10 @@ Run `npm run build:api` whenever:

```bash
# Terminal 1: Run the API (generates swagger-spec.json on start)
cd api && npm run start:dev
cd api && bun run start:dev

# Terminal 2: Run the app (regenerates SDK, then starts Nuxt)
cd app && npm run dev
cd app && bun run dev
```

::: tip
Expand Down
2 changes: 1 addition & 1 deletion docs/frontend/dependency-injection.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ The service depends on a gateway *interface*, not a concrete implementation. At
## Installation

```bash
npm install inversify reflect-metadata
bun add inversify reflect-metadata
```

Your `tsconfig.json` must enable decorators (already done if you followed [Getting Started](/frontend/getting-started)):
Expand Down
12 changes: 6 additions & 6 deletions docs/frontend/getting-started.md
Original file line number Diff line number Diff line change
Expand Up @@ -176,7 +176,7 @@ Each setup slice provides a piece of core infrastructure:

## Post-Installation Cleanup

If you scaffold a new Nuxt app with `npx nuxi init`, remove the default directories that CleanSlice replaces:
If you scaffold a new Nuxt app with `bunx nuxi init`, remove the default directories that CleanSlice replaces:

```bash
rm -rf components composables pages layouts middleware plugins assets
Expand All @@ -189,15 +189,15 @@ All of these now live inside individual slices.
Build and run your app in production using Docker:

```dockerfile [Dockerfile]
FROM node:22-alpine AS builder
FROM oven/bun:1-alpine AS builder
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
COPY package.json bun.lock ./
RUN bun install --frozen-lockfile
COPY . .
ARG API_URL
RUN API_URL=${API_URL} npm run build
RUN API_URL=${API_URL} bun run build
EXPOSE 3000
CMD ["npm", "run", "start"]
CMD ["bun", "run", "start"]
```

```bash
Expand Down
2 changes: 1 addition & 1 deletion docs/frontend/i18n.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ Runtime
## Installation

```bash
npm install -D @nuxtjs/i18n@next
bun add -d @nuxtjs/i18n@next
```

## Base i18n Slice Configuration
Expand Down
2 changes: 1 addition & 1 deletion docs/frontend/state-management.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ All stores are globally available. No import needed.
## Installation

```bash
npm install @pinia/nuxt pinia
bun add @pinia/nuxt pinia
```

## Pinia Slice Configuration
Expand Down
18 changes: 9 additions & 9 deletions docs/frontend/ui-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,16 +15,16 @@ UI components are shared infrastructure, not feature code. By centralizing them

```bash
# Tailwind and shadcn
npm install -D @nuxtjs/tailwindcss shadcn-nuxt tailwindcss-animate
npm install -D @tailwindcss/typography sass sass-loader vite-svg-loader
bun add -d @nuxtjs/tailwindcss shadcn-nuxt tailwindcss-animate
bun add -d @tailwindcss/typography sass sass-loader vite-svg-loader

# Runtime dependencies
npm install clsx tailwind-merge lucide-vue-next
npm install vee-validate @vee-validate/zod zod vaul-vue
bun add clsx tailwind-merge lucide-vue-next
bun add vee-validate @vee-validate/zod zod vaul-vue

# Optional: web fonts
npm install webfontloader
npm install -D @types/webfontloader
bun add webfontloader
bun add -d @types/webfontloader
```

## Slice Structure
Expand Down Expand Up @@ -293,10 +293,10 @@ Then install components:

```bash
# Single component
npx shadcn-vue@latest add button
bunx shadcn-vue@latest add button

# Multiple components at once
npx shadcn-vue@latest add card input textarea dialog toast
bunx shadcn-vue@latest add card input textarea dialog toast
```

### components.json
Expand Down Expand Up @@ -325,7 +325,7 @@ This file tells the shadcn CLI where to put components and where to find utiliti
### Common Components to Install

```bash
npx shadcn-vue@latest add button card input textarea select \
bunx shadcn-vue@latest add button card input textarea select \
checkbox switch form dropdown-menu navigation-menu tabs \
breadcrumb alert alert-dialog toast sonner dialog sheet \
popover tooltip table avatar badge separator scroll-area
Expand Down
13 changes: 7 additions & 6 deletions docs/guide/getting-started.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,8 @@ This guide walks you through creating a new CleanSlice project from scratch.

## Prerequisites

- [Node.js](https://nodejs.org/) v18 or later
- [Bun](https://bun.sh/) — the package manager CleanSlice uses everywhere, see [Bun](/standards/bun)
- [Node.js](https://nodejs.org/) v18 or later — still the production runtime for the api
- [Docker](https://www.docker.com/) (for PostgreSQL and other services)
- A code editor (VS Code recommended)

Expand All @@ -13,7 +14,7 @@ This guide walks you through creating a new CleanSlice project from scratch.
The fastest way to start is with the CLI:

```bash
npx create-cleanslice my-app
bunx create-cleanslice my-app
cd my-app
```

Expand Down Expand Up @@ -62,9 +63,9 @@ Install Prisma and initialize it:

```bash
cd api
npm install @prisma/client
npm install -D prisma
npx prisma init
bun add @prisma/client
bun add -d prisma
bunx prisma init
```

Create the Prisma setup slice at `api/src/slices/prisma/`:
Expand Down Expand Up @@ -109,7 +110,7 @@ export { PrismaService } from './prisma.service';
Install Swagger for API documentation:

```bash
npm install @nestjs/swagger
bun add @nestjs/swagger
```

Configure it in `api/src/main.ts`:
Expand Down
2 changes: 1 addition & 1 deletion docs/guide/setup-slices.md
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,7 @@ export default defineNuxtConfig({
Generate the SDK from your running backend:

```bash
npx @hey-api/openapi-ts \
bunx @hey-api/openapi-ts \
-i http://localhost:4000/api-json \
-o app/slices/setup/api/data/repositories/api \
-c axios
Expand Down
2 changes: 1 addition & 1 deletion docs/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ features:
## Quick Start

```bash
npx create-cleanslice my-app
bunx create-cleanslice my-app
cd my-app
```

Expand Down
Loading