create-bodhi-js

Scaffold Bodhi-powered applications with React, TypeScript, Vite, Tailwind CSS, shadcn/ui, and comprehensive tooling.

Usage

# Interactive mode
npm create bodhi-js@latest

# With project name
npm create bodhi-js@latest my-app

# With options (note the -- separator before flags)
npm create bodhi-js@latest my-app -- --github-pages --github-org "myorg" --dev-client-id "app-id"

Features

Core Stack:

• ⚡ Vite 7 - Next generation frontend tooling
• ⚛️ React 19 - Latest React with modern patterns
• 📘 TypeScript - Strict mode enabled
• 🎨 Tailwind CSS v4 - Utility-first CSS
• 🧩 shadcn/ui - Re-usable components
• 🤖 bodhi-js-react - Local LLM integration

Code Quality:

• 🔍 ESLint 9 + Prettier
• 📝 EditorConfig
• 🎯 Strict TypeScript

Testing:

• ✅ Vitest - Unit testing
• 🎭 Playwright - E2E testing

CI/CD (optional):

• 🔄 GitHub Actions
• 📦 GitHub Pages deployment
• 🤖 Dependabot

Options

Usage: create-bodhi-js [project-name] [options]

Arguments:
  project-name              Name of the project

Options:
  -V, --version             output the version number
  -t, --template <name>     Template to use (react, svelte, vue) (default: "react")
  --no-install              Skip dependency installation
  --no-git                  Skip git initialization
  --github-pages            Enable GitHub Pages deployment setup
  --no-github-pages         Disable GitHub Pages deployment setup
  --github-org <org>        GitHub repository owner (user/org)
  --dev-client-id <id>      Development client ID (for .env.local and CI)
  --prod-client-id <id>     Production client ID (for GitHub Pages deploy)
  --ci                      Run in CI mode (disable animations)
  -h, --help                display help for command

Templates

Available Templates

• react - React + TypeScript + Vite + Tailwind + shadcn/ui + bodhi-js-react (default)

Custom Templates

Use any Git repository as a template:

npm create bodhi-js@latest my-app -- --template gh:username/my-template

Supported Git providers (via giget):

• GitHub: gh:user/repo
• GitLab: gitlab:user/repo
• BitBucket: bitbucket:user/repo

What's Included?

When you scaffold a project with create-bodhi-js, you get:

my-app/
├── .github/              # GitHub templates and workflows
│   ├── workflows/        # CI/CD pipelines
│   ├── ISSUE_TEMPLATE/   # Issue templates
│   └── ...
├── e2e/                  # Playwright E2E tests
├── public/               # Static assets
├── src/
│   ├── components/       # React components
│   │   └── ui/           # shadcn/ui components
│   ├── hooks/            # Custom React hooks
│   ├── lib/              # Utility functions
│   ├── test/             # Test setup
│   ├── App.tsx           # Main app component
│   ├── main.tsx          # Entry point
│   ├── env.ts            # Environment variable validation
│   └── index.css         # Global styles
├── .editorconfig         # Editor configuration
├── .prettierrc           # Prettier configuration
├── components.json       # shadcn/ui configuration
├── eslint.config.js      # ESLint configuration
├── playwright.config.ts  # Playwright configuration
├── tsconfig.json         # TypeScript configuration
├── vite.config.ts        # Vite configuration
└── package.json          # Dependencies and scripts

Post-Installation

After scaffolding your project:

1. Configure environment variables:

   cp .env.example .env
   # Edit .env with your Bodhi OAuth credentials

2. Start development server:

   npm run dev

3. Run tests:

   npm test           # Unit tests
   npm run test:e2e   # E2E tests

4. Build for production:

   npm run build

License

MIT License - see LICENSE for details.

Related

• bodhi-browser - Bodhi Browser Extension
• template-bodhi-react-vite - React template source