javi-forge 1.1.0 → 1.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (238) hide show
  1. package/ci-local/ci-local.sh +38 -10
  2. package/ci-local/hooks/pre-commit +10 -155
  3. package/ci-local/hooks/pre-push +12 -29
  4. package/dist/commands/ci.d.ts +33 -0
  5. package/dist/commands/ci.js +341 -0
  6. package/dist/commands/init.js +5 -0
  7. package/dist/index.js +39 -5
  8. package/dist/lib/docker.d.ts +43 -0
  9. package/dist/lib/docker.js +223 -0
  10. package/dist/ui/CI.d.ts +9 -0
  11. package/dist/ui/CI.js +91 -0
  12. package/package.json +9 -1
  13. package/ai-config/.skillignore +0 -15
  14. package/ai-config/AUTO_INVOKE.md +0 -300
  15. package/ai-config/agents/_TEMPLATE.md +0 -93
  16. package/ai-config/agents/business/api-designer.md +0 -1657
  17. package/ai-config/agents/business/business-analyst.md +0 -1331
  18. package/ai-config/agents/business/product-strategist.md +0 -206
  19. package/ai-config/agents/business/project-manager.md +0 -178
  20. package/ai-config/agents/business/requirements-analyst.md +0 -1277
  21. package/ai-config/agents/business/technical-writer.md +0 -1679
  22. package/ai-config/agents/creative/ux-designer.md +0 -205
  23. package/ai-config/agents/data-ai/ai-engineer.md +0 -487
  24. package/ai-config/agents/data-ai/analytics-engineer.md +0 -953
  25. package/ai-config/agents/data-ai/data-engineer.md +0 -173
  26. package/ai-config/agents/data-ai/data-scientist.md +0 -672
  27. package/ai-config/agents/data-ai/mlops-engineer.md +0 -814
  28. package/ai-config/agents/data-ai/prompt-engineer.md +0 -772
  29. package/ai-config/agents/development/angular-expert.md +0 -620
  30. package/ai-config/agents/development/backend-architect.md +0 -795
  31. package/ai-config/agents/development/database-specialist.md +0 -212
  32. package/ai-config/agents/development/frontend-specialist.md +0 -686
  33. package/ai-config/agents/development/fullstack-engineer.md +0 -668
  34. package/ai-config/agents/development/golang-pro.md +0 -338
  35. package/ai-config/agents/development/java-enterprise.md +0 -400
  36. package/ai-config/agents/development/javascript-pro.md +0 -422
  37. package/ai-config/agents/development/nextjs-pro.md +0 -474
  38. package/ai-config/agents/development/python-pro.md +0 -570
  39. package/ai-config/agents/development/react-pro.md +0 -487
  40. package/ai-config/agents/development/rust-pro.md +0 -246
  41. package/ai-config/agents/development/spring-boot-4-expert.md +0 -326
  42. package/ai-config/agents/development/typescript-pro.md +0 -336
  43. package/ai-config/agents/development/vue-specialist.md +0 -605
  44. package/ai-config/agents/infrastructure/cloud-architect.md +0 -472
  45. package/ai-config/agents/infrastructure/deployment-manager.md +0 -358
  46. package/ai-config/agents/infrastructure/devops-engineer.md +0 -455
  47. package/ai-config/agents/infrastructure/incident-responder.md +0 -519
  48. package/ai-config/agents/infrastructure/kubernetes-expert.md +0 -705
  49. package/ai-config/agents/infrastructure/monitoring-specialist.md +0 -674
  50. package/ai-config/agents/infrastructure/performance-engineer.md +0 -658
  51. package/ai-config/agents/orchestrator.md +0 -241
  52. package/ai-config/agents/quality/accessibility-auditor.md +0 -1204
  53. package/ai-config/agents/quality/code-reviewer-compact.md +0 -123
  54. package/ai-config/agents/quality/code-reviewer.md +0 -363
  55. package/ai-config/agents/quality/dependency-manager.md +0 -743
  56. package/ai-config/agents/quality/e2e-test-specialist.md +0 -1005
  57. package/ai-config/agents/quality/performance-tester.md +0 -1086
  58. package/ai-config/agents/quality/security-auditor.md +0 -133
  59. package/ai-config/agents/quality/test-engineer.md +0 -453
  60. package/ai-config/agents/specialists/api-designer.md +0 -87
  61. package/ai-config/agents/specialists/backend-architect.md +0 -73
  62. package/ai-config/agents/specialists/code-reviewer.md +0 -77
  63. package/ai-config/agents/specialists/db-optimizer.md +0 -75
  64. package/ai-config/agents/specialists/devops-engineer.md +0 -83
  65. package/ai-config/agents/specialists/documentation-writer.md +0 -78
  66. package/ai-config/agents/specialists/frontend-developer.md +0 -75
  67. package/ai-config/agents/specialists/performance-analyst.md +0 -82
  68. package/ai-config/agents/specialists/refactor-specialist.md +0 -74
  69. package/ai-config/agents/specialists/security-auditor.md +0 -74
  70. package/ai-config/agents/specialists/test-engineer.md +0 -81
  71. package/ai-config/agents/specialists/ux-consultant.md +0 -76
  72. package/ai-config/agents/specialized/agent-generator.md +0 -1190
  73. package/ai-config/agents/specialized/blockchain-developer.md +0 -149
  74. package/ai-config/agents/specialized/code-migrator.md +0 -892
  75. package/ai-config/agents/specialized/context-manager.md +0 -978
  76. package/ai-config/agents/specialized/documentation-writer.md +0 -1078
  77. package/ai-config/agents/specialized/ecommerce-expert.md +0 -1756
  78. package/ai-config/agents/specialized/embedded-engineer.md +0 -1714
  79. package/ai-config/agents/specialized/error-detective.md +0 -1034
  80. package/ai-config/agents/specialized/fintech-specialist.md +0 -1659
  81. package/ai-config/agents/specialized/freelance-project-planner-v2.md +0 -1988
  82. package/ai-config/agents/specialized/freelance-project-planner-v3.md +0 -2136
  83. package/ai-config/agents/specialized/freelance-project-planner-v4.md +0 -4503
  84. package/ai-config/agents/specialized/freelance-project-planner.md +0 -722
  85. package/ai-config/agents/specialized/game-developer.md +0 -1963
  86. package/ai-config/agents/specialized/healthcare-dev.md +0 -1620
  87. package/ai-config/agents/specialized/mobile-developer.md +0 -188
  88. package/ai-config/agents/specialized/parallel-plan-executor.md +0 -506
  89. package/ai-config/agents/specialized/plan-executor.md +0 -485
  90. package/ai-config/agents/specialized/solo-dev-planner-modular/00-INDEX.md +0 -485
  91. package/ai-config/agents/specialized/solo-dev-planner-modular/01-CORE.md +0 -3493
  92. package/ai-config/agents/specialized/solo-dev-planner-modular/02-SELF-CORRECTION.md +0 -778
  93. package/ai-config/agents/specialized/solo-dev-planner-modular/03-PROGRESSIVE-SETUP.md +0 -918
  94. package/ai-config/agents/specialized/solo-dev-planner-modular/04-DEPLOYMENT.md +0 -1537
  95. package/ai-config/agents/specialized/solo-dev-planner-modular/05-TESTING.md +0 -2633
  96. package/ai-config/agents/specialized/solo-dev-planner-modular/06-OPERATIONS.md +0 -5610
  97. package/ai-config/agents/specialized/solo-dev-planner-modular/INSTALL.md +0 -335
  98. package/ai-config/agents/specialized/solo-dev-planner-modular/QUICK-REFERENCE.txt +0 -215
  99. package/ai-config/agents/specialized/solo-dev-planner-modular/README.md +0 -260
  100. package/ai-config/agents/specialized/solo-dev-planner-modular/START-HERE.md +0 -379
  101. package/ai-config/agents/specialized/solo-dev-planner-modular/WORKFLOW-DIAGRAM.md +0 -355
  102. package/ai-config/agents/specialized/solo-dev-planner-modular/solo-dev-planner.md +0 -279
  103. package/ai-config/agents/specialized/template-writer.md +0 -347
  104. package/ai-config/agents/specialized/test-runner.md +0 -99
  105. package/ai-config/agents/specialized/vibekanban-smart-worker.md +0 -244
  106. package/ai-config/agents/specialized/wave-executor.md +0 -138
  107. package/ai-config/agents/specialized/workflow-optimizer.md +0 -1114
  108. package/ai-config/commands/git/changelog.md +0 -32
  109. package/ai-config/commands/git/ci-local.md +0 -70
  110. package/ai-config/commands/git/commit.md +0 -35
  111. package/ai-config/commands/git/fix-issue.md +0 -23
  112. package/ai-config/commands/git/pr-create.md +0 -42
  113. package/ai-config/commands/git/pr-review.md +0 -50
  114. package/ai-config/commands/git/worktree.md +0 -39
  115. package/ai-config/commands/refactoring/cleanup.md +0 -24
  116. package/ai-config/commands/refactoring/dead-code.md +0 -40
  117. package/ai-config/commands/refactoring/extract.md +0 -31
  118. package/ai-config/commands/testing/e2e.md +0 -30
  119. package/ai-config/commands/testing/tdd.md +0 -36
  120. package/ai-config/commands/testing/test-coverage.md +0 -30
  121. package/ai-config/commands/testing/test-fix.md +0 -24
  122. package/ai-config/commands/workflow/generate-agents-md.md +0 -85
  123. package/ai-config/commands/workflow/planning.md +0 -47
  124. package/ai-config/commands/workflows/compound.md +0 -89
  125. package/ai-config/commands/workflows/diagnose.md +0 -70
  126. package/ai-config/commands/workflows/discover.md +0 -86
  127. package/ai-config/commands/workflows/plan.md +0 -77
  128. package/ai-config/commands/workflows/review.md +0 -78
  129. package/ai-config/commands/workflows/work.md +0 -75
  130. package/ai-config/config.yaml +0 -18
  131. package/ai-config/hooks/_TEMPLATE.md +0 -96
  132. package/ai-config/hooks/block-dangerous-commands.md +0 -75
  133. package/ai-config/hooks/commit-guard.md +0 -90
  134. package/ai-config/hooks/context-loader.md +0 -73
  135. package/ai-config/hooks/improve-prompt.md +0 -91
  136. package/ai-config/hooks/learning-log.md +0 -72
  137. package/ai-config/hooks/model-router.md +0 -86
  138. package/ai-config/hooks/secret-scanner.md +0 -64
  139. package/ai-config/hooks/skill-validator.md +0 -102
  140. package/ai-config/hooks/task-artifact.md +0 -114
  141. package/ai-config/hooks/validate-workflow.md +0 -100
  142. package/ai-config/prompts/base.md +0 -71
  143. package/ai-config/prompts/modes/debug.md +0 -34
  144. package/ai-config/prompts/modes/deploy.md +0 -40
  145. package/ai-config/prompts/modes/research.md +0 -32
  146. package/ai-config/prompts/modes/review.md +0 -33
  147. package/ai-config/prompts/review-policy.md +0 -79
  148. package/ai-config/skills/_TEMPLATE.md +0 -157
  149. package/ai-config/skills/backend/api-gateway/SKILL.md +0 -254
  150. package/ai-config/skills/backend/bff-concepts/SKILL.md +0 -239
  151. package/ai-config/skills/backend/bff-spring/SKILL.md +0 -364
  152. package/ai-config/skills/backend/chi-router/SKILL.md +0 -396
  153. package/ai-config/skills/backend/error-handling/SKILL.md +0 -255
  154. package/ai-config/skills/backend/exceptions-spring/SKILL.md +0 -323
  155. package/ai-config/skills/backend/fastapi/SKILL.md +0 -302
  156. package/ai-config/skills/backend/gateway-spring/SKILL.md +0 -390
  157. package/ai-config/skills/backend/go-backend/SKILL.md +0 -457
  158. package/ai-config/skills/backend/gradle-multimodule/SKILL.md +0 -274
  159. package/ai-config/skills/backend/graphql-concepts/SKILL.md +0 -352
  160. package/ai-config/skills/backend/graphql-spring/SKILL.md +0 -398
  161. package/ai-config/skills/backend/grpc-concepts/SKILL.md +0 -283
  162. package/ai-config/skills/backend/grpc-spring/SKILL.md +0 -445
  163. package/ai-config/skills/backend/jwt-auth/SKILL.md +0 -412
  164. package/ai-config/skills/backend/notifications-concepts/SKILL.md +0 -259
  165. package/ai-config/skills/backend/recommendations-concepts/SKILL.md +0 -261
  166. package/ai-config/skills/backend/search-concepts/SKILL.md +0 -263
  167. package/ai-config/skills/backend/search-spring/SKILL.md +0 -375
  168. package/ai-config/skills/backend/spring-boot-4/SKILL.md +0 -172
  169. package/ai-config/skills/backend/websockets/SKILL.md +0 -532
  170. package/ai-config/skills/data-ai/ai-ml/SKILL.md +0 -423
  171. package/ai-config/skills/data-ai/analytics-concepts/SKILL.md +0 -195
  172. package/ai-config/skills/data-ai/analytics-spring/SKILL.md +0 -340
  173. package/ai-config/skills/data-ai/duckdb-analytics/SKILL.md +0 -440
  174. package/ai-config/skills/data-ai/langchain/SKILL.md +0 -238
  175. package/ai-config/skills/data-ai/mlflow/SKILL.md +0 -302
  176. package/ai-config/skills/data-ai/onnx-inference/SKILL.md +0 -290
  177. package/ai-config/skills/data-ai/powerbi/SKILL.md +0 -352
  178. package/ai-config/skills/data-ai/pytorch/SKILL.md +0 -274
  179. package/ai-config/skills/data-ai/scikit-learn/SKILL.md +0 -321
  180. package/ai-config/skills/data-ai/vector-db/SKILL.md +0 -301
  181. package/ai-config/skills/database/graph-databases/SKILL.md +0 -218
  182. package/ai-config/skills/database/graph-spring/SKILL.md +0 -361
  183. package/ai-config/skills/database/pgx-postgres/SKILL.md +0 -512
  184. package/ai-config/skills/database/redis-cache/SKILL.md +0 -343
  185. package/ai-config/skills/database/sqlite-embedded/SKILL.md +0 -388
  186. package/ai-config/skills/database/timescaledb/SKILL.md +0 -320
  187. package/ai-config/skills/docs/api-documentation/SKILL.md +0 -293
  188. package/ai-config/skills/docs/docs-spring/SKILL.md +0 -377
  189. package/ai-config/skills/docs/mustache-templates/SKILL.md +0 -190
  190. package/ai-config/skills/docs/technical-docs/SKILL.md +0 -447
  191. package/ai-config/skills/frontend/astro-ssr/SKILL.md +0 -441
  192. package/ai-config/skills/frontend/frontend-design/SKILL.md +0 -54
  193. package/ai-config/skills/frontend/frontend-web/SKILL.md +0 -368
  194. package/ai-config/skills/frontend/mantine-ui/SKILL.md +0 -396
  195. package/ai-config/skills/frontend/tanstack-query/SKILL.md +0 -439
  196. package/ai-config/skills/frontend/zod-validation/SKILL.md +0 -417
  197. package/ai-config/skills/frontend/zustand-state/SKILL.md +0 -350
  198. package/ai-config/skills/infrastructure/chaos-engineering/SKILL.md +0 -244
  199. package/ai-config/skills/infrastructure/chaos-spring/SKILL.md +0 -378
  200. package/ai-config/skills/infrastructure/devops-infra/SKILL.md +0 -435
  201. package/ai-config/skills/infrastructure/docker-containers/SKILL.md +0 -420
  202. package/ai-config/skills/infrastructure/kubernetes/SKILL.md +0 -456
  203. package/ai-config/skills/infrastructure/opentelemetry/SKILL.md +0 -546
  204. package/ai-config/skills/infrastructure/traefik-proxy/SKILL.md +0 -474
  205. package/ai-config/skills/infrastructure/woodpecker-ci/SKILL.md +0 -315
  206. package/ai-config/skills/mobile/ionic-capacitor/SKILL.md +0 -504
  207. package/ai-config/skills/mobile/mobile-ionic/SKILL.md +0 -448
  208. package/ai-config/skills/prompt-improver/SKILL.md +0 -125
  209. package/ai-config/skills/quality/ghagga-review/SKILL.md +0 -216
  210. package/ai-config/skills/references/hooks-patterns/SKILL.md +0 -238
  211. package/ai-config/skills/references/mcp-servers/SKILL.md +0 -275
  212. package/ai-config/skills/references/plugins-reference/SKILL.md +0 -110
  213. package/ai-config/skills/references/skills-reference/SKILL.md +0 -420
  214. package/ai-config/skills/references/subagent-templates/SKILL.md +0 -193
  215. package/ai-config/skills/systems-iot/modbus-protocol/SKILL.md +0 -410
  216. package/ai-config/skills/systems-iot/mqtt-rumqttc/SKILL.md +0 -408
  217. package/ai-config/skills/systems-iot/rust-systems/SKILL.md +0 -386
  218. package/ai-config/skills/systems-iot/tokio-async/SKILL.md +0 -324
  219. package/ai-config/skills/testing/playwright-e2e/SKILL.md +0 -289
  220. package/ai-config/skills/testing/testcontainers/SKILL.md +0 -299
  221. package/ai-config/skills/testing/vitest-testing/SKILL.md +0 -381
  222. package/ai-config/skills/workflow/ci-local-guide/SKILL.md +0 -118
  223. package/ai-config/skills/workflow/claude-automation-recommender/SKILL.md +0 -299
  224. package/ai-config/skills/workflow/claude-md-improver/SKILL.md +0 -158
  225. package/ai-config/skills/workflow/finishing-a-development-branch/SKILL.md +0 -117
  226. package/ai-config/skills/workflow/git-github/SKILL.md +0 -334
  227. package/ai-config/skills/workflow/git-github/references/examples.md +0 -160
  228. package/ai-config/skills/workflow/git-workflow/SKILL.md +0 -214
  229. package/ai-config/skills/workflow/ide-plugins/SKILL.md +0 -277
  230. package/ai-config/skills/workflow/ide-plugins-intellij/SKILL.md +0 -401
  231. package/ai-config/skills/workflow/obsidian-brain-workflow/SKILL.md +0 -199
  232. package/ai-config/skills/workflow/using-git-worktrees/SKILL.md +0 -100
  233. package/ai-config/skills/workflow/verification-before-completion/SKILL.md +0 -73
  234. package/ai-config/skills/workflow/wave-workflow/SKILL.md +0 -178
  235. package/schemas/agent.schema.json +0 -34
  236. package/schemas/ai-config.schema.json +0 -28
  237. package/schemas/plugin.schema.json +0 -62
  238. package/schemas/skill.schema.json +0 -44
