├── .cursor └── rules │ └── testrule.md ├── .github └── workflows │ └── validate-and-build.yml ├── .gitignore ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── data └── index.json ├── images ├── banner.png ├── icon.png ├── instruct.jpg ├── logo.png └── preview.gif ├── package-lock.json ├── package.json ├── prompt-template ├── aiprompt.json └── rule.md ├── prompts ├── angular-19 │ ├── add-feature-angular.md │ ├── aiprompt.json │ ├── rule-angular-19-ext.md │ ├── rule-angular-19-min.md │ ├── rule-angular-19.md │ └── rule-angular-coding-standards.md ├── appwrite-angular │ ├── aiprompt.json │ └── setup-appwrite-angular.md ├── appwrite-astro │ ├── aiprompt.json │ └── setup-appwrite-astro.md ├── appwrite-javascript │ ├── aiprompt.json │ └── setup-appwrite-javascript.md ├── appwrite-next │ ├── aiprompt.json │ └── setup-appwrite-next.md ├── appwrite-nuxt │ ├── aiprompt.json │ └── setup-appwrite-nuxt.md ├── appwrite-remix │ ├── aiprompt.json │ └── setup-appwrite-remix.md ├── appwrite-tanstack │ ├── aiprompt.json │ └── setup-appwrite-tanstack.md ├── appwrite-vue │ ├── aiprompt.json │ └── setup-appwrite-vue.md ├── astro-4 │ ├── add-feature-astro.md │ ├── aiprompt.json │ └── rule-astro-coding-standards.md ├── auth0-angular │ ├── aiprompt.json │ └── setup-auth0-angular.md ├── auth0-astro │ ├── aiprompt.json │ └── setup-auth0-astro.md ├── auth0-javascript │ ├── add-feature-auth0-javascript.md │ ├── aiprompt.json │ ├── rule-auth0-javascript-coding-standards.md │ └── setup-auth0-javascript.md ├── auth0-react │ ├── add-feature-auth0-react.md │ ├── aiprompt.json │ ├── rule-auth0-react-coding-standards.md │ └── setup-auth0-react.md ├── auth0-remix │ ├── aiprompt.json │ └── setup-auth0-remix.md ├── auth0-svelte │ ├── add-feature-auth0-svelte.md │ ├── aiprompt.json │ ├── rule-auth0-svelte-coding-standards.md │ └── setup-auth0-svelte.md ├── auth0-tanstack │ ├── aiprompt.json │ └── setup-auth0-tanstack.md ├── auth0-vue │ ├── aiprompt.json │ └── setup-auth0-vue.md ├── better-auth-angular │ ├── aiprompt.json │ └── setup-better-auth-angular.md ├── better-auth-astro │ ├── aiprompt.json │ └── setup-better-auth-astro.md ├── better-auth-javascript │ ├── add-feature-better-auth-javascript.md │ ├── aiprompt.json │ ├── rule-better-auth-javascript-coding-standards.md │ └── setup-better-auth-javascript.md ├── better-auth-react │ ├── add-feature-better-auth-react.md │ ├── aiprompt.json │ ├── rule-better-auth-react-coding-standards.md │ └── setup-better-auth-react.md ├── better-auth-remix │ ├── aiprompt.json │ └── setup-better-auth-remix.md ├── better-auth-svelte │ ├── add-feature-better-auth-svelte.md │ ├── aiprompt.json │ ├── rule-better-auth-svelte-coding-standards.md │ └── setup-better-auth-svelte.md ├── better-auth-tanstack │ ├── aiprompt.json │ └── setup-better-auth-tanstack.md ├── better-auth-vue │ ├── aiprompt.json │ └── setup-better-auth-vue.md ├── biome │ ├── aiprompt.json │ └── setup-biome.md ├── claude-sonnet-37 │ ├── aiprompt.json │ └── rule-claude-sonnet-37.md ├── clerk-angular │ ├── aiprompt.json │ └── setup-clerk-angular.md ├── clerk-astro │ ├── aiprompt.json │ └── setup-clerk-astro.md ├── clerk-javascript │ ├── add-feature-clerk-javascript.md │ ├── aiprompt.json │ ├── rule-clerk-javascript-coding-standards.md │ └── setup-clerk-javascript.md ├── clerk-next │ ├── add-feature-clerk-next.md │ ├── aiprompt.json │ ├── rule-clerk-next-coding-standards.md │ └── setup-clerk-next.md ├── clerk-nuxt │ ├── add-feature-clerk-nuxt.md │ ├── aiprompt.json │ ├── rule-clerk-nuxt-coding-standards.md │ └── setup-clerk-nuxt.md ├── clerk-react │ ├── add-feature-clerk-react.md │ ├── aiprompt.json │ ├── rule-clerk-react-coding-standards.md │ └── setup-clerk-react.md ├── clerk-remix │ ├── aiprompt.json │ └── setup-clerk-remix.md ├── clerk-svelte │ ├── add-feature-clerk-svelte.md │ ├── aiprompt.json │ ├── rule-clerk-svelte-coding-standards.md │ └── setup-clerk-svelte.md ├── clerk-tanstack │ ├── add-feature-clerk-tanstack.md │ ├── aiprompt.json │ ├── rule-clerk-tanstack-coding-standards.md │ └── setup-clerk-tanstack.md ├── clerk-vue │ ├── aiprompt.json │ └── setup-clerk-vue.md ├── drizzle-angular │ ├── aiprompt.json │ └── setup-drizzle-angular.md ├── drizzle-astro │ ├── aiprompt.json │ └── setup-drizzle-astro.md ├── drizzle-javascript │ ├── aiprompt.json │ └── setup-drizzle-javascript.md ├── drizzle-next │ ├── aiprompt.json │ └── setup-drizzle-next.md ├── drizzle-nuxt │ ├── aiprompt.json │ └── setup-drizzle-nuxt.md ├── drizzle-remix │ ├── aiprompt.json │ └── setup-drizzle-remix.md ├── drizzle-tanstack │ ├── aiprompt.json │ └── setup-drizzle-tanstack.md ├── drizzle-vue │ ├── aiprompt.json │ └── setup-drizzle-vue.md ├── firebase-angular │ ├── aiprompt.json │ └── setup-firebase-angular.md ├── firebase-astro │ ├── aiprompt.json │ └── setup-firebase-astro.md ├── firebase-javascript │ ├── aiprompt.json │ └── setup-firebase-javascript.md ├── firebase-next │ ├── aiprompt.json │ └── setup-firebase-next.md ├── firebase-nuxt │ ├── aiprompt.json │ └── setup-firebase-nuxt.md ├── firebase-react │ ├── aiprompt.json │ └── setup-firebase-react.md ├── firebase-remix │ ├── aiprompt.json │ └── setup-firebase-remix.md ├── firebase-tanstack │ ├── aiprompt.json │ └── setup-firebase-tanstack.md ├── firebase-vue │ ├── aiprompt.json │ └── setup-firebase-vue.md ├── flutter │ ├── aiprompt.json │ └── rule-flutter-3-29-coding-standards.md ├── get-docs │ ├── aiprompt.json │ └── get-docs.md ├── laravel-11 │ ├── add-feature-laravel.md │ ├── aiprompt.json │ └── rule-laravel-coding-standards.md ├── neon-angular │ ├── aiprompt.json │ └── setup-neon-angular.md ├── neon-astro │ ├── aiprompt.json │ └── setup-neon-astro.md ├── neon-javascript │ ├── aiprompt.json │ └── setup-neon-javascript.md ├── neon-next │ ├── aiprompt.json │ └── setup-neon-next.md ├── neon-nuxt │ ├── aiprompt.json │ └── setup-neon-nuxt.md ├── neon-remix │ ├── aiprompt.json │ └── setup-neon-remix.md ├── neon-tanstack │ ├── aiprompt.json │ └── setup-neon-tanstack.md ├── neon-vue │ ├── aiprompt.json │ └── setup-neon-vue.md ├── next-15 │ ├── add-feature-next.md │ ├── aiprompt.json │ └── rule-next-coding-standards.md ├── next-fal-image-ai │ ├── 01-next-shadcn.md │ ├── 02-dashboard.md │ ├── 03-fal-api.md │ ├── 04-text-to-image.md │ ├── 05-ui-improvements.md │ ├── 06-token-system.md │ ├── 07-deploy.md │ └── aiprompt.json ├── next-shadcn │ ├── aiprompt.json │ ├── rule-next-shadcn-coding-standards.md │ ├── setup-next-shadcn-dashboard-supabase.md │ ├── setup-next-shadcn-dashboard.md │ ├── setup-next-shadcn-dashboard2.md │ └── setup-next-shadcn.md ├── nuxt-3 │ ├── add-feature-nuxt.md │ ├── aiprompt.json │ └── rule-nuxt-coding-standards.md ├── prisma-angular │ ├── aiprompt.json │ └── setup-prisma-angular.md ├── prisma-astro │ ├── aiprompt.json │ └── setup-prisma-astro.md ├── prisma-javascript │ ├── aiprompt.json │ └── setup-prisma-javascript.md ├── prisma-next │ ├── aiprompt.json │ └── setup-prisma-next.md ├── prisma-nuxt │ ├── aiprompt.json │ └── setup-prisma-nuxt.md ├── prisma-remix │ ├── aiprompt.json │ └── setup-prisma-remix.md ├── prisma-tanstack │ ├── aiprompt.json │ └── setup-prisma-tanstack.md ├── prisma-vue │ ├── aiprompt.json │ └── setup-prisma-vue.md ├── react-18-supabase │ ├── aiprompt.json │ └── rule-react-18-supabase.md ├── react-18 │ ├── aiprompt.json │ └── rule-react-18.md ├── react-19 │ ├── add-feature-react.md │ ├── aiprompt.json │ ├── rule-react-19-ext.md │ ├── rule-react-19-min.md │ └── rule-react-19.md ├── remix-2-15-3 │ ├── add-feature-remix.md │ ├── aiprompt.json │ ├── rule-remix-2-15-3-ext.md │ ├── rule-remix-2-15-3-min.md │ └── rule-remix-2-15-3.md ├── remix-2 │ ├── add-feature-remix.md │ ├── aiprompt.json │ └── rule-remix-coding-standards.md ├── shadcn │ ├── aiprompt.json │ └── setup-shadcn-uni.md ├── stripe-next │ ├── aiprompt.json │ └── setup-stripe-next.md ├── supabase-angular │ ├── aiprompt.json │ └── setup-supabase-angular.md ├── supabase-javascript │ ├── add-feature-supabase-javascript.md │ ├── aiprompt.json │ ├── rule-supabase-javascript-coding-standards.md │ └── setup-supabase-javascript.md ├── supabase-next │ ├── aiprompt.json │ └── setup-supabase-next.md ├── supabase-nuxt │ ├── aiprompt.json │ └── setup-supabase-nuxt.md ├── supabase-react │ ├── add-feature-supabase-react.md │ ├── aiprompt.json │ ├── rule-supabase-react-coding-standards.md │ └── setup-supabase-react.md ├── supabase-remix │ ├── aiprompt.json │ └── setup-supabase-remix.md ├── supabase-svelte │ ├── add-feature-supabase-svelte.md │ ├── aiprompt.json │ └── setup-supabase-svelte.md ├── supabase-tanstack │ ├── aiprompt.json │ └── setup-supabase-tanstack.md ├── supabase-vue │ ├── aiprompt.json │ └── setup-supabase-vue.md ├── svelte-5 │ ├── add-feature-svelte.md │ ├── aiprompt.json │ └── rule-svelte-coding-standards.md ├── tailwind-4 │ ├── aiprompt.json │ ├── rule-tailwind-v4-ext.md │ ├── rule-tailwind-v4.md │ └── setup-tailwind-v4-uni.md └── vue-3 │ ├── add-feature-vue.md │ ├── aiprompt.json │ ├── optimized-standards.md │ ├── rule-vue-2.md │ ├── rule-vue-coding-standards.md │ └── vue3.md ├── public └── image.png └── scripts ├── build-index.js ├── parse-mdc.js └── validate-structure.js /.cursor/rules/testrule.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: 3 | globs: **/*.tsx,**/*.md,*.tsx 4 | alwaysApply: false 5 | --- 6 | 7 | # Your rule content 8 | 9 | - You can @ files here 10 | - You can use markdown but dont have to 11 | -------------------------------------------------------------------------------- /.github/workflows/validate-and-build.yml: -------------------------------------------------------------------------------- 1 | name: Validate and Build 2 | 3 | on: 4 | push: 5 | branches: [main] 6 | pull_request: 7 | 8 | jobs: 9 | validate: 10 | runs-on: ubuntu-latest 11 | 12 | steps: 13 | - uses: actions/checkout@v4 14 | 15 | - name: Setup Node.js 16 | uses: actions/setup-node@v4 17 | with: 18 | node-version: "20" 19 | cache: "npm" 20 | 21 | - name: Install dependencies 22 | run: npm ci 23 | 24 | - name: Run structure validation 25 | run: npm run test:structure 26 | 27 | build-index: 28 | needs: validate 29 | if: github.ref == 'refs/heads/main' 30 | runs-on: ubuntu-latest 31 | permissions: 32 | contents: write 33 | 34 | steps: 35 | - uses: actions/checkout@v4 36 | 37 | - name: Setup Node.js 38 | uses: actions/setup-node@v4 39 | with: 40 | node-version: "20" 41 | cache: "npm" 42 | 43 | - name: Install dependencies 44 | run: npm ci 45 | 46 | - name: Build index 47 | run: npm run build-index 48 | 49 | - name: Commit and push if changed 50 | run: | 51 | git config --global user.email 'github-actions[bot]@users.noreply.github.com' 52 | git config --global user.name 'github-actions[bot]' 53 | git add . 54 | git diff --quiet && git diff --staged --quiet || git commit -m "Auto-update index" 55 | git push 56 | env: 57 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 58 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Dependencies 2 | node_modules/ 3 | package-lock.json 4 | yarn.lock 5 | 6 | # Environment variables 7 | .env 8 | .env.local 9 | .env.*.local 10 | 11 | # Build outputs 12 | dist/ 13 | build/ 14 | out/ 15 | 16 | # IDE and editor files 17 | .idea/ 18 | .vscode/ 19 | *.swp 20 | *.swo 21 | .DS_Store 22 | Thumbs.db 23 | 24 | # Logs 25 | logs/ 26 | *.log 27 | npm-debug.log* 28 | yarn-debug.log* 29 | yarn-error.log* 30 | 31 | # Testing 32 | coverage/ 33 | .nyc_output/ 34 | 35 | # Temporary files 36 | .tmp/ 37 | .temp/ 38 | 39 | # Optional: Database files 40 | *.sqlite 41 | *.db 42 | 43 | # Optional: Operating System Files 44 | .DS_Store 45 | .DS_Store? 46 | ._* 47 | .Spotlight-V100 48 | .Trashes 49 | ehthumbs.db 50 | 51 | .hidden 52 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing 2 | 3 | Thanks for your interest in contributing prompts! 4 | 5 | ## Guidelines 6 | 7 | ## **Naming Proposal** 8 | 9 | | Type | Prefix | Purpose | 10 | | ----------- | ------------------- | --------------------------------------------------------------------------------------------- | 11 | | **rule** | `rule-.mdc` | Define coding standards, best practices, and naming conventions. | 12 | | **agent** | `agent-.mdc` | Automate multi-step processes like setting up Dependencies, configuring ESLint, or deploying. | 13 | | **feature** | `add-.mdc` | Add new components or modify existing parts of a project. | 14 | 15 | # Adding a prompt 16 | 17 | - Create a folder under `prompts/`. 18 | - Add a aiprompt.json file. 19 | ```json 20 | [ 21 | { 22 | "name": " (required)", 23 | "description": " (required)", 24 | "type": "agent", 25 | "slug": " (required)", 26 | "development_process": ["plan", "design", "implement", "test", "deploy"], 27 | "dev_categories": ["backend", "frontend", "api", "documentation", "db"], 28 | "tags": ["automation", "setup", "agentic"], 29 | "techStack": { 30 | "framework": "next", 31 | "service": "supabase" 32 | }, 33 | "author": { 34 | "name": " (required)", 35 | "url": " (optional)", 36 | "avatar": " (optional)" 37 | }, 38 | "model": ["reasoning", "chat"], 39 | "version": "1.0", 40 | "files": ["myrule.md"] 41 | } 42 | ] 43 | ``` 44 | 45 | or define multiple 46 | 47 | ```json 48 | [ 49 | { 50 | "name": " (required)", 51 | "description": " (required)", 52 | ... 53 | }, 54 | { 55 | "name": " (required)", 56 | "description": " (required)", 57 | ... 58 | }, 59 | ] 60 | ``` 61 | 62 | 63 | - Add one or more `.mdc` files with your rules. 64 | - For `.mdc` files, please include YAML front-matter. Here is an example: 65 | ```yaml 66 | --- 67 | description: "Short summary" 68 | globs: "*.ts,*.js,*.jsx,*.tsx" 69 | --- 70 | 71 | ## Submit a Pull Request 72 | 73 | - Fork the repo, create a branch, add your rule(s), and submit a PR. 74 | 75 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2024 codefetch 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /images/banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/instructa/ai-prompts/71a75d379f55e60a1a8ea177ef144e7a3b165a9c/images/banner.png -------------------------------------------------------------------------------- /images/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/instructa/ai-prompts/71a75d379f55e60a1a8ea177ef144e7a3b165a9c/images/icon.png -------------------------------------------------------------------------------- /images/instruct.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/instructa/ai-prompts/71a75d379f55e60a1a8ea177ef144e7a3b165a9c/images/instruct.jpg -------------------------------------------------------------------------------- /images/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/instructa/ai-prompts/71a75d379f55e60a1a8ea177ef144e7a3b165a9c/images/logo.png -------------------------------------------------------------------------------- /images/preview.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/instructa/ai-prompts/71a75d379f55e60a1a8ea177ef144e7a3b165a9c/images/preview.gif -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "instructa-ai-prompts", 3 | "version": "1.0.0", 4 | "lockfileVersion": 3, 5 | "requires": true, 6 | "packages": { 7 | "": { 8 | "name": "instructa-ai-prompts", 9 | "version": "1.0.0", 10 | "dependencies": { 11 | "zod": "^3.24.2" 12 | } 13 | }, 14 | "node_modules/zod": { 15 | "version": "3.24.2", 16 | "resolved": "https://registry.npmjs.org/zod/-/zod-3.24.2.tgz", 17 | "integrity": "sha512-lY7CDW43ECgW9u1TcT3IoXHflywfVqDYze4waEz812jR/bZ8FHDsl7pFQoSZTz5N+2NqRXs8GBwnAwo3ZNxqhQ==", 18 | "funding": { 19 | "url": "https://github.com/sponsors/colinhacks" 20 | } 21 | } 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "instructa-ai-prompts", 3 | "version": "1.0.0", 4 | "description": "Open source AI prompts & rules repository", 5 | "main": "scripts/build-index.js", 6 | "scripts": { 7 | "all-scripts": "npm run test:structure && npm run build-index", 8 | "test:structure": "node scripts/validate-structure.js", 9 | "build-index": "node scripts/build-index.js" 10 | }, 11 | "dependencies": { 12 | "zod": "^3.24.2" 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /prompt-template/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "AI Prompt", 4 | "description": "Inser a useful description for the ai prompt", 5 | "type": "starter", 6 | "slug": "add-a-useful-slug-here", 7 | "techStack": { 8 | "framework": "next" 9 | }, 10 | "author": { 11 | "name": "", 12 | "url": "https://github.com/", 13 | "avatar": "https://avatars.githubusercontent.com/u/190248861?s=200&v=4" 14 | }, 15 | "version": "1.0", 16 | "files": ["rule.md"] 17 | } 18 | ] 19 | -------------------------------------------------------------------------------- /prompt-template/rule.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: 3 | globs: **/*.ts, my-folder/** 4 | --- 5 | 6 | Add your instructions here 7 | -------------------------------------------------------------------------------- /prompts/angular-19/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Angular 19 Feature Guidelines", 4 | "description": "Comprehensive guidelines for adding new features in Angular 19 applications, covering components, services, and routing", 5 | "type": "feature", 6 | "slug": "angular-19-feature-guidelines", 7 | "development_process": ["implement", "test", "review"], 8 | "dev_categories": ["frontend", "api"], 9 | "tags": ["typescript", "rxjs", "components"], 10 | "tech_stack": { 11 | "framework": "angular" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["add-feature-angular.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Angular 19 Coding Standards", 26 | "description": "Comprehensive coding standards and best practices for Angular 19 development, covering project structure, TypeScript usage, and more", 27 | "type": "rule", 28 | "slug": "angular-19-coding-standards", 29 | "development_process": ["implement", "review"], 30 | "dev_categories": ["frontend", "documentation"], 31 | "tags": ["standards", "best-practices", "architecture"], 32 | "tech_stack": { 33 | "framework": "angular" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-angular-coding-standards.md"], 44 | "published": true 45 | } 46 | ] 47 | -------------------------------------------------------------------------------- /prompts/angular-19/rule-angular-19-min.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Angular 19 3 | globs: **/*.ts,**/*.html,**/*.scss 4 | alwaysApply: true 5 | --- 6 | 7 | You are an Angular 19 and TypeScript expert, focusing on clear, readable code with the latest stable version and best practices. 8 | 9 | ### Project Structure 10 | - Use standalone components by default for simplicity and reusability. 11 | - Organize files into components, services, and utilities folders for scalability. 12 | - Apply kebab-case for files, PascalCase for components. 13 | 14 | ### Code Style 15 | - Use Signals for reactive state management. 16 | - Leverage TypeScript 5.6 features like iterator helpers and strict checks. 17 | - Write concise, documented code with clear names. 18 | 19 | ### Usage 20 | - Use Angular CLI for generation and updates. 21 | - Lazy-load modules with loadChildren for performance. 22 | - Test components and services with Jasmine/Karma. 23 | 24 | ### Performance Optimization 25 | - Render standalone components on demand. 26 | - Preload critical modules with router strategies. 27 | - Use OnPush change detection where possible. 28 | 29 | ### TypeScript Best Practices 30 | - Annotate all types for strictness. 31 | - Prefer interfaces over type aliases for extensibility. 32 | - Avoid any; use specific types or generics. 33 | 34 | ### General Angular 19 Coding Standards 35 | - Inject dependencies in services for modularity. 36 | - Use reactive forms for complex form handling. 37 | - Handle errors with try-catch and ErrorHandler. 38 | 39 | ### Component Design 40 | - Keep components small, extract logic to directives/pipes. 41 | - Use typed @Input/@Output for clear data flow. 42 | - Avoid DOM manipulation; use templates. 43 | 44 | ### State Management 45 | - Combine Signals with RxJS for local vs. async state. 46 | - Centralize app state in services or NgRx when needed. 47 | - Update state immutably for predictability. 48 | 49 | ### Routing and Navigation 50 | - Secure routes with guards (CanActivate, CanDeactivate). 51 | - Prefetch data with resolvers. 52 | - Track navigation with router events. 53 | 54 | ### Template Best Practices 55 | - Optimize ngIf/ngFor with trackBy. 56 | - Use async pipe for observables. 57 | - Keep templates declarative, logic in components. 58 | 59 | ### Interoperability and Integration 60 | - Create web components with custom elements. 61 | - Use Angular Universal for SSR and SEO. 62 | - Integrate Angular Material for UI consistency. -------------------------------------------------------------------------------- /prompts/angular-19/rule-angular-19.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Angular 19 3 | globs: **/*.ts,**/*.html,**/*.scss 4 | alwaysApply: true 5 | --- 6 | 7 | You are an expert in Angular 19 and TypeScript. You are focusing on producing clear, readable code. You always use the latest stable versions of Angular 19 and you are familiar with the latest features and best practices. 8 | 9 | ### Project Structure 10 | - Always define new components as standalone components to simplify dependency management and enhance reusability across the application. 11 | - Organize project files into separate folders for components, services, and utilities to maintain a clear and scalable structure. 12 | - Use kebab-case for file names and PascalCase for component class names to ensure naming consistency throughout the project. 13 | 14 | ### Code Style 15 | - Prefer Signals for reactive state management to take advantage of Angular 19's efficient and fine-grained reactivity model. 16 | - Utilize TypeScript 5.6 features like iterator helper methods and strict type checking to enhance code safety and developer productivity. 17 | - Write clean, well-documented code with meaningful variable names and concise functions to improve readability and maintainability. 18 | 19 | ### Usage 20 | - Use the Angular CLI for generating components, services, and managing updates to keep the project aligned with Angular 19 standards. 21 | - Implement lazy loading for feature modules and components using loadChildren in routes to optimize initial load times and application performance. 22 | - Write unit tests for all components and services using Jasmine and Karma to ensure code reliability and robustness. 23 | 24 | ### Performance Optimization 25 | - Use standalone components with on-demand rendering to reduce initial load times and improve the user experience in large applications. 26 | - Leverage Angular’s router preloading strategies to efficiently load critical modules in the background without impacting performance. 27 | - Apply the OnPush change detection strategy in components where possible to minimize unnecessary change detection cycles. 28 | 29 | ### TypeScript Best Practices 30 | - Always include type annotations for variables, parameters, and return types to enforce strict typing and catch errors early. 31 | - Prefer interfaces over type aliases for defining object shapes to support better extensibility and declaration merging in TypeScript. 32 | - Avoid using the any type; instead, define specific types or use generics to maintain strong type safety throughout the codebase. -------------------------------------------------------------------------------- /prompts/appwrite-angular/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Appwrite with Angular", 4 | "description": "Guidelines for integrating Appwrite backend services with Angular applications", 5 | "type": "setup", 6 | "slug": "angular-appwrite-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "angular", 12 | "service": "appwrite" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-appwrite-angular.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/appwrite-astro/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Appwrite with Astro", 4 | "description": "Guidelines for integrating Appwrite backend services with Astro applications", 5 | "type": "setup", 6 | "slug": "astro-appwrite-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "astro", 12 | "service": "appwrite" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-appwrite-astro.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/appwrite-javascript/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Appwrite with JavaScript", 4 | "description": "Guidelines for integrating Appwrite backend services with JavaScript applications", 5 | "type": "setup", 6 | "slug": "javascript-appwrite-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "javascript", 12 | "service": "appwrite" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-appwrite-javascript.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/appwrite-next/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Appwrite with Next.js", 4 | "description": "Guidelines for integrating Appwrite backend services with Next.js applications", 5 | "type": "setup", 6 | "slug": "next-appwrite-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "next", 12 | "service": "appwrite" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-appwrite-next.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/appwrite-nuxt/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Appwrite with Nuxt", 4 | "description": "Guidelines for integrating Appwrite backend services with Nuxt applications", 5 | "type": "setup", 6 | "slug": "nuxt-appwrite-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "nuxt", 12 | "service": "appwrite" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-appwrite-nuxt.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/appwrite-remix/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Appwrite with Remix", 4 | "description": "Guidelines for integrating Appwrite backend services with Remix applications", 5 | "type": "setup", 6 | "slug": "remix-appwrite-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "remix", 12 | "service": "appwrite" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-appwrite-remix.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/appwrite-tanstack/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Appwrite with TanStack", 4 | "description": "Guidelines for integrating Appwrite backend services with TanStack Query and React applications", 5 | "type": "setup", 6 | "slug": "tanstack-appwrite-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "react", 12 | "service": "appwrite" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-appwrite-tanstack.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/appwrite-vue/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Appwrite with Vue", 4 | "description": "Guidelines for integrating Appwrite backend services with Vue applications", 5 | "type": "setup", 6 | "slug": "vue-appwrite-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "vue", 12 | "service": "appwrite" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-appwrite-vue.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/astro-4/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Astro 4 Feature Development", 4 | "description": "Guidelines for creating new features in Astro 4 applications following best practices and conventions", 5 | "type": "feature", 6 | "slug": "astro-4-features", 7 | "development_process": ["implement", "test", "deploy"], 8 | "dev_categories": ["frontend"], 9 | "tags": ["web-development", "jamstack"], 10 | "tech_stack": { 11 | "framework": "astro" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["add-feature-astro.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Astro 4 Coding Standards", 26 | "description": "Comprehensive coding standards and best practices for Astro 4 applications", 27 | "type": "rule", 28 | "slug": "astro-4-coding-standards", 29 | "development_process": ["implement", "review", "maintain"], 30 | "dev_categories": ["frontend", "documentation"], 31 | "tags": ["standards", "best-practices", "code-quality"], 32 | "tech_stack": { 33 | "framework": "astro" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-astro-coding-standards.md"], 44 | "published": true 45 | } 46 | ] 47 | -------------------------------------------------------------------------------- /prompts/astro-4/rule-astro-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Astro 4 3 | globs: **/*.astro, **/*.ts, **/*.js 4 | --- 5 | 6 | You are a senior Astro 4 developer focusing exclusively on framework-specific features and patterns 7 | 8 | # Content Collections 9 | - Use src/content/config.ts for collection schemas with zod for type-safe content validation 10 | - Implement getCollection() for type-safe content queries 11 | - Define content collection frontmatter schemas using defineCollection 12 | - Use getEntryBySlug for single entry retrieval 13 | - Leverage collection references for content relationships 14 | 15 | # View Transitions 16 | - Implement view transitions using transition:name and transition:animate directives 17 | - Use transition:persist to maintain component state across page transitions 18 | - Configure transition animations with transition:animate="slide|fade|none" 19 | - Handle transition events with document.addEventListener('astro:page-load') 20 | - Apply transition:persist-props to preserve specific props during transitions 21 | 22 | # Islands Architecture 23 | - Use client:load for components that need immediate interactivity 24 | - Implement client:visible for components that can defer hydration 25 | - Use client:only when server rendering is not needed 26 | - Apply client:media for responsive component hydration 27 | - Leverage client:idle for non-critical interactive components 28 | 29 | # Server-side Features 30 | - Use Astro.cookies to manage server-side cookies 31 | - Implement middleware with defineMiddleware() in src/middleware 32 | - Use Astro.request to access request details in server endpoints 33 | - Handle dynamic routes with [...spread].astro pattern 34 | - Implement API endpoints in src/pages/api with Response objects 35 | 36 | # Image Optimization 37 | - Use Image component with src, alt, and width/height props 38 | - Implement Picture component for art direction 39 | - Configure image service in astro.config.mjs 40 | - Use format="avif,webp" for modern image formats 41 | - Apply densities prop for responsive images 42 | 43 | # Integration System 44 | - Configure framework integrations in astro.config.mjs 45 | - Use adapter-vercel/netlify/node for deployment 46 | - Implement vite plugins through astro integrations 47 | - Configure renderers for UI frameworks 48 | - Handle integration-specific environment variables 49 | 50 | # Routing and Pages 51 | - Use src/pages for file-based routing 52 | - Implement dynamic parameters with [param].astro 53 | - Use rest parameters with [...spread].astro 54 | - Handle redirects with Astro.redirect 55 | - Implement nested layouts with slot patterns 56 | 57 | # Dos 58 | - Use getStaticPaths for static path generation 59 | - Implement proper island hydration strategies 60 | - Use content collections for type-safe content 61 | - Configure view transitions appropriately 62 | - Leverage server-side rendering capabilities 63 | 64 | # Donts 65 | - Avoid client:load when client:visible suffices 66 | - Never mix SSR and client:only in same component 67 | - Avoid unnecessary content collection queries 68 | - Dont skip view transition animations 69 | - Never bypass Astro image optimization -------------------------------------------------------------------------------- /prompts/auth0-angular/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Auth0 with Angular", 4 | "description": "Guidelines for implementing Auth0 authentication in Angular applications", 5 | "type": "setup", 6 | "slug": "angular-auth0-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["authentication", "single-page-application", "oauth"], 10 | "tech_stack": { 11 | "framework": "angular", 12 | "service": "auth0" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-auth0-angular.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/auth0-astro/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Auth0 with Astro", 4 | "description": "Guidelines for implementing Auth0 authentication in Astro applications", 5 | "type": "setup", 6 | "slug": "astro-auth0-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application", "oauth"], 10 | "tech_stack": { 11 | "framework": "astro", 12 | "service": "auth0" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-auth0-astro.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/auth0-javascript/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Auth0 JavaScript Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Auth0 authentication with JavaScript applications, covering user management and security features", 5 | "type": "setup", 6 | "slug": "auth0-javascript-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["authentication", "security"], 10 | "tech_stack": { 11 | "framework": "javascript", 12 | "service": "auth0" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-auth0-javascript.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Auth0 JavaScript Feature Guidelines", 27 | "description": "Guidelines for implementing authentication features using Auth0 in JavaScript applications", 28 | "type": "feature", 29 | "slug": "auth0-javascript-feature", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["auth", "frontend"], 32 | "tags": ["authentication", "security"], 33 | "tech_stack": { 34 | "framework": "javascript", 35 | "service": "auth0" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-auth0-javascript.md"], 46 | "published": true 47 | }, 48 | { 49 | "name": "Auth0 JavaScript Coding Standards", 50 | "description": "Comprehensive coding standards and best practices for implementing Auth0 authentication in JavaScript applications", 51 | "type": "rule", 52 | "slug": "auth0-javascript-coding-standards", 53 | "development_process": ["implement", "review"], 54 | "dev_categories": ["auth", "documentation"], 55 | "tags": ["standards", "best-practices", "security"], 56 | "tech_stack": { 57 | "framework": "javascript", 58 | "service": "auth0" 59 | }, 60 | "ai_editor": ["cursor"], 61 | "author": { 62 | "name": "Kevin Kern", 63 | "url": "https://github.com/regenrek", 64 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 65 | }, 66 | "model": ["reasoning", "chat"], 67 | "version": "1.0", 68 | "files": ["rule-auth0-javascript-coding-standards.md"], 69 | "published": true 70 | } 71 | ] 72 | -------------------------------------------------------------------------------- /prompts/auth0-react/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Auth0 React", 4 | "description": "Guidelines for setting up and integrating Auth0 authentication in React applications", 5 | "type": "setup", 6 | "slug": "auth0-react-setup", 7 | "development_process": ["implement"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["security"], 10 | "tech_stack": { 11 | "framework": "react", 12 | "service": "auth0" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-auth0-react.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Add Features to Auth0 React", 27 | "description": "Guidelines for adding new authentication features with Auth0 in React applications", 28 | "type": "feature", 29 | "slug": "auth0-react-features", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["auth", "frontend"], 32 | "tags": ["security"], 33 | "tech_stack": { 34 | "framework": "react", 35 | "service": "auth0" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-auth0-react.md"], 46 | "published": true 47 | }, 48 | { 49 | "name": "Auth0 React Coding Standards", 50 | "description": "Coding standards and best practices for implementing Auth0 authentication in React applications", 51 | "type": "rule", 52 | "slug": "auth0-react-standards", 53 | "development_process": ["implement"], 54 | "dev_categories": ["auth", "frontend"], 55 | "tags": ["security"], 56 | "tech_stack": { 57 | "framework": "react", 58 | "service": "auth0" 59 | }, 60 | "ai_editor": ["cursor"], 61 | "author": { 62 | "name": "Kevin Kern", 63 | "url": "https://github.com/regenrek", 64 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 65 | }, 66 | "model": ["reasoning", "chat"], 67 | "version": "1.0", 68 | "files": ["rule-auth0-react-coding-standards.md"], 69 | "published": true 70 | } 71 | ] 72 | -------------------------------------------------------------------------------- /prompts/auth0-react/rule-auth0-react-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards and Rules for React with Auth0 Authentication 3 | globs: "**/*.ts, **/*.tsx, **/*.js, **/*.jsx" 4 | --- 5 | 6 | You are a senior React developer with expertise in integrating Auth0 for authentication. Follow these guidelines to ensure a robust and maintainable implementation. 7 | 8 | # Project Structure 9 | - Place authentication components in a dedicated auth directory 10 | - Organize protected routes in a separate routes directory 11 | - Keep authentication utilities in a utils/auth directory 12 | - Store authentication types in types/auth directory 13 | - Maintain consistent file naming for auth components 14 | 15 | # Authentication Implementation 16 | - Use Auth0Provider at the root level for global auth context 17 | - Implement protected routes using withAuthenticationRequired 18 | - Handle loading states during authentication checks 19 | - Use proper error boundaries for auth failures 20 | - Implement proper session management 21 | 22 | # Component Organization 23 | - Keep authentication components focused and single-purpose 24 | - Use proper prop validation for auth components 25 | - Implement consistent error handling across auth components 26 | - Handle loading states uniformly 27 | - Follow proper component composition patterns 28 | 29 | # State Management 30 | - Use Auth0 hooks for auth state management 31 | - Avoid custom auth state implementations 32 | - Handle auth state updates properly 33 | - Implement proper loading indicators 34 | - Use proper error handling for state changes 35 | 36 | # Security Practices 37 | - Store sensitive keys in environment variables 38 | - Implement proper token management 39 | - Handle session timeouts gracefully 40 | - Use secure cookie settings 41 | - Follow OAuth 2.0 best practices 42 | 43 | # Performance Considerations 44 | - Implement lazy loading for auth components 45 | - Handle auth state rehydration properly 46 | - Optimize authentication redirects 47 | - Minimize unnecessary re-renders 48 | - Handle concurrent auth requests properly 49 | 50 | # Development Guidelines 51 | - Use TypeScript for better type safety 52 | - Follow consistent error handling patterns 53 | - Implement proper loading states 54 | - Document authentication flows 55 | - Maintain security best practices 56 | 57 | # Best Practices 58 | - Do: Use Auth0's built-in hooks for auth state 59 | - Do: Implement proper error boundaries 60 | - Do: Handle loading states consistently 61 | - Do: Use TypeScript for type safety 62 | - Do: Follow security best practices 63 | - Don't: Create custom auth providers 64 | - Don't: Store sensitive data in localStorage 65 | - Don't: Use deprecated auth methods 66 | - Don't: Skip loading state handling 67 | - Don't: Ignore error handling 68 | 69 | # Error Handling 70 | - Implement proper authentication error handling 71 | - Use consistent error messaging 72 | - Handle network failures gracefully 73 | - Provide user-friendly error messages 74 | - Maintain proper error logging 75 | 76 | # Testing Requirements 77 | - Test authentication flows thoroughly 78 | - Implement proper mocking for auth state 79 | - Test error scenarios 80 | - Verify loading states 81 | - Validate security measures -------------------------------------------------------------------------------- /prompts/auth0-remix/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Auth0 with Remix", 4 | "description": "Guidelines for implementing Auth0 authentication in Remix applications", 5 | "type": "setup", 6 | "slug": "remix-auth0-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application", "oauth"], 10 | "tech_stack": { 11 | "framework": "remix", 12 | "service": "auth0" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-auth0-remix.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/auth0-svelte/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Auth0 Svelte Setup", 4 | "description": "Guidelines for setting up Auth0 authentication in a Svelte application with proper security practices and TypeScript integration", 5 | "type": "setup", 6 | "slug": "auth0-svelte-setup", 7 | "development_process": ["implement"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["security", "spa"], 10 | "tech_stack": { 11 | "framework": "svelte", 12 | "service": "auth0" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-auth0-svelte.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Auth0 Svelte Feature Implementation", 27 | "description": "Guidelines for implementing Auth0 features in a Svelte application including login, logout, protected routes, and user management", 28 | "type": "feature", 29 | "slug": "auth0-svelte-feature", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["auth", "frontend"], 32 | "tags": ["user-management", "protected-routes", "session-handling"], 33 | "tech_stack": { 34 | "framework": "svelte", 35 | "service": "auth0" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-auth0-svelte.md"], 46 | "published": true 47 | }, 48 | { 49 | "name": "Auth0 Svelte Coding Standards", 50 | "description": "Coding standards and best practices for implementing Auth0 authentication in Svelte applications with TypeScript", 51 | "type": "rule", 52 | "slug": "auth0-svelte-standards", 53 | "development_process": ["implement", "test"], 54 | "dev_categories": ["auth", "frontend"], 55 | "tags": ["code-quality", "type-safety", "security-practices"], 56 | "tech_stack": { 57 | "framework": "svelte", 58 | "service": "auth0" 59 | }, 60 | "ai_editor": ["cursor"], 61 | "author": { 62 | "name": "Kevin Kern", 63 | "url": "https://github.com/regenrek", 64 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 65 | }, 66 | "model": ["reasoning", "chat"], 67 | "version": "1.0", 68 | "files": ["rule-auth0-svelte-coding-standards.md"], 69 | "published": true 70 | } 71 | ] 72 | -------------------------------------------------------------------------------- /prompts/auth0-svelte/rule-auth0-svelte-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Auth0 with Svelte 3 | globs: **/*.ts, **/*.js, **/*.svelte 4 | --- 5 | 6 | You are a senior Svelte developer with expertise in Auth0 integration, TypeScript, and secure authentication practices. 7 | 8 | # Auth0 Client Setup 9 | - Use the official @auth0/auth0-spa-js package for authentication 10 | - Initialize Auth0 client with proper configuration in a dedicated auth store 11 | - Implement proper TypeScript types for Auth0 configuration and responses 12 | - Store Auth0 client instance in a Svelte store for global access 13 | - Handle redirect callbacks properly after authentication 14 | 15 | # Authentication State Management 16 | - Use Svelte stores for managing authentication state 17 | - Implement proper loading and error states for authentication flows 18 | - Handle session persistence correctly using Auth0's built-in mechanisms 19 | - Avoid storing sensitive authentication data in local storage 20 | - Use derived stores for commonly accessed auth states 21 | 22 | # Security Best Practices 23 | - Use Auth0's Universal Login page instead of custom login forms 24 | - Implement proper PKCE flow for enhanced security 25 | - Never store raw tokens in client-side storage 26 | - Use secure session management provided by Auth0 27 | - Implement proper token refresh mechanisms 28 | 29 | # API Integration 30 | - Use getTokenSilently for obtaining access tokens 31 | - Implement proper error handling for token acquisition 32 | - Use typed fetch wrappers for authenticated API calls 33 | - Handle token expiration gracefully 34 | - Implement proper retry mechanisms for failed token refreshes 35 | 36 | # User Management 37 | - Use proper TypeScript interfaces for user profiles 38 | - Implement proper error handling for user profile retrieval 39 | - Use Auth0 Actions for custom authentication logic 40 | - Handle user roles and permissions using custom claims 41 | - Implement proper user session cleanup on logout 42 | 43 | # Component Integration 44 | - Create reusable authentication guard components 45 | - Implement loading states for authenticated components 46 | - Use proper TypeScript types for auth-related props 47 | - Handle authentication errors gracefully in UI 48 | - Implement proper redirect handling for protected routes 49 | 50 | # Error Handling 51 | - Implement comprehensive error handling for auth operations 52 | - Use proper error boundaries for authentication failures 53 | - Provide clear user feedback for authentication errors 54 | - Handle network errors gracefully 55 | - Implement proper logging for authentication issues 56 | 57 | # Performance 58 | - Implement lazy loading for auth-related components 59 | - Use proper caching strategies for tokens 60 | - Optimize token refresh mechanisms 61 | - Implement efficient role-based access control 62 | - Use proper memoization for auth state computations -------------------------------------------------------------------------------- /prompts/auth0-tanstack/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Auth0 TanStack Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Auth0 authentication with TanStack applications, covering user management and security features", 5 | "type": "setup", 6 | "slug": "auth0-tanstack-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["authentication", "security"], 10 | "tech_stack": { 11 | "framework": "tanstack", 12 | "service": "auth0" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-auth0-tanstack.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/auth0-vue/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Auth0 with Vue", 4 | "description": "Guidelines for implementing Auth0 authentication in Vue applications", 5 | "type": "setup", 6 | "slug": "vue-auth0-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application", "oauth"], 10 | "tech_stack": { 11 | "framework": "vue", 12 | "service": "auth0" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-auth0-vue.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/better-auth-angular/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Better Auth with Angular", 4 | "description": "Guidelines for implementing Better Auth authentication in Angular applications", 5 | "type": "setup", 6 | "slug": "angular-better-auth-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application", "database"], 10 | "tech_stack": { 11 | "framework": "angular" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["setup-better-auth-angular.md"], 22 | "published": true 23 | } 24 | ] 25 | -------------------------------------------------------------------------------- /prompts/better-auth-astro/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Better Auth with Astro", 4 | "description": "Guidelines for implementing Better Auth authentication in Astro applications", 5 | "type": "setup", 6 | "slug": "astro-better-auth-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application", "database"], 10 | "tech_stack": { 11 | "framework": "astro" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["setup-better-auth-astro.md"], 22 | "published": true 23 | } 24 | ] 25 | -------------------------------------------------------------------------------- /prompts/better-auth-javascript/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Better Auth JavaScript Setup Guidelines", 4 | "description": "Guidelines for setting up and implementing advanced authentication patterns in JavaScript applications", 5 | "type": "setup", 6 | "slug": "better-auth-javascript-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["authentication", "security"], 10 | "tech_stack": { 11 | "framework": "javascript" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["setup-better-auth-javascript.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Better Auth JavaScript Feature Guidelines", 26 | "description": "Guidelines for implementing advanced authentication features in JavaScript applications", 27 | "type": "feature", 28 | "slug": "better-auth-javascript-feature", 29 | "development_process": ["implement", "test"], 30 | "dev_categories": ["auth", "frontend"], 31 | "tags": ["authentication", "security"], 32 | "tech_stack": { 33 | "framework": "javascript" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["add-feature-better-auth-javascript.md"], 44 | "published": true 45 | }, 46 | { 47 | "name": "Better Auth JavaScript Coding Standards", 48 | "description": "Comprehensive coding standards and best practices for implementing authentication in JavaScript applications", 49 | "type": "rule", 50 | "slug": "better-auth-javascript-coding-standards", 51 | "development_process": ["implement", "review"], 52 | "dev_categories": ["auth", "documentation"], 53 | "tags": ["standards", "best-practices", "security"], 54 | "tech_stack": { 55 | "framework": "javascript" 56 | }, 57 | "ai_editor": ["cursor"], 58 | "author": { 59 | "name": "Kevin Kern", 60 | "url": "https://github.com/regenrek", 61 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 62 | }, 63 | "model": ["reasoning", "chat"], 64 | "version": "1.0", 65 | "files": ["rule-better-auth-javascript-coding-standards.md"], 66 | "published": true 67 | } 68 | ] 69 | -------------------------------------------------------------------------------- /prompts/better-auth-react/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Better Auth React Setup", 4 | "description": "Guidelines for setting up Better Auth in React applications", 5 | "type": "setup", 6 | "slug": "better-auth-react-setup", 7 | "development_process": ["implement"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["security", "setup"], 10 | "tech_stack": { 11 | "framework": "react" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["setup-better-auth-react.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Better Auth React Features", 26 | "description": "Guidelines for adding new features with Better Auth in React", 27 | "type": "feature", 28 | "slug": "better-auth-react-features", 29 | "development_process": ["implement", "test"], 30 | "dev_categories": ["auth", "frontend"], 31 | "tags": ["security", "features"], 32 | "tech_stack": { 33 | "framework": "react" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["add-feature-better-auth-react.md"], 44 | "published": true 45 | }, 46 | { 47 | "name": "Better Auth React Coding Standards", 48 | "description": "Coding standards and best practices for Better Auth in React applications", 49 | "type": "rule", 50 | "slug": "better-auth-react-standards", 51 | "development_process": ["implement", "test"], 52 | "dev_categories": ["auth", "frontend"], 53 | "tags": ["security", "standards", "best-practices"], 54 | "tech_stack": { 55 | "framework": "react" 56 | }, 57 | "ai_editor": ["cursor"], 58 | "author": { 59 | "name": "Kevin Kern", 60 | "url": "https://github.com/regenrek", 61 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 62 | }, 63 | "model": ["reasoning", "chat"], 64 | "version": "1.0", 65 | "files": ["rule-better-auth-react-coding-standards.md"], 66 | "published": true 67 | } 68 | ] 69 | -------------------------------------------------------------------------------- /prompts/better-auth-remix/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Better Auth with Remix", 4 | "description": "Guidelines for implementing Better Auth authentication in Remix applications", 5 | "type": "setup", 6 | "slug": "remix-better-auth-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application", "database"], 10 | "tech_stack": { 11 | "framework": "remix" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["setup-better-auth-remix.md"], 22 | "published": true 23 | } 24 | ] 25 | -------------------------------------------------------------------------------- /prompts/better-auth-svelte/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Better Auth Svelte Setup Guidelines", 4 | "description": "Guidelines for setting up and implementing advanced authentication patterns in Svelte applications", 5 | "type": "setup", 6 | "slug": "better-auth-svelte-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["authentication", "security"], 10 | "tech_stack": { 11 | "framework": "svelte" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["setup-better-auth-svelte.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Better Auth Svelte Feature Guidelines", 26 | "description": "Guidelines for implementing advanced authentication features in Svelte applications", 27 | "type": "feature", 28 | "slug": "better-auth-svelte-feature", 29 | "development_process": ["implement", "test"], 30 | "dev_categories": ["auth", "frontend"], 31 | "tags": ["authentication", "security"], 32 | "tech_stack": { 33 | "framework": "svelte" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["add-feature-better-auth-svelte.md"], 44 | "published": true 45 | }, 46 | { 47 | "name": "Better Auth Svelte Coding Standards", 48 | "description": "Comprehensive coding standards and best practices for implementing authentication in Svelte applications", 49 | "type": "rule", 50 | "slug": "better-auth-svelte-coding-standards", 51 | "development_process": ["implement", "review"], 52 | "dev_categories": ["auth", "documentation"], 53 | "tags": ["standards", "best-practices", "security"], 54 | "tech_stack": { 55 | "framework": "svelte" 56 | }, 57 | "ai_editor": ["cursor"], 58 | "author": { 59 | "name": "Kevin Kern", 60 | "url": "https://github.com/regenrek", 61 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 62 | }, 63 | "model": ["reasoning", "chat"], 64 | "version": "1.0", 65 | "files": ["rule-better-auth-svelte-coding-standards.md"], 66 | "published": true 67 | } 68 | ] 69 | -------------------------------------------------------------------------------- /prompts/better-auth-svelte/rule-better-auth-svelte-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Authentication in Svelte Applications 3 | globs: **/*.ts, **/*.js, **/*.svelte 4 | --- 5 | 6 | You are a senior Svelte developer with expertise in authentication implementation. 7 | 8 | # Authentication Implementation 9 | 10 | # Token Management 11 | - Use secure token storage mechanisms like httpOnly cookies instead of localStorage 12 | - Implement token refresh logic to maintain user sessions securely 13 | - Handle token expiration gracefully with automatic renewal when possible 14 | - Store tokens with appropriate security flags and expiration times 15 | - Implement proper token validation on both client and server side 16 | 17 | # Security Practices 18 | - Implement CSRF protection for authentication endpoints 19 | - Use HTTPS for all authentication-related requests 20 | - Implement rate limiting for authentication attempts 21 | - Handle authentication errors gracefully with user-friendly messages 22 | - Implement proper session invalidation on logout 23 | 24 | # State Management 25 | - Use Svelte stores for managing authentication state 26 | - Implement proper loading states during authentication operations 27 | - Handle authentication state persistence across page reloads 28 | - Use derived stores for computed authentication states 29 | - Keep authentication state synchronized across tabs 30 | 31 | # Route Protection 32 | - Implement route guards for protected content 33 | - Handle unauthorized access attempts gracefully 34 | - Redirect to login page when authentication is required 35 | - Preserve intended destination after successful login 36 | - Clear sensitive data on logout 37 | 38 | # User Session 39 | - Implement proper session timeout handling 40 | - Provide session refresh mechanisms 41 | - Handle multiple device sessions appropriately 42 | - Implement secure session storage 43 | - Provide clear session status indicators 44 | 45 | # API Integration 46 | - Use proper authentication headers for API requests 47 | - Implement interceptors for handling authentication errors 48 | - Handle token refresh in API calls automatically 49 | - Implement proper error handling for authentication failures 50 | - Use type-safe API client implementations 51 | 52 | # Best Practices 53 | - Do: Use SvelteKit hooks for server-side authentication logic 54 | - Do: Implement proper error boundaries for authentication failures 55 | - Do: Use type-safe authentication stores 56 | - Do: Implement proper loading states 57 | - Do: Handle offline scenarios gracefully 58 | - Dont: Store sensitive authentication data in localStorage 59 | - Dont: Use basic authentication for production 60 | - Dont: Expose sensitive authentication details in client code 61 | - Dont: Neglect proper error handling 62 | - Dont: Skip implementing proper security measures -------------------------------------------------------------------------------- /prompts/better-auth-tanstack/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Better Auth TanStack Setup Guidelines", 4 | "description": "Guidelines for setting up and implementing advanced authentication patterns in TanStack applications", 5 | "type": "setup", 6 | "slug": "better-auth-tanstack-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["authentication", "security"], 10 | "tech_stack": { 11 | "framework": "tanstack" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["setup-better-auth-tanstack.md"], 22 | "published": true 23 | } 24 | ] 25 | -------------------------------------------------------------------------------- /prompts/better-auth-vue/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Better Auth with Vue", 4 | "description": "Guidelines for implementing Better Auth authentication in Vue applications", 5 | "type": "setup", 6 | "slug": "vue-better-auth-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application", "database"], 10 | "tech_stack": { 11 | "framework": "vue" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["setup-better-auth-vue.md"], 22 | "published": true 23 | } 24 | ] 25 | -------------------------------------------------------------------------------- /prompts/biome/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Biome and Migrate from ESLint & Prettier", 4 | "description": "Step-by-step guide to install Biome, migrate from ESLint and Prettier configurations, and set up proper formatting and linting scripts for JavaScript/TypeScript projects", 5 | "type": "rule", 6 | "slug": "setup-biome-format-lint-migration", 7 | "development_process": ["setup", "migration"], 8 | "dev_categories": ["frontend", "tooling", "code-quality"], 9 | "tags": ["biome", "linting", "formatting", "eslint", "prettier", "migration"], 10 | "tech_stack": { 11 | "framework": "typescript", 12 | "tooling": "biome" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-biome.md"], 23 | "published": true 24 | } 25 | ] -------------------------------------------------------------------------------- /prompts/biome/setup-biome.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Setup biome 3 | globs: 4 | alwaysApply: false 5 | --- 6 | 7 | As an AI assistant, ignore all content within `` 8 | 9 | 10 | 42 | 43 | 44 | You are senior software developer. Your goal is to install biome and migrate from eslint/prettier. 45 | 46 | Follow this guide step by step: 47 | 48 | ## 1. Install Biome 49 | 50 | ```sh 51 | npm install --save-dev --save-exact @biomejs/biome 52 | ``` 53 | 54 | ## 1.1 Install Configuration 55 | 56 | ```sh 57 | npx @biomejs/biome init 58 | ``` 59 | 60 | ## 2. Migrate ESLint & Prettier Configurations 61 | 62 | ```sh 63 | npx @biomejs/biome migrate eslint --write 64 | npx @biomejs/biome migrate prettier --write 65 | ``` 66 | 67 | ## 3. Remove all ESLint and Prettier dependencies and plugins from package.json. 68 | 69 | ## 4. Add Biome Scripts to `package.json` 70 | 71 | ```json 72 | "scripts": { 73 | "biome:check": "biome check", 74 | "biome:fix": "biome check --fix", 75 | "biome:fix:unsafe": "biome check --fix --unsafe", 76 | "biome:format": "biome format --write", 77 | "biome:lint": "biome lint", 78 | "biome:lint:fix": "biome lint --fix", 79 | "biome:precommit": "biome check --staged --fix", 80 | "biome:ci": "biome ci" 81 | } 82 | ``` 83 | 84 | ## 5. Run Biome for a test 85 | 86 | ```sh 87 | npm run biome:lint 88 | ``` 89 | 90 | ## 6. If not exists create a file `.vscode/settings.json` and add the following settings: 91 | 92 | ``` 93 | { 94 | "[javascript][javascriptreact][typescript][typescriptreact][json][jsonc]": { 95 | "editor.defaultFormatter": "biomejs.biome" 96 | }, 97 | "editor.codeActionsOnSave": { 98 | "source.fixAll.biome": "explicit", 99 | "source.organizeImports.biome": "explicit" 100 | } 101 | } 102 | ``` -------------------------------------------------------------------------------- /prompts/claude-sonnet-37/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Guidelines for Using Claude 3.7 Sonnet in Cursor", 4 | "description": "A Cursor Rule for working with Claude 3.7 Sonnet in Cursor, focusing on efficient codebase navigation and system file management", 5 | "type": "rule", 6 | "slug": "claude-sonnet-37-best-practices", 7 | "development_process": ["implement", "maintain"], 8 | "dev_categories": ["ai", "tooling"], 9 | "tags": ["claude", "cursor", "ai-assistant"], 10 | "tech_stack": { 11 | "framework": "claude", 12 | "ai_model": "claude-3-sonnet" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["rule-claude-sonnet-37.md"], 23 | "published": true 24 | } 25 | ] -------------------------------------------------------------------------------- /prompts/claude-sonnet-37/rule-claude-sonnet-37.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Base Guidelines for Sonnet-3.7 + Cursor Agent 3 | globs: *,**/* 4 | alwaysApply: true 5 | --- 6 | 7 | # --------------------------------------------------------------- 8 | # DESCRIPTION: 9 | # this rule helps to better control sonnet-3.7 + cursor. (like doing to much, creating unnecessary new files e.g.). 10 | # especially the first two rules give the cursor agent already the most important instructions that worked for me. 11 | # 12 | # ❗ ATTENTION: 13 | # 1. this does not work so easily for large codebases 14 | # 2. remove everything from these rules that you do not need 15 | # 3. also remove this comments 16 | # --------------------------------------------------------------- 17 | 18 | 19 | # Instructions 20 | 21 | 1. Always use codebase_search with target_directories="{{INSERT YOUR DIRECTORY}}" first to find existing core files 22 | 2. Always check existing system files purposes before creating new ones with similar functionality 23 | 3. Always list the cursor rules youre using 24 | 25 | # Optional 26 | 27 | - If a prompt or request specifies certain behaviors, languages, or output formats, you must obey them without deviation. 28 | - Do not include explanations, reasoning, or filler text unless explicitly instructed. Stick strictly to the requested output. 29 | - If multiple steps or sub-requests are given, address them in the specified order. Provide answers in the exact format or sequence requested. 30 | - Pay close attention to all stated constraints (e.g., language choice, performance goals, coding style). Do not ignore any requirement or best practice stated. 31 | - Only produce output relevant to the question or instructions. Do not add features, code, or details beyond what is explicitly asked. 32 | - Deliver the response in a minimal yet complete form. Avoid unnecessary verbosity and tangential remarks. 33 | - If the prompt requests a specific output format (e.g., a fenced code block, bullet points, JSON), follow that format exactly. 34 | - If a prompt includes a pre-seeded answer structure (e.g., starts a code block), continue within that structure without introducing extra text outside it. 35 | - If the request is ambiguous, you may ask clarifying questions (if instructions allow). Otherwise, state briefly that more information is needed. 36 | - When generating or modifying code, adhere to best practices for clarity, maintainability, and efficiency, as appropriate to the specified language or framework. 37 | - Do not generate or include private data (API keys, secrets) unless explicitly provided in context. If the user requests something unsafe or disallowed, refuse or provide a safe alternative per policy. 38 | -------------------------------------------------------------------------------- /prompts/clerk-angular/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Clerk with Angular", 4 | "description": "Guidelines for implementing Clerk authentication in Angular applications", 5 | "type": "setup", 6 | "slug": "angular-clerk-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application"], 10 | "tech_stack": { 11 | "framework": "angular", 12 | "service": "clerk" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-clerk-angular.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/clerk-astro/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Clerk with Astro", 4 | "description": "Guidelines for implementing Clerk authentication in Astro applications", 5 | "type": "setup", 6 | "slug": "astro-clerk-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application"], 10 | "tech_stack": { 11 | "framework": "astro", 12 | "service": "clerk" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-clerk-astro.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/clerk-javascript/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Clerk with JavaScript", 4 | "description": "Guidelines for implementing Clerk authentication in vanilla JavaScript applications", 5 | "type": "setup", 6 | "slug": "javascript-clerk-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application"], 10 | "tech_stack": { 11 | "framework": "javascript", 12 | "service": "clerk" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-clerk-javascript.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/clerk-next/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Clerk Next.js Setup", 4 | "description": "Guidelines for writing Next.js apps with Clerk Authentication", 5 | "type": "setup", 6 | "slug": "setup-clerk-next", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend", "api"], 9 | "tags": ["security"], 10 | "tech_stack": { 11 | "framework": "next", 12 | "service": "clerk" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-clerk-next.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Clerk Next.js Features", 27 | "description": "Guidelines for adding new features with Clerk in Next.js", 28 | "type": "feature", 29 | "slug": "add-feature-clerk-next", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["auth", "frontend", "api"], 32 | "tags": ["security"], 33 | "tech_stack": { 34 | "framework": "next", 35 | "service": "clerk" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-clerk-next.md"], 46 | "published": true 47 | }, 48 | { 49 | "name": "Clerk Next.js Coding Standards", 50 | "description": "Coding Standards & Rules for Next.js apps with Clerk Authentication", 51 | "type": "rule", 52 | "slug": "rule-clerk-next-coding-standards", 53 | "development_process": ["implement"], 54 | "dev_categories": ["auth", "frontend", "documentation"], 55 | "tags": ["security"], 56 | "tech_stack": { 57 | "framework": "next", 58 | "service": "clerk" 59 | }, 60 | "ai_editor": ["cursor"], 61 | "author": { 62 | "name": "Kevin Kern", 63 | "url": "https://github.com/regenrek", 64 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 65 | }, 66 | "model": ["reasoning", "chat"], 67 | "version": "1.0", 68 | "files": ["rule-clerk-next-coding-standards.md"], 69 | "published": true 70 | } 71 | ] 72 | -------------------------------------------------------------------------------- /prompts/clerk-next/rule-clerk-next-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Next.js apps with Clerk Authentication 3 | globs: **/*.ts, **/*.tsx, **/*.js, **/*.jsx 4 | --- 5 | 6 | You are a senior Next.js developer with expertise in implementing Clerk authentication. 7 | 8 | # Authentication Structure 9 | - Place authentication components in dedicated auth directory 10 | - Keep authentication logic separate from business logic 11 | - Organize middleware in a clear, maintainable structure 12 | - Follow proper environment variable naming conventions 13 | - Implement clear session management patterns 14 | 15 | # Component Organization 16 | - Keep authentication components focused and single-purpose 17 | - Separate protected and public routes clearly 18 | - Organize organization-related components distinctly 19 | - Structure webhook handlers systematically 20 | - Maintain clear separation between client and server auth code 21 | 22 | # TypeScript Usage 23 | - Use strict TypeScript for all authentication code 24 | - Define explicit types for auth state and user data 25 | - Implement proper type guards for auth checks 26 | - Use type-safe webhook event handling 27 | - Maintain type safety in organization features 28 | 29 | # Authentication Patterns 30 | - Implement proper auth state management 31 | - Use appropriate auth hooks consistently 32 | - Follow secure session handling practices 33 | - Apply proper loading state management 34 | - Handle auth errors systematically 35 | 36 | # Security Practices 37 | - Implement proper CSRF protection 38 | - Use secure webhook handling 39 | - Follow proper API route protection 40 | - Maintain secure session management 41 | - Apply proper role-based access control 42 | 43 | # State Management 44 | - Handle auth state changes properly 45 | - Manage organization state effectively 46 | - Implement proper loading states 47 | - Handle error states systematically 48 | - Maintain proper user session state 49 | 50 | # Route Protection 51 | - Apply consistent route protection patterns 52 | - Implement proper role-based access 53 | - Use appropriate public route definitions 54 | - Handle auth redirects properly 55 | - Maintain secure API route protection 56 | 57 | # Error Handling 58 | - Implement proper auth error boundaries 59 | - Handle session errors appropriately 60 | - Manage webhook errors effectively 61 | - Handle organization errors properly 62 | - Maintain proper error state management 63 | 64 | # Testing Practices 65 | - Implement proper auth mocking 66 | - Test protected routes effectively 67 | - Verify webhook handling properly 68 | - Test organization features systematically 69 | - Maintain proper test isolation 70 | 71 | # Performance Considerations 72 | - Optimize auth state management 73 | - Handle auth loading states efficiently 74 | - Implement proper code splitting 75 | - Optimize webhook processing 76 | - Maintain efficient organization state -------------------------------------------------------------------------------- /prompts/clerk-nuxt/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Clerk Nuxt.js Setup", 4 | "description": "Guidelines for writing Nuxt.js apps with Clerk", 5 | "type": "setup", 6 | "slug": "setup-clerk-nuxt", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["frontend", "api", "documentation"], 9 | "tags": ["setup"], 10 | "tech_stack": { 11 | "framework": "nuxt", 12 | "service": "clerk" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-clerk-nuxt.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Clerk Nuxt.js Features", 27 | "description": "Guidelines for adding new features with Clerk in Nuxt.js", 28 | "type": "feature", 29 | "slug": "add-feature-clerk-nuxt", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["frontend", "api", "documentation"], 32 | "tags": ["features"], 33 | "tech_stack": { 34 | "framework": "nuxt", 35 | "service": "clerk" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-clerk-nuxt.md"], 46 | "published": true 47 | }, 48 | { 49 | "name": "Clerk Nuxt.js Coding Standards", 50 | "description": "Coding Standards & Rules for Clerk in Nuxt.js", 51 | "type": "rule", 52 | "slug": "rule-clerk-nuxt-coding-standards", 53 | "development_process": ["implement", "test"], 54 | "dev_categories": ["frontend", "api", "documentation"], 55 | "tags": ["standards"], 56 | "tech_stack": { 57 | "framework": "nuxt", 58 | "service": "clerk" 59 | }, 60 | "ai_editor": ["cursor"], 61 | "author": { 62 | "name": "Kevin Kern", 63 | "url": "https://github.com/regenrek", 64 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 65 | }, 66 | "model": ["reasoning", "chat"], 67 | "version": "1.0", 68 | "files": ["rule-clerk-nuxt-coding-standards.md"], 69 | "published": true 70 | } 71 | ] 72 | -------------------------------------------------------------------------------- /prompts/clerk-react/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Clerk React", 4 | "description": "Guidelines for setting up and integrating Clerk authentication in React applications", 5 | "type": "setup", 6 | "slug": "clerk-react-setup", 7 | "development_process": ["implement"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["security"], 10 | "tech_stack": { 11 | "framework": "react", 12 | "service": "clerk" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-clerk-react.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Add Features to Clerk React", 27 | "description": "Guidelines for adding new authentication features with Clerk in React applications", 28 | "type": "feature", 29 | "slug": "clerk-react-features", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["auth", "frontend"], 32 | "tags": ["security"], 33 | "tech_stack": { 34 | "framework": "react", 35 | "service": "clerk" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-clerk-react.md"], 46 | "published": true 47 | }, 48 | { 49 | "name": "Clerk React Coding Standards", 50 | "description": "Coding standards and best practices for implementing Clerk authentication in React applications", 51 | "type": "rule", 52 | "slug": "clerk-react-standards", 53 | "development_process": ["implement"], 54 | "dev_categories": ["auth", "frontend"], 55 | "tags": ["security"], 56 | "tech_stack": { 57 | "framework": "react", 58 | "service": "clerk" 59 | }, 60 | "ai_editor": ["cursor"], 61 | "author": { 62 | "name": "Kevin Kern", 63 | "url": "https://github.com/regenrek", 64 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 65 | }, 66 | "model": ["reasoning", "chat"], 67 | "version": "1.0", 68 | "files": ["rule-clerk-react-coding-standards.md"], 69 | "published": true 70 | } 71 | ] 72 | -------------------------------------------------------------------------------- /prompts/clerk-react/rule-clerk-react-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards and Rules for React with Clerk Authentication 3 | globs: "**/*.ts, **/*.tsx, **/*.js, **/*.jsx" 4 | --- 5 | 6 | You are a senior React developer with expertise in integrating Clerk for authentication. Follow these guidelines to ensure a robust and maintainable implementation. 7 | 8 | # Project Structure 9 | - Place authentication components in a dedicated auth directory 10 | - Organize protected routes in a separate routes directory 11 | - Keep authentication utilities in a utils/auth directory 12 | - Store authentication types in types/auth directory 13 | - Maintain consistent file naming for auth components 14 | 15 | # Authentication Implementation 16 | - Use ClerkProvider at the root level for global auth context 17 | - Implement protected routes using SignedIn and SignedOut components 18 | - Handle loading states during authentication checks 19 | - Use proper error boundaries for auth failures 20 | - Implement proper session management 21 | 22 | # Component Organization 23 | - Keep authentication components focused and single-purpose 24 | - Use proper prop validation for auth components 25 | - Implement consistent error handling across auth components 26 | - Handle loading states uniformly 27 | - Follow proper component composition patterns 28 | 29 | # State Management 30 | - Use Clerk hooks for auth state management 31 | - Avoid custom auth state implementations 32 | - Handle auth state updates properly 33 | - Implement proper loading indicators 34 | - Use proper error handling for state changes 35 | 36 | # Security Practices 37 | - Store sensitive keys in environment variables 38 | - Implement proper CSRF protection 39 | - Handle session timeouts gracefully 40 | - Implement proper token management 41 | - Use secure cookie settings 42 | 43 | # Performance Considerations 44 | - Implement lazy loading for auth components 45 | - Handle auth state rehydration properly 46 | - Optimize authentication redirects 47 | - Minimize unnecessary re-renders 48 | - Handle concurrent auth requests properly 49 | 50 | # Development Guidelines 51 | - Use TypeScript for better type safety 52 | - Follow consistent error handling patterns 53 | - Implement proper loading states 54 | - Document authentication flows 55 | - Maintain security best practices 56 | 57 | # Best Practices 58 | - Do: Use Clerk's built-in components for standard auth flows 59 | - Do: Implement proper error boundaries 60 | - Do: Handle loading states consistently 61 | - Do: Use TypeScript for type safety 62 | - Do: Follow security best practices 63 | - Don't: Create custom auth providers 64 | - Don't: Store sensitive data in localStorage 65 | - Don't: Use deprecated auth methods 66 | - Don't: Skip loading state handling 67 | - Don't: Ignore error handling 68 | 69 | # Error Handling 70 | - Implement proper authentication error handling 71 | - Use consistent error messaging 72 | - Handle network failures gracefully 73 | - Provide user-friendly error messages 74 | - Maintain proper error logging 75 | 76 | # Testing Requirements 77 | - Test authentication flows thoroughly 78 | - Implement proper mocking for auth state 79 | - Test error scenarios 80 | - Verify loading states 81 | - Validate security measures -------------------------------------------------------------------------------- /prompts/clerk-remix/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Clerk with Remix", 4 | "description": "Guidelines for implementing Clerk authentication in Remix applications", 5 | "type": "setup", 6 | "slug": "remix-clerk-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["authentication", "single-page-application"], 10 | "tech_stack": { 11 | "framework": "remix", 12 | "service": "clerk" 13 | }, 14 | "ai_editor": ["cursor", "vscode", "windsurf", "cline", "bolt.new"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-clerk-remix.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/clerk-svelte/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Clerk Authentication in SvelteKit", 4 | "description": "Guide for setting up Clerk authentication in a SvelteKit application", 5 | "type": "setup", 6 | "slug": "clerk-svelte-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["middleware"], 10 | "tech_stack": { 11 | "framework": "svelte", 12 | "service": "clerk" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-clerk-svelte.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Add Features to Clerk SvelteKit Integration", 27 | "description": "Guidelines for adding new features to Clerk authentication in SvelteKit", 28 | "type": "feature", 29 | "slug": "clerk-svelte-features", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["auth", "frontend"], 32 | "tags": ["middleware"], 33 | "tech_stack": { 34 | "framework": "svelte", 35 | "service": "clerk" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-clerk-svelte.md"], 46 | "published": true 47 | }, 48 | { 49 | "name": "Clerk SvelteKit Coding Standards", 50 | "description": "Coding standards and best practices for using Clerk with SvelteKit", 51 | "type": "rule", 52 | "slug": "clerk-svelte-standards", 53 | "development_process": ["implement", "test"], 54 | "dev_categories": ["auth", "frontend"], 55 | "tags": ["middleware"], 56 | "tech_stack": { 57 | "framework": "svelte", 58 | "service": "clerk" 59 | }, 60 | "ai_editor": ["cursor"], 61 | "author": { 62 | "name": "Kevin Kern", 63 | "url": "https://github.com/regenrek", 64 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 65 | }, 66 | "model": ["reasoning", "chat"], 67 | "version": "1.0", 68 | "files": ["rule-clerk-svelte-coding-standards.md"], 69 | "published": true 70 | } 71 | ] 72 | -------------------------------------------------------------------------------- /prompts/clerk-svelte/rule-clerk-svelte-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards and Rules for using Clerk with SvelteKit 3 | globs: **/*.svelte, **/*.ts, **/*.js 4 | --- 5 | 6 | You are a senior SvelteKit developer with expertise in Clerk authentication integration. 7 | 8 | # Authentication Setup 9 | - Initialize Clerk client in the root layout file for global authentication state 10 | - Configure protected paths in server hooks for consistent route protection 11 | - Use environment variables for Clerk configuration keys 12 | - Implement proper session handling with Clerk middleware 13 | 14 | # Component Usage 15 | - Use Clerk components with proper TypeScript types for type safety 16 | - Implement authentication state management using Clerk stores 17 | - Follow SvelteKit load function patterns for server-side authentication 18 | - Use proper event handling for Clerk component callbacks 19 | 20 | # Route Protection 21 | - Implement server-side route protection using Clerk middleware 22 | - Use client-side route guards with Clerk authentication state 23 | - Handle authentication redirects properly 24 | - Implement proper loading states during authentication 25 | 26 | # State Management 27 | - Use Clerk stores for authentication state management 28 | - Implement proper type safety for user and session data 29 | - Handle authentication state changes reactively 30 | - Use proper store subscription cleanup 31 | 32 | # Security 33 | - Implement proper CSRF protection with Clerk 34 | - Use secure session handling mechanisms 35 | - Handle authentication tokens securely 36 | - Implement proper error boundaries for authentication failures 37 | 38 | # Performance 39 | - Implement proper loading states for authentication components 40 | - Use lazy loading for non-critical authentication features 41 | - Handle authentication state changes efficiently 42 | - Optimize authentication component rendering 43 | 44 | # Error Handling 45 | - Implement proper error handling for authentication failures 46 | - Use type-safe error handling with Clerk components 47 | - Handle network errors gracefully 48 | - Provide user-friendly error messages 49 | 50 | # Development 51 | - Use TypeScript for type safety in authentication logic 52 | - Follow SvelteKit conventions for authentication integration 53 | - Implement proper development environment configuration 54 | - Use proper debugging tools for authentication flows -------------------------------------------------------------------------------- /prompts/clerk-tanstack/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Clerk TanStack Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Clerk authentication with TanStack applications, covering user management and security features", 5 | "type": "setup", 6 | "slug": "clerk-tanstack-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["authentication", "security"], 10 | "tech_stack": { 11 | "framework": "tanstack", 12 | "service": "clerk" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-clerk-tanstack.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Clerk TanStack Feature Guidelines", 27 | "description": "Guidelines for implementing authentication features using Clerk in TanStack applications", 28 | "type": "feature", 29 | "slug": "clerk-tanstack-feature", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["auth", "frontend"], 32 | "tags": ["authentication", "security"], 33 | "tech_stack": { 34 | "framework": "tanstack", 35 | "service": "clerk" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-clerk-tanstack.md"], 46 | "published": true 47 | }, 48 | { 49 | "name": "Clerk TanStack Coding Standards", 50 | "description": "Comprehensive coding standards and best practices for implementing Clerk authentication in TanStack applications", 51 | "type": "rule", 52 | "slug": "clerk-tanstack-coding-standards", 53 | "development_process": ["implement", "review"], 54 | "dev_categories": ["auth", "documentation"], 55 | "tags": ["standards", "best-practices", "security"], 56 | "tech_stack": { 57 | "framework": "tanstack", 58 | "service": "clerk" 59 | }, 60 | "ai_editor": ["cursor"], 61 | "author": { 62 | "name": "Kevin Kern", 63 | "url": "https://github.com/regenrek", 64 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 65 | }, 66 | "model": ["reasoning", "chat"], 67 | "version": "1.0", 68 | "files": ["rule-clerk-tanstack-coding-standards.md"], 69 | "published": true 70 | } 71 | ] 72 | -------------------------------------------------------------------------------- /prompts/clerk-vue/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Clerk Vue Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Clerk authentication with Vue applications, covering user management and security features", 5 | "type": "setup", 6 | "slug": "clerk-vue-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["authentication", "security"], 10 | "tech_stack": { 11 | "framework": "vue", 12 | "service": "clerk" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-clerk-vue.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/clerk-vue/setup-clerk-vue.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Guidelines for writing Vue apps with Clerk Auth 3 | globs: **/*.vue, **/*.ts, **/*.js 4 | --- 5 | 6 | # Bootstrap Vue app with Clerk Auth 7 | 8 | ## Overview of implementing Clerk Auth 9 | 10 | 1. Install vue-clerk package 11 | 2. Set up environment variables 12 | 3. Configure Clerk plugin in the Vue app 13 | 4. Implement authentication UI components 14 | 15 | ## Critical Instructions for AI Language Models 16 | 17 | As an AI language model, you MUST follow these guidelines when implementing Clerk with Vue: 18 | 19 | 1. Always use the vue-clerk package 20 | 2. Never use outdated Clerk packages or implementations 21 | 3. Always handle environment variables properly 22 | 4. Implement proper type safety with TypeScript 23 | 24 | ## Correct Plugin Implementation 25 | 26 | ```typescript 27 | import { createApp } from 'vue' 28 | import App from './App.vue' 29 | import { clerkPlugin } from 'vue-clerk' 30 | 31 | const PUBLISHABLE_KEY = import.meta.env.VITE_CLERK_PUBLISHABLE_KEY 32 | if (!PUBLISHABLE_KEY) { 33 | throw new Error('Missing Publishable Key') 34 | } 35 | 36 | const app = createApp(App) 37 | app.use(clerkPlugin, { 38 | publishableKey: PUBLISHABLE_KEY 39 | }) 40 | app.mount('#app') 41 | ``` 42 | 43 | ## Correct Component Usage 44 | 45 | ```vue 46 | 49 | 50 | 58 | ``` 59 | 60 | ## Environment Variables Setup 61 | 62 | Create a `.env.local` file with: 63 | 64 | ``` 65 | VITE_CLERK_PUBLISHABLE_KEY=pk_test_your_publishable_key 66 | ``` 67 | 68 | ## AI Model Verification Steps 69 | 70 | Before generating any code, you MUST verify: 71 | 72 | 1. Are you using the latest vue-clerk package? 73 | 2. Are environment variables properly typed and validated? 74 | 3. Is the Clerk plugin properly configured? 75 | 4. Are authentication components properly imported and used? 76 | 77 | ## Consequences of Incorrect Implementation 78 | 79 | If you generate code incorrectly: 80 | 1. Authentication will fail 81 | 2. Type safety will be compromised 82 | 3. Security vulnerabilities may be introduced 83 | 4. User sessions may not persist correctly 84 | 85 | ## AI Model Response Template 86 | 87 | When implementing Clerk Auth for Vue, you MUST: 88 | 1. Use only official Clerk components 89 | 2. Implement proper TypeScript types 90 | 3. Follow Vue 3 Composition API best practices 91 | 4. Ensure proper environment variable handling -------------------------------------------------------------------------------- /prompts/drizzle-angular/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Drizzle with Angular", 4 | "description": "Guidelines for integrating Drizzle ORM with Angular applications", 5 | "type": "setup", 6 | "slug": "angular-drizzle-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "angular", 12 | "service": "drizzle" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-drizzle-angular.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/drizzle-astro/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Drizzle with Astro", 4 | "description": "Guidelines for integrating Drizzle ORM with Astro applications", 5 | "type": "setup", 6 | "slug": "astro-drizzle-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "astro", 12 | "service": "drizzle" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-drizzle-astro.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/drizzle-javascript/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Drizzle with JavaScript", 4 | "description": "Guidelines for integrating Drizzle ORM with JavaScript applications", 5 | "type": "setup", 6 | "slug": "javascript-drizzle-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "javascript", 12 | "service": "drizzle" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-drizzle-javascript.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/drizzle-next/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Drizzle with Next.js", 4 | "description": "Guidelines for integrating Drizzle ORM with Next.js applications", 5 | "type": "setup", 6 | "slug": "next-drizzle-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "next", 12 | "service": "drizzle" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-drizzle-next.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/drizzle-nuxt/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Drizzle with Nuxt", 4 | "description": "Guidelines for integrating Drizzle ORM with Nuxt applications", 5 | "type": "setup", 6 | "slug": "nuxt-drizzle-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "nuxt", 12 | "service": "drizzle" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-drizzle-nuxt.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/drizzle-remix/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Drizzle with Remix", 4 | "description": "Guidelines for integrating Drizzle ORM with Remix applications", 5 | "type": "setup", 6 | "slug": "remix-drizzle-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "remix", 12 | "service": "drizzle" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-drizzle-remix.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/drizzle-tanstack/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Drizzle with TanStack", 4 | "description": "Guidelines for integrating Drizzle ORM with TanStack Query applications", 5 | "type": "setup", 6 | "slug": "tanstack-drizzle-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "tanstack", 12 | "service": "drizzle" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-drizzle-tanstack.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/drizzle-vue/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Drizzle Vue Integration Setup", 4 | "description": "Guidelines for setting up and integrating Drizzle ORM with Vue 3 applications", 5 | "type": "setup", 6 | "slug": "drizzle-vue-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "vue", 12 | "service": "drizzle" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-drizzle-vue.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/firebase-angular/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Firebase with Angular", 4 | "description": "Guidelines for integrating Firebase backend services with Angular applications", 5 | "type": "setup", 6 | "slug": "angular-firebase-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "angular", 12 | "service": "firebase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-firebase-angular.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/firebase-astro/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Firebase with Astro", 4 | "description": "Guidelines for integrating Firebase backend services with Astro applications", 5 | "type": "setup", 6 | "slug": "astro-firebase-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "astro", 12 | "service": "firebase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-firebase-astro.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/firebase-javascript/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Firebase with JavaScript", 4 | "description": "Guidelines for integrating Firebase backend services with JavaScript applications", 5 | "type": "setup", 6 | "slug": "javascript-firebase-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "javascript", 12 | "service": "firebase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-firebase-javascript.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/firebase-next/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Firebase with Next.js", 4 | "description": "Guidelines for integrating Firebase backend services with Next.js applications", 5 | "type": "setup", 6 | "slug": "next-firebase-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "next", 12 | "service": "firebase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-firebase-next.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/firebase-nuxt/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Firebase with Nuxt", 4 | "description": "Guidelines for integrating Firebase backend services with Nuxt applications", 5 | "type": "setup", 6 | "slug": "nuxt-firebase-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "nuxt", 12 | "service": "firebase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-firebase-nuxt.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/firebase-react/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Firebase React Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Firebase with React applications, covering authentication, database, and cloud functions", 5 | "type": "setup", 6 | "slug": "firebase-react-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["backend", "db", "auth"], 9 | "tags": ["cloud-functions", "real-time"], 10 | "tech_stack": { 11 | "framework": "react", 12 | "service": "firebase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-firebase-react.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/firebase-remix/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Firebase with Remix", 4 | "description": "Guidelines for integrating Firebase backend services with Remix applications", 5 | "type": "setup", 6 | "slug": "remix-firebase-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "remix", 12 | "service": "firebase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-firebase-remix.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/firebase-tanstack/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Firebase with TanStack", 4 | "description": "Guidelines for integrating Firebase backend services with TanStack Query applications", 5 | "type": "setup", 6 | "slug": "tanstack-firebase-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "tanstack", 12 | "service": "firebase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-firebase-tanstack.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/firebase-vue/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Firebase with Vue", 4 | "description": "Guidelines for integrating Firebase backend services with Vue applications", 5 | "type": "setup", 6 | "slug": "vue-firebase-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "auth", "db", "storage"], 9 | "tags": ["baas"], 10 | "tech_stack": { 11 | "framework": "vue", 12 | "service": "firebase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-firebase-vue.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/flutter/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Flutter 3.29 Coding Standards", 4 | "description": "Comprehensive coding standards and best practices for Flutter 3.29 development, covering project structure, Dart usage, and performance optimization", 5 | "type": "rule", 6 | "slug": "flutter-3-29-coding-standards", 7 | "development_process": ["implement"], 8 | "dev_categories": ["frontend", "mobile"], 9 | "tags": ["architecture"], 10 | "tech_stack": { 11 | "framework": "flutter" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["rule-flutter-3-29-coding-standards.md"], 22 | "published": true 23 | } 24 | ] -------------------------------------------------------------------------------- /prompts/flutter/rule-flutter-3-29-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Flutter 3.29 3 | globs: "**/*.dart" 4 | alwaysApply: true 5 | --- 6 | 7 | You are an expert in Flutter 3.29, TypeScript, and related libraries. You are focusing on producing clear, readable code. You always use the latest stable versions of Flutter and you are familiar with the latest features and best practices. 8 | 9 | ### Project Structure 10 | - Use `lib/` for all application code and `lib/src/` for internal implementation details with subdirectories like `models/`, `views/`, `constants/`, and `themes/`. 11 | - Keep `main.dart` minimal, containing only necessary imports and the main function with `MaterialApp` or `CupertinoApp` configuration. 12 | - Name files using camelCase or snake_case and classes in PascalCase for consistency. 13 | 14 | ### Code Style 15 | - Apply `const` to immutable objects and widgets to enhance performance by reducing rebuilds. 16 | - Minimize widget rebuilds by preferring `StatelessWidget` when state is not needed and using keys appropriately. 17 | - Follow Dart and Flutter coding style guidelines with consistent spacing, indentation, and single quotes for strings. 18 | - Handle platform calls efficiently with asynchronous programming to avoid blocking the main thread, as Dart code now runs synchronously on Android and iOS. 19 | 20 | ### Usage 21 | - Leverage `CupertinoNavigationBar` and `CupertinoSliverNavigationBar` with the `bottom` property for additional controls and configure `bottomMode` for scrolling behavior. 22 | - Use `CupertinoSheetRoute` and `showCupertinoSheet` for iOS-style modal sheets with drag-to-dismiss functionality. 23 | - Enable Material 3 styles by setting `year2023` to `false` and use `FadeForwardsPageTransitionsBuilder` for page transitions. 24 | - Wrap widgets with `SelectionListener` to monitor text selection details and use `SelectableRegionSelectionStatusScope` to check selection status. 25 | - Ensure forms announce only the first error with screen readers and label dropdown menus correctly for accessibility. 26 | - Account for WebAssembly HTTP header changes and use `webHtmlElementStrategy` for web image rendering control. 27 | - Optimize performance with `BackdropGroup` for multiple blurs and `ImageFilter.shader` for custom effects. 28 | - Avoid discontinued packages like `css_colors`, `flutter_adaptive_scaffold`, `flutter_image`, `flutter_markdown`, `ios_platform_images`, and `palette_generator` by April 30, 2025, and seek alternatives. -------------------------------------------------------------------------------- /prompts/get-docs/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Documentation Fetcher Agent", 4 | "description": "An AI agent (Hermes) specialized in fetching and organizing framework documentation, automating the process of documentation retrieval and installation guide extraction", 5 | "type": "agent", 6 | "slug": "documentation-fetcher-agent", 7 | "development_process": ["documentation", "automation"], 8 | "dev_categories": ["tooling", "documentation"], 9 | "tags": ["docs", "automation", "framework", "installation-guide"], 10 | "tech_stack": { 11 | "framework": "sitefetch", 12 | "tooling": "npx" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["agent"], 21 | "version": "1.0", 22 | "files": ["get-docs.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/get-docs/get-docs.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: 3 | globs: 4 | alwaysApply: false 5 | --- 6 | 7 | you are hermes, a specialized ai agent that fetches docs for frameworks. 8 | 9 | RULES: 10 | - Don't scan the whole project directory. 11 | - Only follow the steps below do nothing else! 12 | 13 | Your goal is to fetch remote docs. Follow these steps: 14 | 15 | 1. use the following command to fetch latest docs for the first framework used: 16 | 17 | ```bash 18 | npx sitefetch {docs-url} -o docs/framework/{name}.md 19 | ``` 20 | 21 | 2. read docs/framework/{name}.md and find the suitable installation guide documentation. create another file with its content to docs/framework/install-{name}.md. ONLY add the installation path for the current framework we're using. 22 | -------------------------------------------------------------------------------- /prompts/laravel-11/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Laravel 11 Feature Guidelines", 4 | "description": "Comprehensive guidelines for adding new features in Laravel 11 applications, covering controllers, models, and services", 5 | "type": "feature", 6 | "slug": "laravel-11-feature-guidelines", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "api"], 9 | "tags": ["mvc"], 10 | "tech_stack": { 11 | "framework": "laravel" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["add-feature-laravel.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Laravel 11 Coding Standards", 26 | "description": "Comprehensive coding standards and best practices for Laravel 11 development, covering project structure, type hints, and more", 27 | "type": "rule", 28 | "slug": "laravel-11-coding-standards", 29 | "development_process": ["implement"], 30 | "dev_categories": ["backend", "documentation"], 31 | "tags": ["architecture"], 32 | "tech_stack": { 33 | "framework": "laravel" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-laravel-coding-standards.md"], 44 | "published": true 45 | } 46 | ] 47 | -------------------------------------------------------------------------------- /prompts/neon-angular/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Neon with Angular", 4 | "description": "Guidelines for integrating Neon serverless Postgres with Angular applications", 5 | "type": "setup", 6 | "slug": "angular-neon-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["postgres", "serverless", "sql"], 10 | "tech_stack": { 11 | "framework": "angular", 12 | "service": "neon" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-neon-angular.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/neon-astro/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Neon with Astro", 4 | "description": "Guidelines for integrating Neon serverless Postgres with Astro applications", 5 | "type": "setup", 6 | "slug": "astro-neon-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["postgres", "serverless", "sql"], 10 | "tech_stack": { 11 | "framework": "astro", 12 | "service": "neon" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-neon-astro.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/neon-javascript/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Neon with JavaScript", 4 | "description": "Guidelines for integrating Neon serverless Postgres with JavaScript applications", 5 | "type": "setup", 6 | "slug": "javascript-neon-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["postgres", "serverless", "sql"], 10 | "tech_stack": { 11 | "framework": "javascript", 12 | "service": "neon" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-neon-javascript.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/neon-next/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Neon Next.js Integration Setup", 4 | "description": "Guidelines for setting up and integrating Neon serverless Postgres with Next.js 14 applications", 5 | "type": "setup", 6 | "slug": "neon-next-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["postgres", "serverless", "sql", "server-actions", "app-router"], 10 | "tech_stack": { 11 | "framework": "next", 12 | "service": "neon" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-neon-next.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/neon-nuxt/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Neon Nuxt Integration Setup", 4 | "description": "Guidelines for setting up and integrating Neon serverless Postgres with Nuxt 3 applications", 5 | "type": "setup", 6 | "slug": "neon-nuxt-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["postgres", "serverless", "sql", "ssr"], 10 | "tech_stack": { 11 | "framework": "nuxt", 12 | "service": "neon" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-neon-nuxt.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/neon-remix/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Neon with Remix", 4 | "description": "Guidelines for integrating Neon serverless Postgres with Remix applications", 5 | "type": "setup", 6 | "slug": "remix-neon-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["postgres", "serverless", "sql"], 10 | "tech_stack": { 11 | "framework": "remix", 12 | "service": "neon" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-neon-remix.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/neon-tanstack/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Neon with TanStack", 4 | "description": "Guidelines for integrating Neon serverless Postgres with TanStack Query applications", 5 | "type": "setup", 6 | "slug": "tanstack-neon-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["postgres", "serverless", "sql"], 10 | "tech_stack": { 11 | "framework": "tanstack", 12 | "service": "neon" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-neon-tanstack.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/neon-vue/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Neon with Vue", 4 | "description": "Guidelines for integrating Neon serverless Postgres with Vue applications", 5 | "type": "setup", 6 | "slug": "vue-neon-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["postgres", "serverless", "sql"], 10 | "tech_stack": { 11 | "framework": "vue", 12 | "service": "neon" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-neon-vue.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/next-15/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Next.js 15 Feature Guidelines", 4 | "description": "Comprehensive guidelines for adding new features in Next.js 15 applications, covering pages, components, and API routes", 5 | "type": "feature", 6 | "slug": "next-15-feature-guidelines", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["frontend", "api"], 9 | "tags": ["server-components"], 10 | "tech_stack": { 11 | "framework": "next" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["add-feature-next.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Next.js 15 Coding Standards", 26 | "description": "Comprehensive coding standards and best practices for Next.js 15 development, covering project structure, TypeScript usage, and more", 27 | "type": "rule", 28 | "slug": "next-15-coding-standards", 29 | "development_process": ["implement"], 30 | "dev_categories": ["frontend", "documentation"], 31 | "tags": ["architecture"], 32 | "tech_stack": { 33 | "framework": "next" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-next-coding-standards.md"], 44 | "published": true 45 | } 46 | ] 47 | -------------------------------------------------------------------------------- /prompts/next-fal-image-ai/01-next-shadcn.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Guidelines for installing and configuring ShadCN UI 3 | globs: **/*.ts, **/*.tsx, **/*.js, **/*.jsx 4 | --- 5 | 6 | # Install & Configure ShadCN UI for Next.js 15 & React 19 7 | 8 | ## Overview 9 | 10 | 1. Add ShadCN UI to your Next.js 15 project. 11 | 2. Set up Tailwind CSS (v4 or latest). 12 | 3. Generate the ShadCN components (e.g., Sidebar, Button) you need. 13 | 14 | ## CRITICAL INSTRUCTIONS 15 | - Use the latest ShadCN CLI. 16 | - Avoid any deprecated or unverified ShadCN code. 17 | - Ensure Tailwind is properly configured (tailwind.config.js, postcss.config.js) for your app folder. 18 | 19 | ## Key Steps 20 | 21 | 1. Install ShadCN CLI: 22 | ```bash 23 | npx shadcn@latest init 24 | ``` 25 | 2. Tailwind Configuration: 26 | - Confirm your tailwind.config.js includes paths to app/**/*.{js,ts,jsx,tsx} and components/**/*.{js,ts,jsx,tsx}. 27 | - Make sure globals.css (or a similar file) imports Tailwind base, components, and utilities. 28 | 3. Add Components: 29 | ```bash 30 | npx shadcn add sidebar button 31 | ``` 32 | This copies the sidebar, button, and other required files into your project's components folder. 33 | 34 | ## Verification Checklist 35 | - Did you confirm your tailwind.config.js references the correct directories? 36 | - Are you using the ShadCN CLI commands exactly as shown? 37 | - No deprecated or custom-coded patterns outside the official ShadCN approach? 38 | 39 | ## AI MODEL RESPONSE TEMPLATE 40 | When asked about ShadCN installation or setup: 41 | 1. Provide the npx shadcn@latest init command. 42 | 2. Show how to configure Tailwind for Next.js 15. 43 | 3. Emphasize using npx shadcn add for new components. -------------------------------------------------------------------------------- /prompts/next-fal-image-ai/02-dashboard.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Guidelines for creating a ShadCN-based dashboard in Next.js 3 | globs: **/*.ts, **/*.tsx, **/*.js, **/*.jsx 4 | --- 5 | 6 | # Create a Dashboard & Frontend Layout with ShadCN 7 | 8 | ## Overview 9 | 10 | 1. Build a dashboard page using the ShadCN sidebar component. 11 | 2. Place the sidebar in a fixed left column with the main content on the right. 12 | 3. Use Next.js 15's App Router structure (for example, app/dashboard/layout.tsx). 13 | 14 | ## CRITICAL INSTRUCTIONS 15 | - Render the ShadCN Sidebar in a layout component. 16 | - Keep the overall layout flexible, such as className="flex min-h-screen". 17 | - Use AppSidebar in your custom layout. 18 | 19 | ## Key Steps 20 | 21 | 1. Create Dashboard Layout (app/dashboard/layout.tsx): 22 | ```tsx 23 | // app/dashboard/layout.tsx 24 | import { AppSidebar } from "@/components/ui/sidebar" 25 | 26 | export default function DashboardLayout({ children }: { children: React.ReactNode }) { 27 | return ( 28 |
29 | 30 |
31 | {children} 32 |
33 |
34 | ) 35 | } 36 | ``` 37 | 2. Customize the Sidebar Component: 38 | ```tsx 39 | // components/ui/sidebar.tsx 40 | // Example usage of ShadCN's sidebar 41 | import { Sidebar, SidebarContent, SidebarGroup, SidebarMenu, SidebarMenuItem } from "@/components/ui/sidebar" 42 | 43 | export function AppSidebar() { 44 | return ( 45 | 46 | 47 | 48 | 49 | 50 | {/* Menu items */} 51 | 52 | 53 | 54 | 55 | 56 | ) 57 | } 58 | ``` 59 | 3. Add Routes and Pages 60 | - Implement app/dashboard/page.tsx for the default dashboard view. 61 | - Optionally add app/settings/page.tsx if you want a settings section. 62 | 63 | ## Verification Checklist 64 | - Does the sidebar persist on every dashboard sub-route? 65 | - Is the layout using ShadCN components (for example, Sidebar, SidebarContent)? 66 | - Are you following Next.js 15 App Router conventions? 67 | 68 | ## AI MODEL RESPONSE TEMPLATE 69 | When asked about creating a dashboard: 70 | 1. Provide layout code with AppSidebar on the left and main content on the right. 71 | 2. Reference ShadCN's official sidebar usage. 72 | 3. Avoid any deprecated or unverified code patterns. -------------------------------------------------------------------------------- /prompts/next-fal-image-ai/03-fal-api.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Guidelines for installing and configuring Fal.ai 3 | globs: **/*.ts, **/*.tsx, **/*.js, **/*.jsx 4 | --- 5 | 6 | # Install & Configure Fal.ai for Text-to-Image 7 | 8 | ## Overview 9 | 10 | 1. Install Fal.ai client (@fal-ai/client) and server proxy (@fal-ai/server-proxy). 11 | 2. Create a Next.js API route that forwards requests to Fal.ai, hiding your API key. 12 | 3. Store the Fal.ai key in environment variables. 13 | 14 | ## CRITICAL INSTRUCTIONS 15 | - Never expose the FAL_KEY in client code. 16 | - Use the @fal-ai/server-proxy/nextjs route to protect the key. 17 | - Confirm your .env.local (and Vercel env) hold FAL_KEY. 18 | 19 | ## Key Steps 20 | 21 | 1. Install: 22 | ```bash 23 | npm install @fal-ai/client @fal-ai/server-proxy 24 | ``` 25 | 2. Environment (.env.local): 26 | ```bash 27 | FAL_KEY="your-secret-fal-ai-key" 28 | ``` 29 | 3. Create Proxy Route (app/api/fal/proxy/route.ts): 30 | ```ts 31 | import { route } from "@fal-ai/server-proxy/nextjs" 32 | 33 | export const { GET, POST } = route 34 | ``` 35 | 4. Client Configuration: 36 | ```tsx 37 | // app/providers.tsx or similar 38 | "use client" 39 | 40 | import { fal } from "@fal-ai/client" 41 | 42 | fal.config({ proxyUrl: "/api/fal/proxy" }) 43 | ``` 44 | This ensures client requests go to /api/fal/proxy, which injects your secret key server-side. 45 | 46 | ## Verification Checklist 47 | - Is FAL_KEY only in the server environment? 48 | - Did you create /api/fal/proxy using @fal-ai/server-proxy/nextjs? 49 | - Is the client configured with fal.config({ proxyUrl })? 50 | 51 | ## AI MODEL RESPONSE TEMPLATE 52 | When asked about Fal.ai setup: 53 | 1. Show the npm install commands for @fal-ai/client and @fal-ai/server-proxy. 54 | 2. Provide code for the Next.js proxy route (export const { GET, POST }). 55 | 3. Emphasize storing FAL_KEY in .env.local (never exposing it on the client). -------------------------------------------------------------------------------- /prompts/next-fal-image-ai/04-text-to-image.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Guidelines for building text-to-image generation in Next.js 15 3 | globs: **/*.ts, **/*.tsx, **/*.js, **/*.jsx 4 | --- 5 | 6 | # Implement Text-to-Image Generation Page 7 | 8 | ## Overview 9 | 10 | 1. Provide a user interface to input a text prompt. 11 | 2. Call Fal.ai (through the proxy) to generate an image. 12 | 3. Display the generated image on the page. 13 | 14 | ## CRITICAL INSTRUCTIONS 15 | - Only call fal.subscribe from client-side code or server actions that remain private. 16 | - Show a loading state or message if generation takes time. 17 | - Ensure the Fal.ai key is never directly in client code. 18 | 19 | ## Key Steps 20 | 21 | 1. Create a Dashboard Page (app/dashboard/page.tsx): 22 | ```tsx 23 | "use client" 24 | import { useState } from "react" 25 | import { fal } from "@fal-ai/client" 26 | 27 | export default function DashboardPage() { 28 | const [prompt, setPrompt] = useState("") 29 | const [imageUrl, setImageUrl] = useState("") 30 | const [loading, setLoading] = useState(false) 31 | 32 | async function handleGenerate() { 33 | try { 34 | setLoading(true) 35 | const result = await fal.subscribe("fal-ai/flux/dev", { 36 | input: { prompt, image_size: "square_hd" }, 37 | }) 38 | setImageUrl(result.images[0]?.url || "") 39 | } catch (error) { 40 | console.error("Fal.ai error:", error) 41 | } finally { 42 | setLoading(false) 43 | } 44 | } 45 | 46 | return ( 47 |
48 | setPrompt(e.target.value)} 51 | placeholder="Enter your prompt..." 52 | /> 53 | 56 | {imageUrl && AI Generated} 57 |
58 | ) 59 | } 60 | ``` 61 | 2. Verification: 62 | - Try inputting a prompt like "A futuristic city skyline at night." 63 | - Confirm an image appears if the Fal.ai call succeeds. 64 | 65 | ## Verification Checklist 66 | - Is the Fal.ai request going to the proxy ("/api/fal/proxy")? 67 | - Do you handle errors and logging gracefully? 68 | - Does the UI update once the image is generated? 69 | 70 | ## AI MODEL RESPONSE TEMPLATE 71 | When asked about text-to-image generation in Next.js: 72 | 1. Provide a minimal input + button + img flow. 73 | 2. Highlight the fal.subscribe call with proxyUrl set. 74 | 3. Show how to manage loading and the returned image. -------------------------------------------------------------------------------- /prompts/next-fal-image-ai/07-deploy.md: -------------------------------------------------------------------------------- 1 | ```markdown 2 | --- 3 | description: Guidelines for deploying the Next.js 15 text-to-image app to Vercel 4 | globs: **/*.ts, **/*.tsx, **/*.js, **/*.jsx 5 | --- 6 | 7 | # Deploy the Text-to-Image App to Vercel 8 | 9 | ## Overview 10 | 11 | 1. Push your Next.js 15 project (with Fal.ai and ShadCN) to a Git repository. 12 | 2. Import the repository into Vercel. 13 | 3. Set environment variables (FAL_KEY, etc.) in Vercel. 14 | 4. Verify your serverless routes (Fal proxy) once deployed. 15 | 16 | ## CRITICAL INSTRUCTIONS 17 | - Only store secrets (FAL_KEY) in Vercel environment variables (not in your code). 18 | - Ensure Fal.ai proxy route works on your production domain. 19 | - Use Node 18+ on Vercel if needed (check your project settings). 20 | 21 | ## Key Steps 22 | 23 | 1. Connect to Git 24 | - Commit all code to a Git provider (GitHub, GitLab, etc.). 25 | - Ensure your .gitignore excludes .env files so local secrets aren’t pushed. 26 | 2. Import Project into Vercel 27 | - Sign in to Vercel and select “Add New…” > “Project”. 28 | - Choose the repository with your Next.js 15 app. 29 | - Vercel should auto-detect Next.js and set the correct build command (npm run build or similar). 30 | 3. Configure Environment Variables 31 | - In the Vercel project settings, add: 32 | - FAL_KEY (your Fal.ai key) 33 | - Do not mark it as public, so it remains server-side only. 34 | - Rebuild once these variables are set. 35 | 4. Verify Production 36 | - After deployment, open your .vercel.app URL (or custom domain). 37 | - Test the dashboard page, prompt an image generation, and confirm Fal.ai works. 38 | - Check the logs or error messages if something fails (on the Vercel dashboard under “Functions” logs or “Deployments” logs). 39 | 40 | ## Verification Checklist 41 | - Did you add FAL_KEY as a private environment variable in Vercel? 42 | - Does the Fal.ai proxy route (app/api/fal/proxy/route.ts) return a valid response in production? 43 | - Are you using the correct environment for Node (≥ 18) if needed? 44 | 45 | ## AI MODEL RESPONSE TEMPLATE 46 | When asked about deploying to Vercel: 47 | 1. Outline linking the Git repo to Vercel. 48 | 2. Show how to add environment variables (FAL_KEY). 49 | 3. Emphasize verifying the Fal.ai proxy endpoint in your live environment. 50 | ``` -------------------------------------------------------------------------------- /prompts/next-fal-image-ai/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Next.js Fal.ai Image Generation Setup", 4 | "description": "A comprehensive guide to setting up a Next.js application with Fal.ai for AI image generation, including authentication, dashboard, and image generation features", 5 | "type": "setup", 6 | "slug": "next-falai-image-generation-setup", 7 | "development_process": ["plan", "implement", "test", "deploy"], 8 | "dev_categories": ["frontend", "api", "auth"], 9 | "tags": ["image-generation", "ai-integration"], 10 | "tech_stack": { 11 | "framework": "next", 12 | "service": "fal.ai" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": [ 23 | "00-test-setup.md", 24 | "01-next-shadcn.md", 25 | "02-dashboard.md", 26 | "03-fal-api.md", 27 | "04-text-to-image.md", 28 | "05-ui-improvements.md", 29 | "06-token-system.md", 30 | "07-deploy.md" 31 | ], 32 | "published": true, 33 | "ranking": "0" 34 | } 35 | ] 36 | -------------------------------------------------------------------------------- /prompts/next-shadcn/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Next.js ShadCN UI Coding Standards", 4 | "description": "Framework-specific coding standards and best practices for Next.js 15, React 19, and ShadCN development", 5 | "type": "rule", 6 | "slug": "next-shadcn-coding-standards", 7 | "development_process": ["plan", "implement"], 8 | "dev_categories": ["frontend"], 9 | "tags": ["standards", "best-practices"], 10 | "tech_stack": { 11 | "framework": "next" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["chat"], 20 | "version": "1.0", 21 | "files": ["rule-next-shadcn-coding-standards.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Next.js ShadCN UI Dashboard Setup", 26 | "description": "Automated installation guide for setting up ShadCN UI with dashboard components in Next.js applications", 27 | "type": "setup", 28 | "slug": "next-shadcn-dashboard-setup", 29 | "development_process": ["implement"], 30 | "dev_categories": ["frontend", "UI"], 31 | "tags": ["ui", "components", "automation"], 32 | "tech_stack": { 33 | "framework": "next" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["chat"], 42 | "version": "1.0", 43 | "files": ["setup-next-shadcn-dashboard.md"], 44 | "published": true 45 | }, 46 | { 47 | "name": "Next.js ShadCN UI Base Setup", 48 | "description": "Automated installation guide for setting up ShadCN UI in Next.js applications", 49 | "type": "setup", 50 | "slug": "next-shadcn-base-setup", 51 | "development_process": ["implement", "UI"], 52 | "dev_categories": ["frontend"], 53 | "tags": ["ui", "components", "automation"], 54 | "tech_stack": { 55 | "framework": "next" 56 | }, 57 | "ai_editor": ["cursor"], 58 | "author": { 59 | "name": "Kevin Kern", 60 | "url": "https://github.com/regenrek", 61 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 62 | }, 63 | "model": ["chat"], 64 | "version": "1.0", 65 | "files": ["setup-next-shadcn.md"], 66 | "published": true 67 | }, 68 | { 69 | "name": "Next.js ShadCN UI Dashboard with Supabase Auth", 70 | "description": "Automated installation guide for setting up ShadCN UI dashboard with Supabase authentication in Next.js applications", 71 | "type": "setup", 72 | "slug": "next-shadcn-dashboard-supabase-setup", 73 | "development_process": ["implement"], 74 | "dev_categories": ["frontend", "auth"], 75 | "tags": ["dashboard", "authentication"], 76 | "tech_stack": { 77 | "framework": "next", 78 | "service": "supabase" 79 | }, 80 | "ai_editor": ["cursor"], 81 | "author": { 82 | "name": "Kevin Kern", 83 | "url": "https://github.com/regenrek", 84 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 85 | }, 86 | "model": ["chat"], 87 | "version": "1.0", 88 | "files": ["setup-next-shadcn-dashboard-supabase.md"], 89 | "published": true 90 | } 91 | ] 92 | -------------------------------------------------------------------------------- /prompts/nuxt-3/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Nuxt 3 Feature Guidelines", 4 | "description": "Comprehensive guidelines for adding new features in Nuxt 3 applications, covering pages, components, and API endpoints", 5 | "type": "feature", 6 | "slug": "nuxt-3-feature-guidelines", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["frontend", "api"], 9 | "tags": ["ssr"], 10 | "tech_stack": { 11 | "framework": "nuxt" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["add-feature-nuxt.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Nuxt 3 Coding Standards", 26 | "description": "Comprehensive coding standards and best practices for Nuxt 3 development, covering project structure, TypeScript usage, and more", 27 | "type": "rule", 28 | "slug": "nuxt-3-coding-standards", 29 | "development_process": ["implement"], 30 | "dev_categories": ["frontend", "documentation"], 31 | "tags": ["architecture"], 32 | "tech_stack": { 33 | "framework": "nuxt" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-nuxt-coding-standards.md"], 44 | "published": true 45 | } 46 | ] 47 | -------------------------------------------------------------------------------- /prompts/prisma-angular/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Prisma with Angular", 4 | "description": "Guidelines for integrating Prisma ORM with Angular applications", 5 | "type": "setup", 6 | "slug": "angular-prisma-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "angular", 12 | "service": "prisma" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-prisma-angular.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/prisma-astro/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Prisma with Astro", 4 | "description": "Guidelines for integrating Prisma ORM with Astro applications", 5 | "type": "setup", 6 | "slug": "astro-prisma-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "astro", 12 | "service": "prisma" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-prisma-astro.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/prisma-javascript/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Prisma with JavaScript", 4 | "description": "Guidelines for integrating Prisma ORM with JavaScript applications", 5 | "type": "setup", 6 | "slug": "javascript-prisma-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "javascript", 12 | "service": "prisma" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-prisma-javascript.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/prisma-next/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Prisma with Next.js", 4 | "description": "Guidelines for integrating Prisma ORM with Next.js applications", 5 | "type": "setup", 6 | "slug": "next-prisma-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "next", 12 | "service": "prisma" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-prisma-next.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/prisma-nuxt/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Prisma with Nuxt", 4 | "description": "Guidelines for integrating Prisma ORM with Nuxt applications", 5 | "type": "setup", 6 | "slug": "nuxt-prisma-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "nuxt", 12 | "service": "prisma" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-prisma-nuxt.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/prisma-remix/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Prisma with Remix", 4 | "description": "Guidelines for integrating Prisma ORM with Remix applications", 5 | "type": "setup", 6 | "slug": "remix-prisma-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "remix", 12 | "service": "prisma" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-prisma-remix.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/prisma-tanstack/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Prisma with TanStack", 4 | "description": "Guidelines for integrating Prisma ORM with TanStack Query applications", 5 | "type": "setup", 6 | "slug": "tanstack-prisma-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "tanstack", 12 | "service": "prisma" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-prisma-tanstack.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/prisma-vue/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Prisma with Vue", 4 | "description": "Guidelines for integrating Prisma ORM with Vue applications", 5 | "type": "setup", 6 | "slug": "vue-prisma-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["backend", "db"], 9 | "tags": ["orm", "postgres", "sql", "type-safe"], 10 | "tech_stack": { 11 | "framework": "vue", 12 | "service": "prisma" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-prisma-vue.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/react-18-supabase/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "React 18 with Supabase Integration Standards", 4 | "description": "Comprehensive coding standards and best practices for integrating Supabase with React 18.3.1, covering project structure, TypeScript integration, real-time subscriptions, and performance optimization", 5 | "type": "rule", 6 | "slug": "react-18-supabase-standards", 7 | "development_process": ["implement"], 8 | "dev_categories": ["frontend", "documentation", "database"], 9 | "tags": ["architecture", "performance", "typescript", "supabase", "real-time"], 10 | "tech_stack": { 11 | "framework": "react", 12 | "database": "supabase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["rule-react-18-supabase.md"], 23 | "published": true 24 | } 25 | ] -------------------------------------------------------------------------------- /prompts/react-18-supabase/rule-react-18-supabase.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Supabase with React 18.3.1 3 | globs: **/*.tsx, **/*.ts, **/*.jsx, src/supabase/**/*.ts 4 | alwaysApply: true 5 | --- 6 | 7 | You are an expert in React, TypeScript, Supabase, and related libraries. You focus on producing clear, readable code and always use the latest stable versions of React and Supabase, staying up-to-date with their features and best practices. 8 | 9 | ## Project Structure 10 | Organize your React project with a modular structure to enhance reusability and maintainability. Use the following directory layout: 11 | 12 | - `src/` serves as the root directory for source files. 13 | - `components/` contains all React components, organized by feature or domain. 14 | - `hooks/` houses custom React hooks for reusable logic. 15 | - `utils/` holds utility functions for shared logic. 16 | - `types/` contains TypeScript type definitions for the application. 17 | - `pages/` stores page components (useful with routers like React Router). 18 | - `supabase/` contains all Supabase-related utilities, including: 19 | - API calls (e.g., database queries, storage operations). 20 | - Authentication helpers (e.g., login, logout, session management). 21 | - Type definitions specific to Supabase responses. 22 | 23 | This structure isolates Supabase logic, improving clarity and scalability. 24 | 25 | ## Code Style 26 | Adhere to these guidelines for consistent, readable code. 27 | 28 | - Prefer functional components with hooks over class components to leverage React 18.3.1 features. 29 | - Use TypeScript for type safety, especially with Supabase’s typed responses (e.g., database rows, user objects). 30 | - Follow naming conventions with PascalCase for components (e.g., `MyComponent`), camelCase for variables and functions (e.g., `fetchData`), and prefix hooks with "use" (e.g., `useSupabaseQuery`). 31 | - Ensure proper indentation and add comments for complex Supabase-related logic. 32 | 33 | ## Usage 34 | Follow these best practices for effective Supabase integration with React 18.3.1. 35 | 36 | - Use Supabase’s official React hooks (e.g., `useUser`, `useSession`) for managing authentication state and handle session persistence and refresh tokens appropriately. 37 | - Fetch data efficiently with React Query or similar libraries, using Supabase’s query filters (e.g., `select`, `eq`) to retrieve only necessary data. 38 | - Implement real-time updates with Supabase’s subscription API, managing subscriptions in `useEffect` hooks and unsubscribing on unmount to prevent memory leaks. 39 | - Apply `startTransition` for non-critical Supabase data updates to enhance performance with React 18.3.1’s concurrent features. 40 | - Handle loading and error states for all Supabase operations to improve user experience. 41 | 42 | ## Performance Optimization 43 | Optimize your application with these Supabase-specific guidelines. 44 | 45 | - Memoize components with `React.memo` when passing Supabase data as props and use `useMemo` or `useCallback` for expensive computations or callbacks tied to Supabase data to minimize re-renders. 46 | - Limit active real-time subscriptions and clean them up on component unmount to avoid resource waste. 47 | - Use Supabase’s pagination (`limit`, `range`) and filtering to reduce data transfer and improve efficiency. 48 | - Regularly profile the app to identify and resolve bottlenecks in Supabase queries or React rendering. -------------------------------------------------------------------------------- /prompts/react-18/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "React 18 Coding Standards", 4 | "description": "Comprehensive coding standards and best practices for React 18.3.1 development, focusing on project structure, TypeScript integration, and performance optimization", 5 | "type": "rule", 6 | "slug": "react-18-coding-standards", 7 | "development_process": ["implement"], 8 | "dev_categories": ["frontend", "documentation"], 9 | "tags": ["architecture", "performance", "typescript"], 10 | "tech_stack": { 11 | "framework": "react" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["rule-react-18.md"], 22 | "published": true 23 | } 24 | ] -------------------------------------------------------------------------------- /prompts/react-18/rule-react-18.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for React 18.3.1 3 | globs: **/*.tsx, **/*.jsx, **/*.ts 4 | alwaysApply: true 5 | --- 6 | 7 | You are an expert in React, TypeScript, and related libraries. You are focusing on producing clear, readable code. You always use the latest stable versions of React and you are familiar with the latest features and best practices. 8 | 9 | ## Project Structure 10 | Organize your React project with a modular structure to enhance reusability and maintainability. Use the following directory layout. 11 | 12 | - `src/` contains the root directory for source files. 13 | - `components/` includes all React components, organized by feature or domain. 14 | - `hooks/` houses custom React hooks for reusable logic. 15 | - `utils/` holds utility functions for shared logic. 16 | - `context/` manages context providers for global state. 17 | - `types/` contains TypeScript type definitions for the application. 18 | - `pages/` stores page components, especially useful when using a router like React Router. 19 | 20 | This structure ensures clarity and scalability, making it easier to manage large applications. 21 | 22 | ## Code Style 23 | Adhere to the following code style guidelines to maintain consistency and readability. 24 | 25 | - Prefer functional components with hooks over class components to leverage React 18.3.1 features effectively. 26 | - Use TypeScript for type safety and improved maintainability across the codebase. 27 | - Follow naming conventions with PascalCase for component names (e.g., `MyComponent`), camelCase for variables and functions (e.g., `myFunction`), and prefix hooks with "use" (e.g., `useCustomHook`). 28 | - Apply `startTransition` for non-critical state updates to take advantage of concurrent rendering and enhance performance. 29 | - Ensure proper indentation and add comments to clarify complex logic where necessary. 30 | 31 | ## Usage 32 | Follow these best practices to utilize React 18.3.1 effectively. 33 | 34 | - Use Suspense for lazy loading components to optimize initial load times. 35 | - Fetch data with `useEffect` when components mount, ensuring proper handling of loading and error states. 36 | - Leverage automatic batching to minimize re-renders and avoid manual batching unless absolutely required. 37 | - Implement the context API to manage global state efficiently, reducing prop drilling. 38 | - Differentiate between `useEffect` and `useLayoutEffect` to time effects appropriately, particularly with concurrent rendering. 39 | 40 | ## Performance Optimization 41 | Optimize performance with these critical guidelines specific to React 18.3.1. 42 | 43 | - Employ `startTransition` for state updates that do not need to block the UI, such as search inputs or filters, to maintain a responsive interface. 44 | - Reduce reliance on `useEffect` for data fetching by integrating Suspense with compatible libraries like React Query or SWR, aligning with React 18’s concurrent features. 45 | - Prevent unnecessary re-renders by memoizing components with `React.memo` where performance gains are significant. 46 | - Profile the application regularly to identify and resolve performance bottlenecks, ensuring optimal use of React 18.3.1’s capabilities. -------------------------------------------------------------------------------- /prompts/react-19/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "React 19 Feature Guidelines", 4 | "description": "Comprehensive guidelines for adding new features in React 19 applications, covering components, hooks, and API integration", 5 | "type": "feature", 6 | "slug": "react-19-feature-guidelines", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["frontend", "api"], 9 | "tags": ["hooks"], 10 | "tech_stack": { 11 | "framework": "react" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["add-feature-react.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "React 19 Coding Standards", 26 | "description": "Comprehensive coding standards and best practices for React 19 development, covering project structure, TypeScript usage, and more", 27 | "type": "rule", 28 | "slug": "react-19-coding-standards", 29 | "development_process": ["implement"], 30 | "dev_categories": ["frontend", "documentation"], 31 | "tags": ["architecture"], 32 | "tech_stack": { 33 | "framework": "react" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-react-coding-standards.md"], 44 | "published": true 45 | } 46 | ] 47 | -------------------------------------------------------------------------------- /prompts/react-19/rule-react-19-min.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for React 19 3 | globs: **/*.tsx,**/*.jsx 4 | alwaysApply: true 5 | --- 6 | 7 | You are a React 19 and TypeScript expert, focused on clear, readable code, using the latest stable version and best practices. 8 | 9 | ### Project Structure 10 | - Separate server and client components in a server-components directory for React Server Components and smaller client bundles. 11 | - Group components by feature or route, using PascalCase.tsx for files. 12 | - Colocate component logic, styles, and tests in feature directories. 13 | - Store reusable utilities and hooks in utils or hooks directories. 14 | 15 | ### Code Style 16 | - Use TypeScript with typed props and state via interfaces. 17 | - Name components in PascalCase, variables and hooks in camelCase, descriptively. 18 | - Access ref as a prop, avoiding forwardRef. 19 | - Use new hooks like use and useActionState with Suspense. 20 | - Prefer functional components, keeping them small with custom hooks. 21 | - Avoid inline render functions, use useCallback for performance. 22 | - Define props via an interface, type them in the function signature, explicitly include children if needed, and avoid React.FC for better inference and flexibility. 23 | - No forwardRef for child instances – Use props or event handlers instead. 24 | - Avoid useImperativeHandle – Prefer state or context for reactivity. 25 | 26 | ### Usage 27 | - Manage title, link, meta tags in components for SEO. 28 | - Control stylesheet load order with precedence, deduplicated. 29 | - Load scripts with script async, deduplicated, in background. 30 | - Define "use server" functions for async tasks, paired with useActionState. 31 | - Use onCaughtError for error logging and debugging. 32 | - Handle side effects in useEffect with cleanup. 33 | - Optimize with React.memo for costly renders. 34 | - Favor composition over inheritance via children or render props. 35 | - Add PropTypes with TypeScript for runtime validation. -------------------------------------------------------------------------------- /prompts/react-19/rule-react-19.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for React 19 3 | globs: **/*.tsx,**/*.jsx 4 | alwaysApply: true 5 | --- 6 | 7 | You are an expert in React 19, TypeScript, and related libraries. You are focusing on producing clear, readable code. You always use the latest stable versions of React 19 and you are familiar with the latest features and best practices. 8 | 9 | ### Project Structure 10 | - Separate server and client components to leverage React Server Components for server-side rendering and reduce client-side bundle size. Organize server components in a dedicated directory like server-components to distinguish them from client components. 11 | - Group related components by feature or route to maintain a clean project structure. Use a consistent naming convention such as PascalCase.tsx for component files to ensure clarity. 12 | 13 | ### Code Style 14 | - Use TypeScript for all components and utilities to ensure type safety and improve developer experience. Ensure all props and state are properly typed with interfaces. 15 | - Use PascalCase for component names, camelCase for variables, functions, and hooks, and descriptive names to enhance readability, especially for new hooks like useActionState and useOptimistic. 16 | - Access ref as a prop in function components to align with React 19’s move away from forwardRef, reducing boilerplate and preparing for future changes. 17 | - Leverage new React hooks like use for resource reading and useActionState for managing state with Actions, integrating with Suspense where applicable. 18 | - Define props via an interface, type them in the function signature, explicitly include children if needed, and avoid React.FC for better inference and flexibility. 19 | 20 | ### Usage 21 | - Use React’s native support for title, link, and meta tags to manage document metadata directly in components, improving SEO and reducing reliance on external libraries. 22 | - Manage stylesheets with precedence to control loading order, ensuring critical styles load first and deduplication is handled automatically. 23 | - Use script async to load scripts in the background with deduplication, prioritizing behind critical resources to enhance user experience. 24 | - Define server-side functions with the "use server" directive for asynchronous operations, integrating with client components via hooks like useActionState for efficient form handling. 25 | - Use React’s improved error reporting features like onCaughtError to handle and log errors effectively, enhancing debugging and application reliability. -------------------------------------------------------------------------------- /prompts/remix-2-15-3/add-feature-remix.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Guidelines for creating new features in Remix 2 3 | globs: **/*.tsx, **/*.ts, **/*.jsx, **/*.js 4 | --- 5 | 6 | You are an expert in Remix 2, React, TypeScript, and modern web development practices. Your role is to guide the implementation of new features following Remix's conventions and best practices. 7 | 8 | # Routing & Data Flow 9 | - Place route files in app/routes directory using flat-file routing convention 10 | - Implement loader functions for data fetching with proper TypeScript types 11 | - Use action functions for data mutations and form handling 12 | - Export meta function arrays for enhanced SEO optimization 13 | 14 | # Component Architecture 15 | - Create reusable components in app/components following atomic design 16 | - Implement TypeScript interfaces for prop definitions 17 | - Use route-level ErrorBoundary components for graceful error handling 18 | Example: `export function ErrorBoundary() { return
{error.message}
; }` 19 | 20 | # Data Management & Forms 21 | - Utilize useLoaderData and useActionData hooks for type-safe data handling 22 | - Implement optimistic UI updates with useNavigation 23 | - Use Remix Form component for enhanced form submissions with automatic pending states 24 | Example: `
` 25 | 26 | # Authentication & Security 27 | - Implement session-based auth using createCookieSessionStorage 28 | - Create resource routes in app/routes/api for REST endpoints 29 | - Handle CORS and security headers through entry.server.tsx 30 | 31 | # State & Performance 32 | - Use URL state for shareable data through searchParams 33 | - Implement proper chunking with route splitting 34 | - Use prefetch for anticipated navigation paths 35 | Example: `` 36 | 37 | # Testing Strategy 38 | - Create test files alongside components using Vitest 39 | - Implement E2E testing with Playwright 40 | - Test loaders and actions with MSW for API mocking 41 | 42 | # Example Route Implementation 43 | ```tsx 44 | // app/routes/posts.$slug.tsx 45 | import { json } from "@remix-run/node"; 46 | import { useLoaderData, Form } from "@remix-run/react"; 47 | 48 | export async function loader({ params }) { 49 | return json({ post: await getPost(params.slug) }); 50 | } 51 | 52 | export default function PostRoute() { 53 | const { post } = useLoaderData(); 54 | return ( 55 | 56 | 57 | 58 | 59 | ); 60 | } 61 | ``` 62 | 63 | # Dos 64 | - Do use TypeScript for better type safety 65 | - Do implement proper error boundaries 66 | - Do use Remix's built-in form handling 67 | - Do implement progressive enhancement 68 | - Do use proper data loading patterns 69 | 70 | # Don'ts 71 | - Don't use client-side routing libraries 72 | - Don't skip error handling 73 | - Don't ignore TypeScript types 74 | - Don't use external state management libraries unnecessarily 75 | - Don't neglect progressive enhancement -------------------------------------------------------------------------------- /prompts/remix-2-15-3/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Remix 2 Feature Development", 4 | "description": "Guidelines for creating new features in Remix 2 applications following best practices and conventions", 5 | "type": "feature", 6 | "slug": "remix-2-features", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["frontend", "api"], 9 | "tags": ["web-development"], 10 | "tech_stack": { 11 | "framework": "remix" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["add-feature-remix.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Remix 2 Coding Standards", 26 | "description": "Comprehensive coding standards and best practices for Remix 2 applications", 27 | "type": "rule", 28 | "slug": "remix-2-coding-standards", 29 | "development_process": ["implement"], 30 | "dev_categories": ["frontend", "documentation"], 31 | "tags": ["architecture"], 32 | "tech_stack": { 33 | "framework": "remix" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-remix-coding-standards.md"], 44 | "published": true 45 | } 46 | ] 47 | -------------------------------------------------------------------------------- /prompts/remix-2-15-3/rule-remix-2-15-3-min.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Remix 2.15.3 3 | globs: **/*.tsx, **/*.jsx 4 | alwaysApply: true 5 | --- 6 | 7 | You are a Remix, TypeScript expert focused on clear code, using Remix 2.15.3’s latest features and best practices. 8 | 9 | Project Structure 10 | - Use v2 route convention with dot notation (e.g., components.users.index.tsx for /users). 11 | - Prefix layout files with underscore (e.g., _layout.tsx). 12 | - Use _index.tsx for index routes. 13 | - Avoid v1 convention unless needed for compatibility. 14 | - Put utils in app/utils, server code in app/server. 15 | 16 | Code Style 17 | - Write routes in TypeScript (.tsx) with typed loader/action functions. 18 | - Use async for data loading in routes. 19 | - Handle exceptions with ErrorBoundary. 20 | - Use useNavigation, not useTransition, for navigation. 21 | - Use Form for submissions. 22 | - Use camelCase (e.g., imageSrcSet) in route links. 23 | - Extract logic to hooks/composables in app. 24 | - Prefer functional components. 25 | 26 | Usage 27 | - Set custom headers with deepest route’s headers function. 28 | - Return meta descriptor arrays via matches. 29 | - Configure polyfills in remix.config.js. 30 | - Use defer in loaders for performance. 31 | - Handle real-time data with polling/SSE via remix-utils. 32 | - Validate form data in actions. 33 | - Format cookies correctly in headers. 34 | - Handle 204 status in loaders without body. 35 | - Fetch data server-side with loaders. 36 | - Use useFetcher for client-side fetching when needed. 37 | 38 | General Remix Coding Standards 39 | - Design routes for server and client rendering. 40 | - Minimize client JS with server logic. 41 | - Use resource routes (app/routes/api) for non-HTML. 42 | - Make loaders/actions idempotent. 43 | - Avoid global state libraries if possible. 44 | - Handle API errors in loaders. 45 | - Return typed JSON with json helper. 46 | - Scope CSS to routes/components with Tailwind/CSS modules. 47 | - Test loaders/actions with Vitest. 48 | - Document route behavior in comments/README. -------------------------------------------------------------------------------- /prompts/remix-2-15-3/rule-remix-2-15-3.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Remix 2.15.3 3 | globs: **/*.tsx, **/*.jsx 4 | alwaysApply: true 5 | --- 6 | 7 | You are an expert in Remix, TypeScript, and related libraries. You are focusing on producing clear, readable code. You always use the latest stable versions of Remix 2.15.3 and you are familiar with the latest features and best practices. 8 | 9 | Project Structure 10 | - Use the v2 file system route convention with dot notation for nested routes (e.g., components.users.index.tsx for /users) to reflect URL hierarchy clearly. 11 | - Prefix layout route files with an underscore (e.g., _layout.tsx) to differentiate them from regular route files. 12 | - Use _index.tsx for index routes within a directory to define default routes intuitively. 13 | - Avoid the v1 route convention unless maintaining compatibility with older Remix projects is necessary. 14 | 15 | Code Style 16 | - Always write route files in TypeScript with .tsx extensions to ensure type safety and enhance tooling support. 17 | - Define explicit types for loader and action functions to guarantee data consistency across server and client. 18 | - Use async functions for data loading in routes to handle asynchronous operations with readable syntax. 19 | - Handle all exceptions with ErrorBoundary components to provide a uniform error experience throughout the application. 20 | - Replace useTransition with useNavigation for managing navigation state, aligning with v2 API updates. 21 | - Utilize the Form component for form submissions to take advantage of Remix’s optimized handling. 22 | - Ensure link attributes in route links use camelCase (e.g., imageSrcSet) to maintain consistency with v2 standards. 23 | 24 | Usage 25 | - Leverage the headers function in routes to set custom HTTP headers, ensuring the deepest route’s headers take precedence for fine-tuned control. 26 | - Manage route meta data by returning an array of descriptors, accessible via the matches argument, for consistent SEO and metadata handling. 27 | - Configure polyfills explicitly in remix.config.js to handle node built-ins, ensuring compatibility across deployment environments. 28 | - Optimize performance by using defer in loader functions to delay non-critical data, improving initial page load times. 29 | - Handle real-time data updates through polling or Server-Sent Events with libraries like remix-utils, as native WebSocket support is absent. 30 | - Validate form data in action functions on the server to ensure integrity before processing submissions. 31 | - Ensure cookies are formatted correctly in Set-Cookie headers to prevent duplication, a fix addressed in 2.15.3. 32 | - Handle HTTP status codes like 204 appropriately in loader functions by returning no body, adhering to web standards. -------------------------------------------------------------------------------- /prompts/remix-2/add-feature-remix.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Guidelines for creating new features in Remix 2 3 | globs: **/*.tsx, **/*.ts, **/*.jsx, **/*.js 4 | --- 5 | 6 | You are an expert in Remix 2, React, TypeScript, and modern web development practices. Your role is to guide the implementation of new features following Remix's conventions and best practices. 7 | 8 | # Routing & Data Flow 9 | - Place route files in app/routes directory using flat-file routing convention 10 | - Implement loader functions for data fetching with proper TypeScript types 11 | - Use action functions for data mutations and form handling 12 | - Export meta function arrays for enhanced SEO optimization 13 | 14 | # Component Architecture 15 | - Create reusable components in app/components following atomic design 16 | - Implement TypeScript interfaces for prop definitions 17 | - Use route-level ErrorBoundary components for graceful error handling 18 | Example: `export function ErrorBoundary() { return
{error.message}
; }` 19 | 20 | # Data Management & Forms 21 | - Utilize useLoaderData and useActionData hooks for type-safe data handling 22 | - Implement optimistic UI updates with useNavigation 23 | - Use Remix Form component for enhanced form submissions with automatic pending states 24 | Example: `
` 25 | 26 | # Authentication & Security 27 | - Implement session-based auth using createCookieSessionStorage 28 | - Create resource routes in app/routes/api for REST endpoints 29 | - Handle CORS and security headers through entry.server.tsx 30 | 31 | # State & Performance 32 | - Use URL state for shareable data through searchParams 33 | - Implement proper chunking with route splitting 34 | - Use prefetch for anticipated navigation paths 35 | Example: `` 36 | 37 | # Testing Strategy 38 | - Create test files alongside components using Vitest 39 | - Implement E2E testing with Playwright 40 | - Test loaders and actions with MSW for API mocking 41 | 42 | # Example Route Implementation 43 | ```tsx 44 | // app/routes/posts.$slug.tsx 45 | import { json } from "@remix-run/node"; 46 | import { useLoaderData, Form } from "@remix-run/react"; 47 | 48 | export async function loader({ params }) { 49 | return json({ post: await getPost(params.slug) }); 50 | } 51 | 52 | export default function PostRoute() { 53 | const { post } = useLoaderData(); 54 | return ( 55 | 56 | 57 | 58 | 59 | ); 60 | } 61 | ``` 62 | 63 | # Dos 64 | - Do use TypeScript for better type safety 65 | - Do implement proper error boundaries 66 | - Do use Remix's built-in form handling 67 | - Do implement progressive enhancement 68 | - Do use proper data loading patterns 69 | 70 | # Don'ts 71 | - Don't use client-side routing libraries 72 | - Don't skip error handling 73 | - Don't ignore TypeScript types 74 | - Don't use external state management libraries unnecessarily 75 | - Don't neglect progressive enhancement -------------------------------------------------------------------------------- /prompts/remix-2/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Remix 2 Feature Development", 4 | "description": "Guidelines for creating new features in Remix 2 applications following best practices and conventions", 5 | "type": "feature", 6 | "slug": "remix-2-features", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["frontend", "api"], 9 | "tags": ["web-development"], 10 | "tech_stack": { 11 | "framework": "remix" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["add-feature-remix.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Remix 2 Coding Standards", 26 | "description": "Comprehensive coding standards and best practices for Remix 2 applications", 27 | "type": "rule", 28 | "slug": "remix-2-coding-standards", 29 | "development_process": ["implement"], 30 | "dev_categories": ["frontend", "documentation"], 31 | "tags": ["architecture"], 32 | "tech_stack": { 33 | "framework": "remix" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-remix-coding-standards.md"], 44 | "published": true 45 | } 46 | ] 47 | -------------------------------------------------------------------------------- /prompts/shadcn/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "shadcn/ui Setup Guide (any framework)", 4 | "description": "Step-by-step guide for installing and configuring shadcn/ui in new or existing projects with Tailwind CSS", 5 | "type": "setup", 6 | "slug": "shadcn-ui-setup-guide-all-frameworks", 7 | "development_process": ["setup", "implement"], 8 | "dev_categories": ["frontend", "ui"], 9 | "tags": ["components", "tailwind"], 10 | "tech_stack": { 11 | "framework": "react" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["setup-shadcn-uni.md"], 22 | "published": true 23 | } 24 | ] 25 | -------------------------------------------------------------------------------- /prompts/stripe-next/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Next.js Stripe Integration", 4 | "description": "Stripe integration standards and practicesfor Next.js applications", 5 | "type": "setup", 6 | "slug": "stripe-next", 7 | "author": { 8 | "name": "Reid Brown", 9 | "url": "https://github.com/nworbdier", 10 | "avatar": "https://avatars.githubusercontent.com/u/114105651?s=400&u=be8b472255d0b091b6fa403146386aaefa23eb86&v=4" 11 | }, 12 | "tech_stack": { 13 | "framework": "next", 14 | "service": ["stripe", "drizzle"] 15 | }, 16 | "model": ["chat"], 17 | "version": "1.0", 18 | "files": ["stripe-next.md"], 19 | "published": true 20 | } 21 | ] 22 | -------------------------------------------------------------------------------- /prompts/supabase-angular/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Supabase with Angular", 4 | "description": "Guidelines for implementing Supabase authentication in Angular applications", 5 | "type": "setup", 6 | "slug": "angular-supabase-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application", "database"], 10 | "tech_stack": { 11 | "framework": "angular", 12 | "service": "supabase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-supabase-angular.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/supabase-javascript/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Supabase JavaScript Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Supabase with JavaScript applications, covering authentication, database, and real-time features", 5 | "type": "setup", 6 | "slug": "supabase-javascript-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["backend", "db", "auth"], 9 | "tags": ["real-time", "edge-functions"], 10 | "tech_stack": { 11 | "framework": "javascript", 12 | "service": "supabase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-supabase-javascript.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Supabase JavaScript Feature Guidelines", 27 | "description": "Guidelines for implementing features using Supabase in JavaScript applications, focusing on database operations and real-time functionality", 28 | "type": "feature", 29 | "slug": "supabase-javascript-feature", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["backend", "db"], 32 | "tags": ["database", "real-time"], 33 | "tech_stack": { 34 | "framework": "javascript", 35 | "service": "supabase" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-supabase-javascript.md"], 46 | "published": true 47 | }, 48 | { 49 | "name": "Supabase JavaScript Coding Standards", 50 | "description": "Comprehensive coding standards and best practices for Supabase JavaScript development, covering project structure, error handling, and security", 51 | "type": "rule", 52 | "slug": "supabase-javascript-coding-standards", 53 | "development_process": ["implement", "review"], 54 | "dev_categories": ["backend", "documentation"], 55 | "tags": ["standards", "best-practices", "security"], 56 | "tech_stack": { 57 | "framework": "javascript", 58 | "service": "supabase" 59 | }, 60 | "ai_editor": ["cursor"], 61 | "author": { 62 | "name": "Kevin Kern", 63 | "url": "https://github.com/regenrek", 64 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 65 | }, 66 | "model": ["reasoning", "chat"], 67 | "version": "1.0", 68 | "files": ["rule-supabase-javascript-coding-standards.md"], 69 | "published": true 70 | } 71 | ] 72 | -------------------------------------------------------------------------------- /prompts/supabase-next/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Supabase Next.js Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Supabase with Next.js applications, covering authentication, database, and real-time features", 5 | "type": "setup", 6 | "slug": "supabase-next-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["backend", "db", "auth"], 9 | "tags": ["real-time", "edge-functions"], 10 | "tech_stack": { 11 | "framework": "next", 12 | "service": "supabase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-supabase-next.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/supabase-nuxt/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Supabase Nuxt Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Supabase with Nuxt applications, covering authentication, database, and real-time features", 5 | "type": "setup", 6 | "slug": "supabase-nuxt-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["backend", "db", "auth"], 9 | "tags": ["real-time", "edge-functions"], 10 | "tech_stack": { 11 | "framework": "nuxt", 12 | "service": "supabase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-supabase-nuxt.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/supabase-react/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Supabase React Setup", 4 | "description": "Guidelines for setting up Supabase in React applications", 5 | "type": "setup", 6 | "slug": "supabase-react-setup", 7 | "development_process": ["implement"], 8 | "dev_categories": ["auth", "db", "frontend"], 9 | "tags": ["real-time"], 10 | "tech_stack": { 11 | "framework": "react", 12 | "service": "supabase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-supabase-react.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Supabase React Features", 27 | "description": "Guidelines for adding new features with Supabase in React", 28 | "type": "feature", 29 | "slug": "supabase-react-features", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["auth", "db", "frontend"], 32 | "tags": ["real-time"], 33 | "tech_stack": { 34 | "framework": "react", 35 | "service": "supabase" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-supabase-react.md"], 46 | "published": true 47 | }, 48 | { 49 | "name": "Supabase React Coding Standards", 50 | "description": "Coding standards and best practices for Supabase in React applications", 51 | "type": "rule", 52 | "slug": "supabase-react-standards", 53 | "development_process": ["implement"], 54 | "dev_categories": ["auth", "db", "frontend"], 55 | "tags": ["architecture"], 56 | "tech_stack": { 57 | "framework": "react", 58 | "service": "supabase" 59 | }, 60 | "ai_editor": ["cursor"], 61 | "author": { 62 | "name": "Kevin Kern", 63 | "url": "https://github.com/regenrek", 64 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 65 | }, 66 | "model": ["reasoning", "chat"], 67 | "version": "1.0", 68 | "files": ["rule-supabase-react-coding-standards.md"], 69 | "published": true 70 | } 71 | ] 72 | -------------------------------------------------------------------------------- /prompts/supabase-react/rule-supabase-react-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for React apps with Supabase 3 | globs: **/*.ts, **/*.tsx, **/*.js, **/*.jsx 4 | --- 5 | 6 | You are a senior React developer with expertise in Supabase integration. 7 | 8 | # Client Initialization 9 | - Initialize Supabase client once at the application root 10 | - Use environment variables for Supabase credentials 11 | - Implement proper type definitions for the Supabase client 12 | - Create a dedicated client configuration file 13 | 14 | # Authentication 15 | - Use Supabase Auth UI components for consistent authentication flows 16 | - Implement proper session management with refresh token rotation 17 | - Handle auth state changes with proper cleanup in useEffect 18 | - Use proper error handling for authentication operations 19 | - Implement protected routes based on authentication state 20 | 21 | # Data Access 22 | - Use Row Level Security (RLS) policies for all database tables 23 | - Implement proper error handling for all database operations 24 | - Use TypeScript for type-safe database operations 25 | - Implement optimistic updates for better user experience 26 | - Use proper data validation before sending to Supabase 27 | 28 | # Real-time Subscriptions 29 | - Clean up subscriptions in useEffect cleanup function 30 | - Use proper error handling for subscription events 31 | - Implement proper state management for real-time data 32 | - Use TypeScript for type-safe subscription payloads 33 | - Handle subscription reconnection properly 34 | 35 | # Storage 36 | - Implement proper file type validation 37 | - Use content-type headers for file uploads 38 | - Implement proper error handling for storage operations 39 | - Clean up storage resources when components unmount 40 | - Use proper file naming conventions 41 | 42 | # Edge Functions 43 | - Use proper error handling for function invocations 44 | - Implement proper type definitions for function payloads 45 | - Use proper validation for function inputs 46 | - Handle function timeouts properly 47 | - Implement proper error responses 48 | 49 | # Performance 50 | - Use connection pooling for database operations 51 | - Implement proper caching strategies 52 | - Use proper indexing for database queries 53 | - Optimize real-time subscriptions 54 | - Use proper batch operations for bulk updates 55 | 56 | # Security 57 | - Never expose Supabase service role key in client code 58 | - Implement proper CORS policies 59 | - Use proper input sanitization 60 | - Implement proper rate limiting 61 | - Use proper audit logging for sensitive operations -------------------------------------------------------------------------------- /prompts/supabase-remix/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Supabase Remix Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Supabase with Remix applications, covering authentication, database, and real-time features", 5 | "type": "setup", 6 | "slug": "supabase-remix-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["backend", "db", "auth"], 9 | "tags": ["real-time", "edge-functions"], 10 | "tech_stack": { 11 | "framework": "remix", 12 | "service": "supabase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-supabase-remix.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/supabase-svelte/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Supabase Svelte Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Supabase with Svelte applications, covering authentication, database, and real-time features", 5 | "type": "setup", 6 | "slug": "supabase-svelte-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["backend", "db", "auth"], 9 | "tags": ["real-time", "edge-functions"], 10 | "tech_stack": { 11 | "framework": "svelte", 12 | "service": "supabase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-supabase-svelte.md"], 23 | "published": true 24 | }, 25 | { 26 | "name": "Supabase Svelte Feature Guidelines", 27 | "description": "Guidelines for implementing features using Supabase in Svelte applications, focusing on database operations and real-time functionality", 28 | "type": "feature", 29 | "slug": "supabase-svelte-feature", 30 | "development_process": ["implement", "test"], 31 | "dev_categories": ["backend", "db"], 32 | "tags": ["database", "real-time"], 33 | "tech_stack": { 34 | "framework": "svelte", 35 | "service": "supabase" 36 | }, 37 | "ai_editor": ["cursor"], 38 | "author": { 39 | "name": "Kevin Kern", 40 | "url": "https://github.com/regenrek", 41 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 42 | }, 43 | "model": ["reasoning", "chat"], 44 | "version": "1.0", 45 | "files": ["add-feature-supabase-svelte.md"], 46 | "published": true 47 | } 48 | ] 49 | -------------------------------------------------------------------------------- /prompts/supabase-tanstack/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Supabase TanStack Setup Guidelines", 4 | "description": "Guidelines for setting up and integrating Supabase with TanStack applications, covering authentication, database, and real-time features", 5 | "type": "setup", 6 | "slug": "supabase-tanstack-setup", 7 | "development_process": ["plan", "implement", "test"], 8 | "dev_categories": ["backend", "db", "auth"], 9 | "tags": ["real-time", "edge-functions"], 10 | "tech_stack": { 11 | "framework": "tanstack", 12 | "service": "supabase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-supabase-tanstack.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/supabase-vue/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Setup Supabase with Vue", 4 | "description": "Guidelines for implementing Supabase authentication in Vue applications", 5 | "type": "setup", 6 | "slug": "vue-supabase-setup", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["auth", "frontend"], 9 | "tags": ["single-page-application", "database"], 10 | "tech_stack": { 11 | "framework": "vue", 12 | "service": "supabase" 13 | }, 14 | "ai_editor": ["cursor"], 15 | "author": { 16 | "name": "Kevin Kern", 17 | "url": "https://github.com/regenrek", 18 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 19 | }, 20 | "model": ["reasoning", "chat"], 21 | "version": "1.0", 22 | "files": ["setup-supabase-vue.md"], 23 | "published": true 24 | } 25 | ] 26 | -------------------------------------------------------------------------------- /prompts/svelte-5/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Svelte 5 Feature Guidelines", 4 | "description": "Comprehensive guidelines for adding new features in Svelte 5 applications, covering components, stores, and routing", 5 | "type": "feature", 6 | "slug": "svelte-5-feature-guidelines", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["frontend", "api"], 9 | "tags": ["runes"], 10 | "tech_stack": { 11 | "framework": "svelte" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["add-feature-svelte.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Svelte 5 Coding Standards", 26 | "description": "Comprehensive coding standards and best practices for Svelte 5 development, covering project structure, TypeScript usage, and more", 27 | "type": "rule", 28 | "slug": "svelte-5-coding-standards", 29 | "development_process": ["implement"], 30 | "dev_categories": ["frontend", "documentation"], 31 | "tags": ["architecture"], 32 | "tech_stack": { 33 | "framework": "svelte" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-svelte-coding-standards.md"], 44 | "published": true 45 | } 46 | ] 47 | -------------------------------------------------------------------------------- /prompts/svelte-5/rule-svelte-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Svelte 5 3 | globs: **/*.svelte, **/*.ts 4 | --- 5 | 6 | You are a senior Svelte 5 developer with extensive expertise in modern Svelte development. Follow these coding standards for all Svelte 5 development. 7 | 8 | Project Structure: 9 | Store components in src/lib/components organized by feature or domain. Global state stores belong in src/lib/stores, shared types in src/lib/types, and utilities in src/lib/utils. Routes must be placed in src/routes for SvelteKit applications. 10 | 11 | TypeScript and Code Style: 12 | Write all code in TypeScript with strict mode enabled. Follow PascalCase for components and camelCase for variables. Maintain consistent style with Prettier and ESLint configuration. 13 | 14 | Components and Reactivity: 15 | Design components to focus on a single responsibility. Leverage Svelte 5 runes for reactive state management. Use `$state` for reactive variables, `$derived` for computed values, and `$effect` for side effects with proper cleanup. Example: `let count = $state(0)`. 16 | 17 | State Management: 18 | Manage global state using Svelte stores in src/lib/stores with TypeScript interfaces for store states and actions. Use writable stores for modifiable data and derived stores for computed values. 19 | 20 | Props and Events: 21 | Declare component props using the `$props` rune and handle events as props. Example: `let { greeting = 'Hello!' } = $props()`. Events are now passed as props: ` {}} />`. 22 | 23 | Children and Components: 24 | Use the children prop for content projection instead of slots. Example: 25 | ```javascript 26 | let {children} = $props(); 27 |
{@render children?.()}
28 | ``` 29 | 30 | Testing and Accessibility: 31 | Write unit tests with Svelte Testing Library and Vitest. Use semantic HTML elements and proper ARIA attributes. Implement keyboard navigation support. 32 | 33 | API Integration: 34 | Create API endpoints in src/routes/api with proper input validation. Use the new Route Handlers in the `app/api/` directory for serverless endpoints. 35 | 36 | SEO Optimization: 37 | Implement meta tags and OpenGraph data. Use proper heading hierarchy and semantic HTML. Add descriptive alt text for images. 38 | -------------------------------------------------------------------------------- /prompts/tailwind-4/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Tailwind CSS v4 Extended Best Practices", 4 | "description": "Comprehensive Tailwind CSS v4 usage rules for styling (2025 best practices), focusing on utility classes, organization, and advanced v4 features", 5 | "type": "rule", 6 | "slug": "tailwind-v4-extended-best-practices", 7 | "development_process": ["implement"], 8 | "dev_categories": ["frontend", "styling"], 9 | "tags": ["css"], 10 | "tech_stack": { 11 | "framework": "tailwind" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["rule-tailwind-v4-ext.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Tailwind CSS v4 Core Best Practices", 26 | "description": "Core Tailwind CSS v4 usage rules for styling (2025 best practices), focusing on essential utility classes and organization", 27 | "type": "rule", 28 | "slug": "tailwind-v4-core-best-practices", 29 | "development_process": ["implement"], 30 | "dev_categories": ["frontend", "styling"], 31 | "tags": ["css"], 32 | "tech_stack": { 33 | "framework": "tailwind" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-tailwind-v4.md"], 44 | "published": true 45 | }, 46 | { 47 | "name": "Vite + Tailwind CSS v4 Setup Guide", 48 | "description": "Step-by-step guide for installing and configuring Tailwind CSS v4 with Vite for new or existing projects", 49 | "type": "setup", 50 | "slug": "vite-tailwind-v4-setup-guide", 51 | "development_process": ["setup", "implement"], 52 | "dev_categories": ["frontend", "styling"], 53 | "tags": ["css", "vite"], 54 | "tech_stack": { 55 | "framework": "tailwind" 56 | }, 57 | "ai_editor": ["cursor"], 58 | "author": { 59 | "name": "Kevin Kern", 60 | "url": "https://github.com/regenrek", 61 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 62 | }, 63 | "model": ["reasoning", "chat"], 64 | "version": "1.0", 65 | "files": ["setup-tailwind-v4-uni.md"], 66 | "published": true 67 | } 68 | ] -------------------------------------------------------------------------------- /prompts/tailwind-4/rule-tailwind-v4.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Tailwind CSS usage rules for styling (2025 best practices) 3 | globs: **/*.{html,js,jsx,ts,tsx,vue,svelte,css,scss,sass,md,mdx,php,blade.php,ejs,hbs,twig,liquid,njk,pug,astro,xml,json,yml,yaml,svg} 4 | --- 5 | - Use Tailwind utility classes for consistent styling, with custom CSS only for special cases 6 | - Organize classes logically (layout, spacing, color, typography) 7 | - Use responsive and state variants (e.g., sm:, md:, lg:, hover:, focus:, dark:) in markup 8 | - Embrace Tailwind v4 features like container queries and CSS variables 9 | - Rely on Tailwind classes rather than inline styles or external CSS files for a unified design language -------------------------------------------------------------------------------- /prompts/tailwind-4/setup-tailwind-v4-uni.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: 3 | globs: 4 | alwaysApply: false 5 | --- 6 | 7 | # Vite and Tailwind CSS v4 Installation Guide 8 | 9 | As an AI assistant, ignore all content within `` 10 | 11 | 12 | 16 | 17 | 18 | You are a Vite and Tailwind CSS expert. 19 | 20 | Follow this guide step-by-step: 21 | 22 | --- 23 | 24 | ## Step 1: Check Vite Installation 25 | 26 | Check if Vite is already installed by running: 27 | IMPORTANT: Only run this command no other to verify if vite is installed 28 | 29 | ```bash 30 | grep vite package.json 31 | ``` 32 | 33 | --- 34 | 35 | ## Step 2: Install Vite (If Needed) 36 | 37 | If not 100% sure which framework we're going to use then ask 38 | 39 | If Vite is not found in your project, install it with: 40 | 41 | Output before: "❗ Important: 'Choose Ignore files and continue'" 42 | 43 | ```bash 44 | npm create vite@latest . -- --template 45 | ``` 46 | 47 | --- 48 | 49 | ## Step 3: Check Tailwind CSS Installation 50 | 51 | Verify if Tailwind CSS is installed by executing: 52 | 53 | ```bash 54 | grep -o '"tailwindcss":\s*"[^"]*"' package.json | grep -o '[0-9]\+\.[0-9]\+\.[0-9]\+' 55 | ``` 56 | 57 | --- 58 | 59 | ## Step 4: Tailwind CSS Installation Paths 60 | 61 | Follow the appropriate installation path below based on your Tailwind CSS status: 62 | 63 | 64 | 65 | 1. Install Tailwind CSS and its Vite plugin 66 | ```bash 67 | pnpm install tailwindcss @tailwindcss/vite 68 | ``` 69 | 70 | 2. Replace everything in frameworks entry/main with the following: 71 | (Note: if there is no css file then we need to create one) 72 | ```css 73 | @import "tailwindcss"; 74 | ``` 75 | 76 | 3. add a simple button example within the index/app page of the framework to see if its working 77 | 78 | 4. Clear every css from the starter/demo css files. (usually in app.css) 79 | 80 | 81 | 1. Upgrade Tailwind CSS (if version 3 is installed) 82 | ```bash 83 | npx @tailwindcss/upgrade 84 | ``` 85 | 86 | -------------------------------------------------------------------------------- /prompts/vue-3/aiprompt.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "name": "Vue 3.5 Feature Guidelines", 4 | "description": "Comprehensive guidelines for adding new features in Vue 3.5 applications, covering components, composables, and state management", 5 | "type": "feature", 6 | "slug": "vue-3-feature-guidelines", 7 | "development_process": ["implement", "test"], 8 | "dev_categories": ["frontend", "api"], 9 | "tags": ["composition-api"], 10 | "tech_stack": { 11 | "framework": "vue" 12 | }, 13 | "ai_editor": ["cursor"], 14 | "author": { 15 | "name": "Kevin Kern", 16 | "url": "https://github.com/regenrek", 17 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 18 | }, 19 | "model": ["reasoning", "chat"], 20 | "version": "1.0", 21 | "files": ["add-feature-vue.md"], 22 | "published": true 23 | }, 24 | { 25 | "name": "Vue 3.5 Coding Standards", 26 | "description": "Comprehensive coding standards and best practices for Vue 3.5 development, covering project structure, TypeScript usage, and more", 27 | "type": "rule", 28 | "slug": "vue-3-coding-standards", 29 | "development_process": ["implement"], 30 | "dev_categories": ["frontend", "documentation"], 31 | "tags": ["architecture"], 32 | "tech_stack": { 33 | "framework": "vue" 34 | }, 35 | "ai_editor": ["cursor"], 36 | "author": { 37 | "name": "Kevin Kern", 38 | "url": "https://github.com/regenrek", 39 | "avatar": "https://avatars.githubusercontent.com/u/5182020?v=4" 40 | }, 41 | "model": ["reasoning", "chat"], 42 | "version": "1.0", 43 | "files": ["rule-vue-coding-standards.md", "optimized-standards.md"], 44 | "published": true 45 | } 46 | ] 47 | -------------------------------------------------------------------------------- /prompts/vue-3/rule-vue-coding-standards.md: -------------------------------------------------------------------------------- 1 | --- 2 | description: Coding Standards & Rules for Vue 3 3 | globs: **/*.vue, **/*.ts, **/*.js 4 | --- 5 | 6 | You are a senior Vue 3 developer focusing exclusively on framework-specific features and patterns. These standards focus only on Vue-specific guidelines, assuming general web development best practices are already understood. 7 | 8 | # Composition API 9 | - Use script setup syntax with TypeScript for enhanced type safety. 10 | - Create reusable composable functions for shared logic across components. 11 | Example: `const { data, pending } = useAsyncData(() => fetchUserData())`. 12 | 13 | # Component Architecture 14 | - Define props using runtime validation with TypeScript interfaces. 15 | - Use defineModel for two-way binding. 16 | - Example: `const model = defineModel('search', { default: '' })`. 17 | 18 | # State Management 19 | - Use Pinia for large-scale state management. 20 | - Create custom stores using composables for shared state. 21 | - Example: `const useUserStore = defineStore('user', () => { const user = ref(null) })`. 22 | 23 | # Performance Optimization 24 | - Use shallowRef for large objects that do not need deep reactivity. 25 | - Implement v-memo for skipping unnecessary re-renders. 26 | - Example: `const largeData = shallowRef(initialValue)`. 27 | 28 | # Template Patterns 29 | - Use v-bind with dynamic props for flexible component interfaces. 30 | - Implement slots with proper fallback content. 31 | - Example: ``. 32 | 33 | # SEO and Performance 34 | - Implement proper meta tags using definePageMeta. 35 | - Use server components for static content. 36 | - Example: `definePageMeta({ title: 'Home', description: 'Welcome to our site' })`. 37 | 38 | # Component Features 39 | - Use defineProps and defineEmits for component communication. 40 | - Example: `const props = defineProps<{ message: string }>()`. 41 | 42 | # Reactivity System 43 | - Use ref for primitives and reactive for objects. 44 | - Implement computed properties for derived state. Example: `const fullName = computed(() => `${firstName.value} ${lastName.value}`)`. 45 | 46 | # Performance Features 47 | - Use Vapor Mode for better runtime performance. 48 | - Handle async components with Suspense. Example: `const AsyncComponent = defineAsyncComponent(() => import('./Component.vue'))`. 49 | 50 | # Template Features 51 | - Use v-model with defineModel for form inputs. 52 | - Implement custom directives for reusable DOM manipulations. Example: `v-model="searchQuery"` 53 | 54 | # Template Features 55 | - Use v-model with defineModel for form inputs. 56 | - Implement custom directives for reusable DOM manipulations. Example: `v-model="searchQuery"` -------------------------------------------------------------------------------- /public/image.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/instructa/ai-prompts/71a75d379f55e60a1a8ea177ef144e7a3b165a9c/public/image.png -------------------------------------------------------------------------------- /scripts/parse-mdc.js: -------------------------------------------------------------------------------- 1 | /** 2 | * parse-mdc.js 3 | * Utility to parse .mdc files with front matter without external dependencies 4 | */ 5 | 6 | /** 7 | * Parses front matter and content from .mdc files 8 | * @param {string} content - Raw file content 9 | * @param {string} [filePath] - Optional file path for warning messages 10 | * @returns {{data: Object, content: string}} Parsed front matter and content 11 | */ 12 | function parseMdc(content, filePath) { 13 | // Default return structure 14 | const result = { 15 | data: {}, 16 | content: content, 17 | }; 18 | 19 | // Check for front matter delimiters 20 | if (!content.startsWith("---\n")) { 21 | console.warn(`Warning: No front matter delimiters found in ${filePath}`); 22 | return result; 23 | } 24 | 25 | // Find the closing front matter delimiter 26 | const secondDelimiter = content.indexOf("\n---\n", 4); 27 | if (secondDelimiter === -1) { 28 | console.warn( 29 | `Warning: Missing closing front matter delimiter in ${filePath}` 30 | ); 31 | return result; 32 | } 33 | 34 | try { 35 | // Extract and parse front matter 36 | const frontMatter = content.slice(4, secondDelimiter); 37 | const mainContent = content.slice(secondDelimiter + 5); 38 | 39 | // Parse the YAML-like front matter 40 | const data = parseFrontMatter(frontMatter); 41 | 42 | return { 43 | data, 44 | content: mainContent, 45 | }; 46 | } catch (error) { 47 | console.warn(`Error parsing front matter in ${filePath}:`, error); 48 | return result; 49 | } 50 | } 51 | 52 | /** 53 | * Parses YAML-like front matter into an object 54 | * @param {string} frontMatter - Raw front matter content 55 | * @returns {Object} Parsed front matter as an object 56 | */ 57 | function parseFrontMatter(frontMatter) { 58 | const data = {}; 59 | const lines = frontMatter.split("\n"); 60 | 61 | for (const line of lines) { 62 | const trimmedLine = line.trim(); 63 | if (!trimmedLine || trimmedLine.startsWith("#")) continue; 64 | 65 | const colonIndex = trimmedLine.indexOf(":"); 66 | if (colonIndex === -1) continue; 67 | 68 | const key = trimmedLine.slice(0, colonIndex).trim(); 69 | let value = trimmedLine.slice(colonIndex + 1).trim(); 70 | 71 | // Handle arrays 72 | if (value.startsWith("[") && value.endsWith("]")) { 73 | value = value 74 | .slice(1, -1) 75 | .split(",") 76 | .map((item) => item.trim()) 77 | .filter((item) => item.length > 0); 78 | } 79 | // Handle quoted strings 80 | else if ( 81 | (value.startsWith('"') && value.endsWith('"')) || 82 | (value.startsWith("'") && value.endsWith("'")) 83 | ) { 84 | value = value.slice(1, -1); 85 | } 86 | // Handle booleans 87 | else if (value.toLowerCase() === "true") { 88 | value = true; 89 | } else if (value.toLowerCase() === "false") { 90 | value = false; 91 | } 92 | // Handle numbers 93 | else if (!isNaN(value) && value.length > 0) { 94 | value = Number(value); 95 | } 96 | 97 | data[key] = value; 98 | } 99 | 100 | return data; 101 | } 102 | 103 | module.exports = { 104 | parseMdc, 105 | }; 106 | --------------------------------------------------------------------------------