vite-flare-starter

Name: vite-flare-starter
Author: jezweb

937stars96forks

How to install vite-flare-starter?

jezweb/claude-skills/vite-flare-starter

$npx -y skills add jezweb/claude-skills --skill vite-flare-starter

Installs into the current project.

Summary

Scaffold a full-stack Cloudflare app from the vite-flare-starter template — React 19 + Hono + D1+Drizzle + better-auth + Tailwind v4+shadcn/ui + TanStack Query + R2 + Workers AI. Run setup.sh to clone, configure, and deploy. Use whenever the user wants a batteries-included Cloudf

Files · 1

View on GitHub

SKILL.md

1	# Vite Flare Starter
2
3	Clone and configure the batteries-included Cloudflare starter into a standalone project. Produces a fully rebranded, deployable full-stack app.
4
5	## Stack
6
7	\| Layer \| Technology \| Version \|
8	\|-------\|-----------\|---------\|
9	\| Frontend \| React, Vite, Tailwind CSS, shadcn/ui \| 19, 6.x, v4, latest \|
10	\| Backend \| Hono (on Cloudflare Workers) \| 4.x \|
11	\| Database \| D1 (SQLite at edge) + Drizzle ORM \| 0.38+ \|
12	\| Auth \| better-auth (Google OAuth + email/password) \| latest \|
13	\| Storage \| R2 (S3-compatible object storage) \| — \|
14	\| AI \| Workers AI binding \| — \|
15	\| Data Fetching \| TanStack Query \| v5 \|
16
17	### Cloudflare Bindings
18
19	\| Binding \| Type \| Purpose \|
20	\|---------\|------\|---------\|
21	\| `DB` \| D1 Database \| Primary application database \|
22	\| `AVATARS` \| R2 Bucket \| User avatar storage \|
23	\| `FILES` \| R2 Bucket \| General file uploads \|
24	\| `AI` \| Workers AI \| AI model inference \|
25
26	### Project Structure
27
28	```
29	src/
30	├── client/ # React frontend
31	│ ├── components/ # UI components
32	│ ├── hooks/ # Custom hooks + TanStack Query
33	│ ├── pages/ # Route pages
34	│ ├── lib/ # Utilities (auth client, etc.)
35	│ └── main.tsx # App entry point
36	├── server/ # Hono backend
37	│ ├── index.ts # Worker entry point
38	│ ├── routes/ # API routes
39	│ ├── middleware/ # Auth, CORS, etc.
40	│ └── db/ # Drizzle schema + queries
41	└── shared/ # Shared types between client/server
42	```
43
44	### Key Commands
45
46	\| Command \| Purpose \|
47	\|---------\|---------\|
48	\| `pnpm dev` \| Start local dev server \|
49	\| `pnpm build` \| Production build \|
50	\| `pnpm deploy` \| Deploy to Cloudflare \|
51	\| `pnpm db:migrate:local` \| Apply migrations locally \|
52	\| `pnpm db:migrate:remote` \| Apply migrations to production \|
53	\| `pnpm db:generate` \| Generate migration from schema changes \|
54
55	## Workflow
56
57	### Step 1: Gather Project Info
58
59	Ask for:
60
61	\| Required \| Optional \|
62	\|----------\|----------\|
63	\| Project name (kebab-case) \| Admin email \|
64	\| Description (1 sentence) \| Google OAuth credentials \|
65	\| Cloudflare account \| Custom domain \|
66
67	### Step 2: Clone and Configure
68
69	#### 2a. Clone and clean
70
71	```bash
72	git clone https://github.com/jezweb/vite-flare-starter.git PROJECT_DIR --depth 1
73	cd PROJECT_DIR
74	rm -rf .git
75	git init
76	```
77
78	#### 2b. Find-replace targets
79
80	Replace `vite-flare-starter` with the project name in these locations:
81
82	\| File \| Target \| Replace with \|
83	\|------\|--------\|-------------\|
84	\| `wrangler.jsonc` \| `"vite-flare-starter"` (worker name) \| `"PROJECT_NAME"` \|
85	\| `wrangler.jsonc` \| `vite-flare-starter-db` \| `PROJECT_NAME-db` \|
86	\| `wrangler.jsonc` \| `vite-flare-starter-avatars` \| `PROJECT_NAME-avatars` \|
87	\| `wrangler.jsonc` \| `vite-flare-starter-files` \| `PROJECT_NAME-files` \|
88	\| `package.json` \| `"name": "vite-flare-starter"` \| `"name": "PROJECT_NAME"` \|
89	\| `package.json` \| `vite-flare-starter-db` \| `PROJECT_NAME-db` \|
90	\| `index.html` \| `<title>` content \| App display name (Title Case) \|
91
92	Also in `wrangler.jsonc`:
93	- Remove hardcoded `account_id` line (let wrangler prompt or use env var)
94	- Replace `database_id` value with `REPLACE_WITH_YOUR_DATABASE_ID`
95
96	Reset `package.json` version to `"0.1.0"`.
97
98	Use the Edit tool for replacements (preferred over sed to avoid macOS/GNU differences).
99
100	#### 2c. Generate auth secret
101
102	```bash
103	BETTER_AUTH_SECRET=$(openssl rand -hex 32 2>/dev/null \|\| python3 -c "import secrets; print(secrets.token_hex(32))")
104	```
105
106	#### 2d. Create .dev.vars
107
108	Convert kebab-case project name: `my-cool-app` becomes Display `My Cool App`, ID `my_cool_app`.
109
110	```
111	# Local Development Environment Variables
112	# DO NOT COMMIT THIS FILE TO GIT
113
114	# Authentication (better-auth)
115	BETTER_AUTH_SECRET=<generated>
116	BETTER_AUTH_URL=http://localhost:5173
117
118	# Google OAuth (optional)
119	GOOGLE_CLIENT_ID=
120	GOOGLE_CLIENT_SECRET=
121
122	# Email Auth Control (disabled by default)
123	# ENABLE_EMAIL_LOGIN=true
124	# ENABLE_EMAIL_SIGNUP=true
125
126	# Application Configuration
127	APP_NAME=<Display Name>
128	VITE_APP_NAME=<Display Name>
129	VITE_APP_ID=<app_id>
130	VITE_TOKEN_PREFIX=<app_id>_
131	VITE_GITHUB_URL=
132	VITE_FOOTER_TEXT=
133
134	NODE_ENV=development
135	```
136
137	#### 2e. Create Cloudflare resources (optional)
138
139	```bash
140	npx wrangler d1 create PROJECT_NAME-db
141	# Extract database_id from output, update wrangler.jsonc
142
143	npx wrangler r2 bucket create PROJECT_NAME-avatars
144	npx wrangler r2 bucket create PROJECT_NAME-files
145	```
146
147	#### 2f. Install and migrate
148
149	```bash
150	pnpm install
151	pnpm run db:migrate:local
152	```
153
154	#### 2g. Initial commit
155
156	```bash
157	git add -A
158	git c

People who liked this also viewed

6 picks

Type

vite-flare-starter

937stars96forks

View on GitHub

How to install vite-flare-starter?

jezweb/claude-skills/vite-flare-starter

$npx -y skills add jezweb/claude-skills --skill vite-flare-starter

Installs into the current project.

Summary

Files · 1

View on GitHub

SKILL.md

1	# Vite Flare Starter
2
3	Clone and configure the batteries-included Cloudflare starter into a standalone project. Produces a fully rebranded, deployable full-stack app.
4
5	## Stack
6
7	\| Layer \| Technology \| Version \|
8	\|-------\|-----------\|---------\|
9	\| Frontend \| React, Vite, Tailwind CSS, shadcn/ui \| 19, 6.x, v4, latest \|
10	\| Backend \| Hono (on Cloudflare Workers) \| 4.x \|
11	\| Database \| D1 (SQLite at edge) + Drizzle ORM \| 0.38+ \|
12	\| Auth \| better-auth (Google OAuth + email/password) \| latest \|
13	\| Storage \| R2 (S3-compatible object storage) \| — \|
14	\| AI \| Workers AI binding \| — \|
15	\| Data Fetching \| TanStack Query \| v5 \|
16
17	### Cloudflare Bindings
18
19	\| Binding \| Type \| Purpose \|
20	\|---------\|------\|---------\|
21	\| `DB` \| D1 Database \| Primary application database \|
22	\| `AVATARS` \| R2 Bucket \| User avatar storage \|
23	\| `FILES` \| R2 Bucket \| General file uploads \|
24	\| `AI` \| Workers AI \| AI model inference \|
25
26	### Project Structure
27
28	```
29	src/
30	├── client/ # React frontend
31	│ ├── components/ # UI components
32	│ ├── hooks/ # Custom hooks + TanStack Query
33	│ ├── pages/ # Route pages
34	│ ├── lib/ # Utilities (auth client, etc.)
35	│ └── main.tsx # App entry point
36	├── server/ # Hono backend
37	│ ├── index.ts # Worker entry point
38	│ ├── routes/ # API routes
39	│ ├── middleware/ # Auth, CORS, etc.
40	│ └── db/ # Drizzle schema + queries
41	└── shared/ # Shared types between client/server
42	```
43
44	### Key Commands
45
46	\| Command \| Purpose \|
47	\|---------\|---------\|
48	\| `pnpm dev` \| Start local dev server \|
49	\| `pnpm build` \| Production build \|
50	\| `pnpm deploy` \| Deploy to Cloudflare \|
51	\| `pnpm db:migrate:local` \| Apply migrations locally \|
52	\| `pnpm db:migrate:remote` \| Apply migrations to production \|
53	\| `pnpm db:generate` \| Generate migration from schema changes \|
54
55	## Workflow
56
57	### Step 1: Gather Project Info
58
59	Ask for:
60
61	\| Required \| Optional \|
62	\|----------\|----------\|
63	\| Project name (kebab-case) \| Admin email \|
64	\| Description (1 sentence) \| Google OAuth credentials \|
65	\| Cloudflare account \| Custom domain \|
66
67	### Step 2: Clone and Configure
68
69	#### 2a. Clone and clean
70
71	```bash
72	git clone https://github.com/jezweb/vite-flare-starter.git PROJECT_DIR --depth 1
73	cd PROJECT_DIR
74	rm -rf .git
75	git init
76	```
77
78	#### 2b. Find-replace targets
79
80	Replace `vite-flare-starter` with the project name in these locations:
81
82	\| File \| Target \| Replace with \|
83	\|------\|--------\|-------------\|
84	\| `wrangler.jsonc` \| `"vite-flare-starter"` (worker name) \| `"PROJECT_NAME"` \|
85	\| `wrangler.jsonc` \| `vite-flare-starter-db` \| `PROJECT_NAME-db` \|
86	\| `wrangler.jsonc` \| `vite-flare-starter-avatars` \| `PROJECT_NAME-avatars` \|
87	\| `wrangler.jsonc` \| `vite-flare-starter-files` \| `PROJECT_NAME-files` \|
88	\| `package.json` \| `"name": "vite-flare-starter"` \| `"name": "PROJECT_NAME"` \|
89	\| `package.json` \| `vite-flare-starter-db` \| `PROJECT_NAME-db` \|
90	\| `index.html` \| `<title>` content \| App display name (Title Case) \|
91
92	Also in `wrangler.jsonc`:
93	- Remove hardcoded `account_id` line (let wrangler prompt or use env var)
94	- Replace `database_id` value with `REPLACE_WITH_YOUR_DATABASE_ID`
95
96	Reset `package.json` version to `"0.1.0"`.
97
98	Use the Edit tool for replacements (preferred over sed to avoid macOS/GNU differences).
99
100	#### 2c. Generate auth secret
101
102	```bash
103	BETTER_AUTH_SECRET=$(openssl rand -hex 32 2>/dev/null \|\| python3 -c "import secrets; print(secrets.token_hex(32))")
104	```
105
106	#### 2d. Create .dev.vars
107
108	Convert kebab-case project name: `my-cool-app` becomes Display `My Cool App`, ID `my_cool_app`.
109
110	```
111	# Local Development Environment Variables
112	# DO NOT COMMIT THIS FILE TO GIT
113
114	# Authentication (better-auth)
115	BETTER_AUTH_SECRET=<generated>
116	BETTER_AUTH_URL=http://localhost:5173
117
118	# Google OAuth (optional)
119	GOOGLE_CLIENT_ID=
120	GOOGLE_CLIENT_SECRET=
121
122	# Email Auth Control (disabled by default)
123	# ENABLE_EMAIL_LOGIN=true
124	# ENABLE_EMAIL_SIGNUP=true
125
126	# Application Configuration
127	APP_NAME=<Display Name>
128	VITE_APP_NAME=<Display Name>
129	VITE_APP_ID=<app_id>
130	VITE_TOKEN_PREFIX=<app_id>_
131	VITE_GITHUB_URL=
132	VITE_FOOTER_TEXT=
133
134	NODE_ENV=development
135	```
136
137	#### 2e. Create Cloudflare resources (optional)
138
139	```bash
140	npx wrangler d1 create PROJECT_NAME-db
141	# Extract database_id from output, update wrangler.jsonc
142
143	npx wrangler r2 bucket create PROJECT_NAME-avatars
144	npx wrangler r2 bucket create PROJECT_NAME-files
145	```
146
147	#### 2f. Install and migrate
148
149	```bash
150	pnpm install
151	pnpm run db:migrate:local
152	```
153
154	#### 2g. Initial commit
155
156	```bash
157	git add -A
158	git c

People who liked this also viewed

6 picks

Type