package/ai-config/skills/frontend/astro-ssr/SKILL.md DELETED
@@ -1,441 +0,0 @@
1
- ---
2
- name: astro-ssr
3
- description: >
4
- Astro 4.x SSR framework with React islands, API routes, middleware, and View Transitions.
5
- Trigger: astro, ssr, islands architecture, static site, hybrid rendering
6
- tools:
7
- - Read
8
- - Write
9
- - Grep
10
- metadata:
11
- author: plataforma-industrial
12
- version: "2.0"
13
- tags: [astro, ssr, islands, react, web]
14
- updated: "2026-02"
15
- ---
16
-
17
- # Astro 4.x SSR Framework
18
-
19
- ## Stack
20
- ```json
21
- {
22
- "astro": "4.5.x",
23
- "@astrojs/react": "3.1.x",
24
- "@astrojs/tailwind": "5.1.x",
25
- "@astrojs/node": "8.2.x"
26
- }
27
- ```
28
-
29
- ## Project Structure
30
-
31
- ```
32
- src/
33
- ├── components/
34
- │ ├── astro/ # .astro components (static)
35
- │ └── react/ # .tsx components (islands)
36
- ├── layouts/
37
- │ ├── BaseLayout.astro
38
- │ └── DashboardLayout.astro
39
- ├── pages/
40
- │ ├── index.astro
41
- │ ├── [slug].astro # Dynamic route
42
- │ ├── [...path].astro # Catch-all route
43
- │ └── api/ # API routes
44
- ├── lib/
45
- │ ├── api/
46
- │ └── types/
47
- └── env.d.ts
48
- ```
49
-
50
- ## Configuration
51
-
52
- ```javascript
53
- // astro.config.mjs
54
- import { defineConfig } from 'astro/config';
55
- import react from '@astrojs/react';
56
- import tailwind from '@astrojs/tailwind';
57
- import node from '@astrojs/node';
58
-
59
- export default defineConfig({
60
- output: 'server', // SSR mode
61
- adapter: node({ mode: 'standalone' }),
62
- integrations: [
63
- react(),
64
- tailwind({ applyBaseStyles: false }),
65
- ],
66
- server: { port: 4321, host: true },
67
- vite: {
68
- ssr: { noExternal: ['@mantine/*'] },
69
- },
70
- });
71
- ```
72
-
73
- ```json
74
- // tsconfig.json
75
- {
76
- "extends": "astro/tsconfigs/strict",
77
- "compilerOptions": {
78
- "jsx": "react-jsx",
79
- "jsxImportSource": "react",
80
- "baseUrl": ".",
81
- "paths": {
82
- "@/*": ["src/*"],
83
- "@components/*": ["src/components/*"],
84
- "@lib/*": ["src/lib/*"]
85
- }
86
- }
87
- }
88
- ```
89
-
90
- ## Layouts
91
-
92
- ```astro
93
- ---
94
- // src/layouts/BaseLayout.astro
95
- import '@mantine/core/styles.css';
96
- import '@/styles/global.css';
97
-
98
- interface Props {
99
- title: string;
100
- description?: string;
101
- }
102
-
103
- const { title, description = 'App Description' } = Astro.props;
104
- ---
105
-
106
- <!DOCTYPE html>
107
- <html lang="en">
108
- <head>
109
- <meta charset="UTF-8" />
110
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
111
- <meta name="description" content={description} />
112
- <title>{title} | App Name</title>
113
- </head>
114
- <body>
115
- <slot />
116
- </body>
117
- </html>
118
- ```
119
-
120
- ```astro
121
- ---
122
- // src/layouts/DashboardLayout.astro
123
- import BaseLayout from './BaseLayout.astro';
124
- import { AppShell } from '@components/react/AppShell';
125
- import { getSession } from '@lib/auth';
126
-
127
- interface Props { title: string; }
128
-
129
- const { title } = Astro.props;
130
- const session = await getSession(Astro.request);
131
-
132
- if (!session) {
133
- return Astro.redirect('/login');
134
- }
135
- ---
136
-
137
- <BaseLayout title={title}>
138
- <AppShell client:load user={session.user}>
139
- <slot />
140
- </AppShell>
141
- </BaseLayout>
142
- ```
143
-
144
- ## Client Directives (Islands)
145
-
146
- ```astro
147
- <!-- Hydrate immediately - critical UI -->
148
- <Dashboard client:load />
149
-
150
- <!-- Hydrate when browser idle - secondary widgets -->
151
- <NewsWidget client:idle />
152
-
153
- <!-- Hydrate when visible - below-the-fold content -->
154
- <Chart client:visible />
155
-
156
- <!-- Hydrate on media query match - responsive components -->
157
- <MobileMenu client:media="(max-width: 768px)" />
158
-
159
- <!-- Client-only, no SSR - browser API dependent -->
160
- <RealtimeChart client:only="react" />
161
- ```
162
-
163
- ## Pages
164
-
165
- ```astro
166
- ---
167
- // src/pages/index.astro
168
- import DashboardLayout from '@layouts/DashboardLayout.astro';
169
- import { Overview } from '@components/react/Overview';
170
- ---
171
-
172
- <DashboardLayout title="Dashboard">
173
- <Overview client:load />
174
- </DashboardLayout>
175
- ```
176
-
177
- ```astro
178
- ---
179
- // src/pages/items/[id].astro - Dynamic route
180
- import DashboardLayout from '@layouts/DashboardLayout.astro';
181
- import { ItemDetail } from '@components/react/ItemDetail';
182
-
183
- const { id } = Astro.params;
184
- if (!id) return Astro.redirect('/items');
185
- ---
186
-
187
- <DashboardLayout title="Item Detail">
188
- <ItemDetail id={id} client:load />
189
- </DashboardLayout>
190
- ```
191
-
192
- ```astro
193
- ---
194
- // src/pages/404.astro
195
- import BaseLayout from '@layouts/BaseLayout.astro';
196
- ---
197
-
198
- <BaseLayout title="Not Found">
199
- <h1>404</h1>
200
- <a href="/">Go Home</a>
201
- </BaseLayout>
202
- ```
203
-
204
- ## API Routes
205
-
206
- ```typescript
207
- // src/pages/api/items/index.ts
208
- import type { APIRoute } from 'astro';
209
-
210
- export const GET: APIRoute = async ({ request }) => {
211
- const items = await getItems();
212
- return new Response(JSON.stringify({ data: items }), {
213
- status: 200,
214
- headers: { 'Content-Type': 'application/json' },
215
- });
216
- };
217
-
218
- export const POST: APIRoute = async ({ request }) => {
219
- const body = await request.json();
220
- const item = await createItem(body);
221
- return new Response(JSON.stringify({ data: item }), {
222
- status: 201,
223
- headers: { 'Content-Type': 'application/json' },
224
- });
225
- };
226
- ```
227
-
228
- ```typescript
229
- // src/pages/api/items/[id].ts - Dynamic API route
230
- import type { APIRoute } from 'astro';
231
-
232
- export const GET: APIRoute = async ({ params }) => {
233
- const item = await getItemById(params.id);
234
- if (!item) {
235
- return new Response(JSON.stringify({ error: 'Not found' }), { status: 404 });
236
- }
237
- return new Response(JSON.stringify({ data: item }), { status: 200 });
238
- };
239
-
240
- export const PUT: APIRoute = async ({ params, request }) => {
241
- const body = await request.json();
242
- const item = await updateItem(params.id, body);
243
- return new Response(JSON.stringify({ data: item }), { status: 200 });
244
- };
245
-
246
- export const DELETE: APIRoute = async ({ params }) => {
247
- await deleteItem(params.id);
248
- return new Response(null, { status: 204 });
249
- };
250
- ```
251
-
252
- ## Middleware
253
-
254
- ```typescript
255
- // src/middleware.ts
256
- import { defineMiddleware } from 'astro:middleware';
257
- import { verifySession } from '@lib/auth';
258
-
259
- const publicRoutes = ['/login', '/register', '/api/auth/login'];
260
-
261
- export const onRequest = defineMiddleware(async (context, next) => {
262
- const { pathname } = context.url;
263
-
264
- // Allow public routes
265
- if (publicRoutes.some(route => pathname.startsWith(route))) {
266
- return next();
267
- }
268
-
269
- // Allow static assets
270
- if (pathname.startsWith('/_astro') || pathname.startsWith('/assets')) {
271
- return next();
272
- }
273
-
274
- const session = await verifySession(context.request);
275
-
276
- if (!session) {
277
- if (!pathname.startsWith('/api/')) {
278
- return context.redirect('/login');
279
- }
280
- return new Response(JSON.stringify({ error: 'Unauthorized' }), {
281
- status: 401,
282
- headers: { 'Content-Type': 'application/json' },
283
- });
284
- }
285
-
286
- // Attach session to locals
287
- context.locals.session = session;
288
- return next();
289
- });
290
- ```
291
-
292
- ```astro
293
- ---
294
- // Using locals in pages
295
- const { session } = Astro.locals;
296
- ---
297
- <p>Welcome, {session.user.name}</p>
298
- ```
299
-
300
- ## Server-Side Data Fetching
301
-
302
- ```astro
303
- ---
304
- // Fetch in frontmatter (server-side)
305
- const response = await fetch(`${import.meta.env.API_URL}/items`, {
306
- headers: { 'Authorization': `Bearer ${Astro.cookies.get('token')?.value}` },
307
- });
308
- const { data: items } = await response.json();
309
- ---
310
-
311
- <!-- Pass pre-fetched data to React island -->
312
- <ItemList initialData={items} client:load />
313
- ```
314
-
315
- ## Astro Components
316
-
317
- ```astro
318
- ---
319
- // src/components/astro/Card.astro
320
- interface Props {
321
- title: string;
322
- class?: string;
323
- }
324
-
325
- const { title, class: className } = Astro.props;
326
- ---
327
-
328
- <div class:list={['card', className]}>
329
- <div class="card-header">
330
- <h3>{title}</h3>
331
- <slot name="actions" />
332
- </div>
333
- <div class="card-body">
334
- <slot />
335
- </div>
336
- {Astro.slots.has('footer') && (
337
- <div class="card-footer">
338
- <slot name="footer" />
339
- </div>
340
- )}
341
- </div>
342
-
343
- <style>
344
- .card { background: white; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
345
- .card-header { padding: 1rem; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; }
346
- .card-body { padding: 1rem; }
347
- .card-footer { padding: 1rem; border-top: 1px solid #eee; background: #f9f9f9; }
348
- </style>
349
-
350
- <!-- Usage -->
351
- <Card title="My Card">
352
- <button slot="actions">Add</button>
353
- <p>Content here</p>
354
- <div slot="footer"><button>Save</button></div>
355
- </Card>
356
- ```
357
-
358
- ## Environment Variables
359
-
360
- ```bash
361
- # .env
362
- PUBLIC_API_URL=http://localhost:8080/api # Available client-side
363
- API_URL=http://localhost:8080/api # Server-only
364
- JWT_SECRET=your-secret-key # Server-only
365
- ```
366
-
367
- ```typescript
368
- // src/env.d.ts
369
- /// <reference types="astro/client" />
370
-
371
- interface ImportMetaEnv {
372
- readonly PUBLIC_API_URL: string;
373
- readonly API_URL: string;
374
- readonly JWT_SECRET: string;
375
- }
376
-
377
- declare namespace App {
378
- interface Locals {
379
- session?: { user: { id: string; email: string; name: string } };
380
- }
381
- }
382
- ```
383
-
384
- ## View Transitions
385
-
386
- ```astro
387
- ---
388
- import { ViewTransitions } from 'astro:transitions';
389
- ---
390
-
391
- <html>
392
- <head>
393
- <ViewTransitions />
394
- </head>
395
- <body>
396
- <!-- Named elements for smooth transitions -->
397
- <h1 transition:name="page-title">{title}</h1>
398
-
399
- <!-- Persist component state across navigation -->
400
- <VideoPlayer transition:persist />
401
-
402
- <!-- Custom animation -->
403
- <div transition:animate="slide">Content</div>
404
- </body>
405
- </html>
406
- ```
407
-
408
- ## Docker Deployment
409
-
410
- ```dockerfile
411
- FROM node:20-alpine AS builder
412
- WORKDIR /app
413
- COPY package*.json ./
414
- RUN npm ci
415
- COPY . .
416
- RUN npm run build
417
-
418
- FROM node:20-alpine
419
- WORKDIR /app
420
- COPY --from=builder /app/dist ./dist
421
- COPY --from=builder /app/node_modules ./node_modules
422
- COPY package.json ./
423
- ENV HOST=0.0.0.0
424
- ENV PORT=4321
425
- EXPOSE 4321
426
- CMD ["node", "./dist/server/entry.mjs"]
427
- ```
428
-
429
- ## Best Practices
430
-
431
- 1. **Minimize JS**: Prefer Astro components for static content, only hydrate interactive elements
432
- 2. **Server fetch**: Fetch data in frontmatter, pass to client components as props
433
- 3. **Small islands**: Hydrate only the interactive part, not the whole page
434
- 4. **Type Props**: Always define `interface Props` for Astro components
435
- 5. **client:visible**: Use for below-the-fold content to reduce initial JS
436
-
437
- ## Related Skills
438
-
439
- - `frontend-web`: Full frontend stack patterns
440
- - `mantine-ui`: React component library
441
- - `tanstack-query`: Data fetching in React islands
package/ai-config/skills/frontend/frontend-design/SKILL.md DELETED
@@ -1,54 +0,0 @@
1
- ---
2
- name: frontend-design
3
- description: >
4
- Create distinctive, production-grade frontend interfaces with high design quality.
5
- Trigger: building web components, pages, UI, design system, React/Vue/Svelte, CSS, Tailwind
6
- tools:
7
- - Read
8
- - Write
9
- - Edit
10
- - Bash
11
- metadata:
12
- author: claude-plugins-official
13
- version: "2.0"
14
- tags: [frontend, design, css, react, tailwind, ui-ux]
15
- language: typescript
16
- updated: "2026-02"
17
- ---
18
-
19
- This skill guides creation of distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Implement real working code with exceptional attention to aesthetic details and creative choices.
20
-
21
- The user provides frontend requirements: a component, page, application, or interface to build. They may include context about the purpose, audience, or technical constraints.
22
-
23
- ## Design Thinking
24
-
25
- Before coding, understand the context and commit to a BOLD aesthetic direction:
26
- - **Purpose**: What problem does this interface solve? Who uses it?
27
- - **Tone**: Pick an extreme: brutally minimal, maximalist chaos, retro-futuristic, organic/natural, luxury/refined, playful/toy-like, editorial/magazine, brutalist/raw, art deco/geometric, soft/pastel, industrial/utilitarian, etc. There are so many flavors to choose from. Use these for inspiration but design one that is true to the aesthetic direction.
28
- - **Constraints**: Technical requirements (framework, performance, accessibility).
29
- - **Differentiation**: What makes this UNFORGETTABLE? What's the one thing someone will remember?
30
-
31
- **CRITICAL**: Choose a clear conceptual direction and execute it with precision. Bold maximalism and refined minimalism both work - the key is intentionality, not intensity.
32
-
33
- Then implement working code (HTML/CSS/JS, React, Vue, etc.) that is:
34
- - Production-grade and functional
35
- - Visually striking and memorable
36
- - Cohesive with a clear aesthetic point-of-view
37
- - Meticulously refined in every detail
38
-
39
- ## Frontend Aesthetics Guidelines
40
-
41
- Focus on:
42
- - **Typography**: Choose fonts that are beautiful, unique, and interesting. Avoid generic fonts like Arial and Inter; opt instead for distinctive choices that elevate the frontend's aesthetics; unexpected, characterful font choices. Pair a distinctive display font with a refined body font.
43
- - **Color & Theme**: Commit to a cohesive aesthetic. Use CSS variables for consistency. Dominant colors with sharp accents outperform timid, evenly-distributed palettes.
44
- - **Motion**: Use animations for effects and micro-interactions. Prioritize CSS-only solutions for HTML. Use Motion library for React when available. Focus on high-impact moments: one well-orchestrated page load with staggered reveals (animation-delay) creates more delight than scattered micro-interactions. Use scroll-triggering and hover states that surprise.
45
- - **Spatial Composition**: Unexpected layouts. Asymmetry. Overlap. Diagonal flow. Grid-breaking elements. Generous negative space OR controlled density.
46
- - **Backgrounds & Visual Details**: Create atmosphere and depth rather than defaulting to solid colors. Add contextual effects and textures that match the overall aesthetic. Apply creative forms like gradient meshes, noise textures, geometric patterns, layered transparencies, dramatic shadows, decorative borders, custom cursors, and grain overlays.
47
-
48
- NEVER use generic AI-generated aesthetics like overused font families (Inter, Roboto, Arial, system fonts), cliched color schemes (particularly purple gradients on white backgrounds), predictable layouts and component patterns, and cookie-cutter design that lacks context-specific character.
49
-
50
- Interpret creatively and make unexpected choices that feel genuinely designed for the context. No design should be the same. Vary between light and dark themes, different fonts, different aesthetics. NEVER converge on common choices (Space Grotesk, for example) across generations.
51
-
52
- **IMPORTANT**: Match implementation complexity to the aesthetic vision. Maximalist designs need elaborate code with extensive animations and effects. Minimalist or refined designs need restraint, precision, and careful attention to spacing, typography, and subtle details. Elegance comes from executing the vision well.
53
-
54
- Remember: Claude is capable of extraordinary creative work. Don't hold back, show what can truly be created when thinking outside the box and committing fully to a distinctive vision.