create-cloudinary-react 1.0.0-beta.19 ā†’ 1.0.0-beta.21

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.
Files changed (5) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/README.md +76 -31
  3. package/cli.js +1 -1
  4. package/package.json +1 -1
  5. package/templates/src/App.tsx.template +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,17 @@
1
+ # [1.0.0-beta.21](https://github.com/cloudinary-devs/create-cloudinary-react/compare/v1.0.0-beta.20...v1.0.0-beta.21) (2026-02-25)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * update title in readme and ui ([54f633e](https://github.com/cloudinary-devs/create-cloudinary-react/commit/54f633e6fc2a6e800979c9962383c8f83523f79b))
7
+
8
+ # [1.0.0-beta.20](https://github.com/cloudinary-devs/create-cloudinary-react/compare/v1.0.0-beta.19...v1.0.0-beta.20) (2026-02-23)
9
+
10
+
11
+ ### Bug Fixes
12
+
13
+ * Merge pull request [#9](https://github.com/cloudinary-devs/create-cloudinary-react/issues/9) from jlooper-cloudinary/main ([9696686](https://github.com/cloudinary-devs/create-cloudinary-react/commit/96966864d65168b0210a8200f26c9d0d144b6fa9))
14
+
1
15
  # [1.0.0-beta.19](https://github.com/cloudinary-devs/create-cloudinary-react/compare/v1.0.0-beta.18...v1.0.0-beta.19) (2026-02-18)
2
16
 
3
17
 
package/README.md CHANGED
@@ -1,57 +1,99 @@
1
1
  # create-cloudinary-react
2
2
 
3
- > **Beta Release** - This is a beta version. We welcome feedback and bug reports!
4
-
5
- Part of the [Cloudinary Developers](https://github.com/cloudinary-devs) organization.
3
+ [![npm version](https://img.shields.io/npm/v/create-cloudinary-react.svg?style=flat-square)](https://www.npmjs.com/package/create-cloudinary-react)
4
+ [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg?style=flat-square)](https://opensource.org/licenses/MIT)
5
+ [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
6
6
 
7
- Scaffold a Cloudinary React + Vite + TypeScript project with interactive setup.
7
+ **The fastest way to start building with Cloudinary and React.**
8
8
 
9
- ## Prerequisites
9
+ Scaffold a modern, production-ready Cloudinary application with React 19, Vite 6, and TypeScript 5. Features interactive setup, automatic environment configuration, and built-in AI coding assistance.
10
10
 
11
11
  - Node.js 18+ installed
12
12
  - A Cloudinary account (free tier available)
13
13
  - [Sign up for free](https://cld.media/reactregister)
14
14
  - Your cloud name is in your [dashboard](https://console.cloudinary.com/app/home/dashboard)
15
15
 
16
- ## Usage
16
+ > **Beta Release** - This is a beta version. We welcome feedback and bug reports!
17
+
18
+ Part of the [Cloudinary Developers](https://github.com/cloudinary-devs) organization.
19
+
20
+ ![Build with Cloudinary!](https://res.cloudinary.com/cloudinary-creators-community/image/upload/c_thumb,w_200,g_face/v1771434800/Tee-Mascot-Hacktoberfest-cloudicorn_x6zvtf.png)
21
+
22
+ ## šŸ“½ļø Demo
23
+
24
+ [![Watch the demo](https://res.cloudinary.com/drir0kpia/video/upload/so_1/reactstarterdemo.jpg)](https://res.cloudinary.com/drir0kpia/video/upload/v1771449633/reactstarterdemo.mp4)
25
+
26
+
27
+ ## šŸŽ¬ Features
28
+
29
+ - **šŸš€ Modern Stack**: React 19 + Vite 6 + TypeScript 5.7
30
+ - **šŸ“¦ Cloudinary SDKs**: Pre-configured `@cloudinary/react`
31
+ - **šŸ¤– AI-First**: Auto-generates configuration for Cursor, GitHub Copilot, and Claude
32
+ - **šŸ› ļø Best Practices**: ESLint 9 + TypeScript-ESLint, strict type checking
33
+ - **āš” Interactive Setup**: Validates your cloud name and configures `.env` automatically
34
+ - **šŸŽØ Typed Components**: Includes a fully typed Upload Widget component
35
+ - **šŸ”Œ MCP Support**: Built-in Model Context Protocol configuration for advanced AI integrations
36
+
37
+ ## šŸš€ Quick Start
38
+
39
+ Ensure you have Node.js 18+ installed.
17
40
 
18
41
  ```bash
19
42
  npx create-cloudinary-react
20
43
  ```
44
+ *(No installation required)*
45
+
46
+ The CLI will guide you through:
47
+ 1. **Project Name**: naming your new folder
48
+ 2. **Cloud Name**: entering your [Cloudinary cloud name](https://console.cloudinary.com/app/home/dashboard)
49
+ 3. **Upload Preset** (Optional): handling unsigned uploads
50
+ 4. **AI Assistant**: generating custom rules for your tool of choice (Cursor, VS Code, etc.)
51
+
52
+ ## šŸ› ļø What's Included
21
53
 
22
- The CLI will prompt you for:
23
- - Project name
24
- - **Cloudinary cloud name** (found in your [dashboard](https://console.cloudinary.com/app/home/dashboard))
25
- - Unsigned upload preset (optional - required for uploads, but transformations work without it)
26
- - AI coding assistant(s) you're using (Cursor, GitHub Copilot, Claude, etc.)
27
- - Whether to install dependencies
28
- - Whether to start dev server
54
+ Your new project comes with:
29
55
 
30
- ## Features
56
+ - **`src/`**: specialized for Cloudinary workflows
57
+ - **`src/components/UploadWidget.tsx`**: A ready-to-use, typed upload component
58
+ - **`.env`**: Pre-filled with your Cloud Name (and Upload Preset if provided)
59
+ - **`README.md`**: Custom instructions for your specific project
60
+ - **AI Configuration**:
61
+ - `.cursorrules` / `.cursor/mcp.json` (for Cursor)
62
+ - `.github/copilot-instructions.md` (for Copilot)
63
+ - `.claude` / `claude.md` (for Claude)
31
64
 
32
- - āœ… Interactive setup with validation
33
- - āœ… Pre-configured Cloudinary React SDK
34
- - āœ… TypeScript + Vite + React 19
35
- - āœ… Typed Upload Widget component
36
- - āœ… Environment variables with VITE_ prefix
37
- - āœ… Multi-tool AI assistant support (Cursor, GitHub Copilot, Claude, and more)
38
- - āœ… MCP configuration for Cloudinary integration
39
- - āœ… ESLint + TypeScript configured
65
+ ## šŸ¤– AI Assistant Support
40
66
 
41
- ## AI Assistant Support
67
+ We believe AI is the future of development. This starter kit doesn't just give you code; it gives your AI context.
42
68
 
43
- During setup, you'll be asked which AI coding assistant(s) you're using. The CLI will generate the appropriate configuration files:
69
+ During setup, select your AI tool to generate **Context Rules**. These rules teach your AI:
70
+ - How to construct Cloudinary transformation URLs correctly
71
+ - How to use the `@cloudinary/react` SDK components
72
+ - Common pitfalls to avoid (like mixing up import paths)
73
+ - How to handle upload widget events
44
74
 
45
- - āœ… **Cursor** ā†’ `.cursorrules` + `.cursor/mcp.json` (if selected)
46
- - āœ… **GitHub Copilot** ā†’ `.github/copilot-instructions.md`
47
- - āœ… **Claude Code** ā†’ `CLAUDE.md` + `.mcp.json` (if selected)
48
- - āœ… **Generic AI tools** ā†’ `AI_INSTRUCTIONS.md`, `PROMPT.md`
75
+ **Supported Tools:**
76
+ - āœ… **Cursor** (Rules + MCP)
77
+ - āœ… **GitHub Copilot** (Instructions)
78
+ - āœ… **Claude** (Project context + MCP)
79
+ - āœ… **Generic LLMs** (System prompts provided)
49
80
 
50
- **MCP Configuration**: Cursor and Claude Code use different config paths. If you select **Cursor**, the CLI writes `.cursor/mcp.json`. If you select **Claude**, it writes `.mcp.json` in the project root. Each tool only reads its own path, so both files are generated when you select both.
81
+ ## šŸ“‹ Prerequisites
51
82
 
52
- These rules help AI assistants understand Cloudinary React SDK patterns, common errors, and best practices. The generated app also includes an "AI Prompts" section with ready-to-use suggestions for your AI assistant.
83
+ - **Node.js 18+**
84
+ - **Cloudinary Account**: [Sign up for free](https://cloudinary.com/users/register/free) if you haven't already.
53
85
 
54
- ## Development
86
+ ## šŸ¤ Contributing
87
+
88
+ Contributions are welcome! Please feel free to submit a Pull Request.
89
+
90
+ 1. Fork the repository
91
+ 2. Create your feature branch (`git checkout -b feature/amazing-feature`)
92
+ 3. Commit your changes (`git commit -m 'feat: add some amazing feature'`)
93
+ 4. Push to the branch (`git push origin feature/amazing-feature`)
94
+ 5. Open a Pull Request
95
+
96
+ ## āš™ļø Development
55
97
 
56
98
  This project uses [Conventional Commits](https://www.conventionalcommits.org/) for version management and [semantic-release](https://github.com/semantic-release/semantic-release) for automated releases.
57
99
 
@@ -79,3 +121,6 @@ Releases are triggered manually via GitHub Actions workflow. The workflow uses n
79
121
  - `perf`: Performance improvements
80
122
  - `chore`: Other changes
81
123
 
124
+ ## šŸ“„ License
125
+
126
+ This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
package/cli.js CHANGED
@@ -69,7 +69,7 @@ async function main() {
69
69
 
70
70
  } else {
71
71
 
72
- console.log(chalk.cyan.bold('\nšŸš€ Cloudinary React + Vite\n'));
72
+ console.log(chalk.cyan.bold('\nšŸš€ Cloudinary React Starter Kit\n'));
73
73
  console.log(chalk.gray('šŸ’” Need a Cloudinary account? Sign up for free: https://cld.media/reactregister\n'));
74
74
 
75
75
  const questions = [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-cloudinary-react",
3
- "version": "1.0.0-beta.19",
3
+ "version": "1.0.0-beta.21",
4
4
  "description": "Scaffold a Cloudinary React + Vite + TypeScript project with interactive setup",
5
5
  "type": "module",
6
6
  "bin": {
package/templates/src/App.tsx.template CHANGED
@@ -60,7 +60,7 @@ function App() {
60
60
  return (
61
61
  <div className="app">
62
62
  <main className="main-content">
63
- <h1>Cloudinary React + Vite</h1>
63
+ <h1>Cloudinary React Starter Kit</h1>
64
64
  <p>This is a ready-to-use development environment with Cloudinary integration.</p>
65
65
 
66
66
  {hasUploadPreset && (