@theholocron/react-template

A modern React template with pre-configured tools, best practices, and CI/CD setup for rapid project development.

Installation

pnpm install @theholocron/react-template

Usage

import {} from "@theholocron/react-template";

function App() {
  return <></>;
}

Getting Started

Use the Holocron CLI to scaffold a new React project. It clones the template, renames all placeholder references, wires up your vault provider, and runs holocron setup in one step:

npx @theholocron/cli new react my-app \
  --description "My app description" \
  --homepage "https://my-app.example.com" \
  --vault doppler \
  --agent claude

This will:

1. Create theholocron/my-app from this template on GitHub
2. Replace all react-template references with my-app throughout the repo
3. Run pnpm install (including Playwright browser download)
4. Run holocron setup to configure branch protection, labels, workflows, and repo settings

Development

| Script | Command | | --------------------- | -------------------------------------------------------------------------------------------------------------- | | pnpm build | vite build | | pnpm dev | vite | | pnpm preview | vite preview --config vite.app.config.ts | | pnpm start | storybook dev -p 6006 | | pnpm docs:dev | astro dev | | pnpm docs:build | astro build | | pnpm docs:preview | astro preview | | pnpm lint | docker run -e LOG_LEVEL=DEBUG -e RUN_LOCAL=true -v .:/tmp/lint --rm ghcr.io/super-linter/super-linter:latest | | pnpm test | vitest | | pnpm test:coverage | vitest run --project storybook --coverage | | pnpm test:storybook | vitest run --project storybook --coverage | | pnpm test:cypress | cypress open | | pnpm typecheck | tsc --noEmit | | pnpm audit | knip |

What's Included

| Tool | Purpose | | ------------------------------------------------------- | --------------------------------------------- | | React 19 | UI framework | | Vite | Build tool and dev server | | TypeScript | Type safety | | Storybook | Component development and interaction testing | | Vitest | Test runner with browser mode | | Playwright | Browser automation for play tests | | MSW | API mocking | | ESLint | Linting | | Stylelint | CSS linting | | Prettier | Formatting | | semantic-release | Automated releases |

Releases

Automated via semantic-release. See the releases page and CHANGELOG.md.