@fenixforce/edition-pro 0.1.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 (173) hide show
  1. package/dist/api/approval-routes.d.ts +15 -0
  2. package/dist/api/fleet-routes.d.ts +23 -0
  3. package/dist/api/integration-routes.d.ts +17 -0
  4. package/dist/api/middleware.d.ts +37 -0
  5. package/dist/boot.d.ts +37 -0
  6. package/dist/business/approval-queue.d.ts +94 -0
  7. package/dist/business/arena.d.ts +71 -0
  8. package/dist/business/best-of-n.d.ts +68 -0
  9. package/dist/business/brainstorm.d.ts +42 -0
  10. package/dist/business/compile-checker.d.ts +50 -0
  11. package/dist/business/debate.d.ts +38 -0
  12. package/dist/business/fleet-budget.d.ts +69 -0
  13. package/dist/business/fleet-config.d.ts +125 -0
  14. package/dist/business/fleet.d.ts +85 -0
  15. package/dist/business/handoff.d.ts +56 -0
  16. package/dist/business/hat-system.d.ts +57 -0
  17. package/dist/business/index.d.ts +44 -0
  18. package/dist/business/integration-registry.d.ts +66 -0
  19. package/dist/business/node-pipeline.d.ts +62 -0
  20. package/dist/business/oracle.d.ts +64 -0
  21. package/dist/business/roles/index.d.ts +7 -0
  22. package/dist/business/roles/judge.d.ts +24 -0
  23. package/dist/business/roles/planner.d.ts +30 -0
  24. package/dist/business/roles/types.d.ts +37 -0
  25. package/dist/business/roles/worker.d.ts +25 -0
  26. package/dist/business/router.d.ts +75 -0
  27. package/dist/business/shared-memory.d.ts +85 -0
  28. package/dist/business/status-detector.d.ts +52 -0
  29. package/dist/business/swarm-registry.d.ts +63 -0
  30. package/dist/business/templates.d.ts +55 -0
  31. package/dist/business/workspace-manager.d.ts +105 -0
  32. package/dist/index.d.ts +21 -0
  33. package/dist/index.js +638 -0
  34. package/dist/infrastructure/pty-agent.d.ts +74 -0
  35. package/dist/migrations/migrate.d.ts +7 -0
  36. package/dist/migrations/runner.d.ts +49 -0
  37. package/dist/workspace/worktree.d.ts +69 -0
  38. package/package.json +37 -0
  39. package/skills/builtin/academic-researcher/SKILL.md +51 -0
  40. package/skills/builtin/advanced-recon/SKILL.md +75 -0
  41. package/skills/builtin/agent-governance/SKILL.md +122 -0
  42. package/skills/builtin/algorithmic-art/SKILL.md +55 -0
  43. package/skills/builtin/api-attack-surface-mapper/SKILL.md +88 -0
  44. package/skills/builtin/api-development/SKILL.md +147 -0
  45. package/skills/builtin/api-exploit-prover/SKILL.md +74 -0
  46. package/skills/builtin/api-integration/SKILL.md +73 -0
  47. package/skills/builtin/api-security-tester/SKILL.md +82 -0
  48. package/skills/builtin/api-test-executor/SKILL.md +62 -0
  49. package/skills/builtin/app-store-optimization/SKILL.md +46 -0
  50. package/skills/builtin/audio-tour-guide/SKILL.md +18 -0
  51. package/skills/builtin/auth-flow-operator/SKILL.md +70 -0
  52. package/skills/builtin/autonomous-rag/SKILL.md +21 -0
  53. package/skills/builtin/backend-development/SKILL.md +265 -0
  54. package/skills/builtin/binary-analysis-analyst/SKILL.md +61 -0
  55. package/skills/builtin/binary-analysis-core/SKILL.md +65 -0
  56. package/skills/builtin/binary-recon/SKILL.md +64 -0
  57. package/skills/builtin/blackboard-coordination/SKILL.md +56 -0
  58. package/skills/builtin/blog-to-podcast/SKILL.md +18 -0
  59. package/skills/builtin/blog-writing/SKILL.md +36 -0
  60. package/skills/builtin/brainstorming/SKILL.md +69 -0
  61. package/skills/builtin/brand-design/SKILL.md +42 -0
  62. package/skills/builtin/ci-cd-pipelines/SKILL.md +210 -0
  63. package/skills/builtin/cloud-infrastructure/SKILL.md +140 -0
  64. package/skills/builtin/code-review/SKILL.md +88 -0
  65. package/skills/builtin/code-review-analyst/SKILL.md +96 -0
  66. package/skills/builtin/code-review-recon/SKILL.md +64 -0
  67. package/skills/builtin/code-review-verifier/SKILL.md +55 -0
  68. package/skills/builtin/coding-agent-team/SKILL.md +13 -0
  69. package/skills/builtin/competitor-intelligence/SKILL.md +39 -0
  70. package/skills/builtin/content-engine/SKILL.md +82 -0
  71. package/skills/builtin/context7-docs/SKILL.md +145 -0
  72. package/skills/builtin/copywriting/SKILL.md +38 -0
  73. package/skills/builtin/corrective-rag/SKILL.md +19 -0
  74. package/skills/builtin/cost-optimization/SKILL.md +131 -0
  75. package/skills/builtin/crypto-vulnerability-analyst/SKILL.md +64 -0
  76. package/skills/builtin/customer-support/SKILL.md +48 -0
  77. package/skills/builtin/customer-voice-support/SKILL.md +43 -0
  78. package/skills/builtin/data-analysis/SKILL.md +57 -0
  79. package/skills/builtin/data-visualization/SKILL.md +33 -0
  80. package/skills/builtin/database-design/SKILL.md +119 -0
  81. package/skills/builtin/decision-helper/SKILL.md +84 -0
  82. package/skills/builtin/deep-research/SKILL.md +68 -0
  83. package/skills/builtin/deepwiki-research/SKILL.md +115 -0
  84. package/skills/builtin/dependency-audit/SKILL.md +46 -0
  85. package/skills/builtin/doc-coauthoring/SKILL.md +48 -0
  86. package/skills/builtin/docker-deployment/SKILL.md +243 -0
  87. package/skills/builtin/docx-generation/SKILL.md +135 -0
  88. package/skills/builtin/dry-run-harness/SKILL.md +61 -0
  89. package/skills/builtin/editor/SKILL.md +44 -0
  90. package/skills/builtin/email-drafter/SKILL.md +42 -0
  91. package/skills/builtin/error-handling/SKILL.md +82 -0
  92. package/skills/builtin/eval-harness/SKILL.md +197 -0
  93. package/skills/builtin/evaluation-framework/SKILL.md +51 -0
  94. package/skills/builtin/exploit-writer/SKILL.md +63 -0
  95. package/skills/builtin/fact-checker/SKILL.md +51 -0
  96. package/skills/builtin/filesystem-context/SKILL.md +47 -0
  97. package/skills/builtin/financial-coach/SKILL.md +18 -0
  98. package/skills/builtin/finding-chain-correlator/SKILL.md +70 -0
  99. package/skills/builtin/finding-verifier/SKILL.md +65 -0
  100. package/skills/builtin/frontend-design/SKILL.md +104 -0
  101. package/skills/builtin/frontend-development/SKILL.md +227 -0
  102. package/skills/builtin/frontend-slides/SKILL.md +155 -0
  103. package/skills/builtin/fullstack-project/SKILL.md +286 -0
  104. package/skills/builtin/game-development/SKILL.md +60 -0
  105. package/skills/builtin/git-workflow/SKILL.md +44 -0
  106. package/skills/builtin/i18n-localization/SKILL.md +38 -0
  107. package/skills/builtin/image-prompt-engineering/SKILL.md +37 -0
  108. package/skills/builtin/investment-research/SKILL.md +33 -0
  109. package/skills/builtin/investor-materials/SKILL.md +90 -0
  110. package/skills/builtin/javascript-surface-analyzer/SKILL.md +66 -0
  111. package/skills/builtin/markdown-reports/SKILL.md +68 -0
  112. package/skills/builtin/market-research/SKILL.md +69 -0
  113. package/skills/builtin/mcp-builder/SKILL.md +86 -0
  114. package/skills/builtin/meeting-notes/SKILL.md +47 -0
  115. package/skills/builtin/memory-safety-analyst/SKILL.md +61 -0
  116. package/skills/builtin/meta-controller/SKILL.md +44 -0
  117. package/skills/builtin/mixture-of-agents/SKILL.md +53 -0
  118. package/skills/builtin/monitoring-observability/SKILL.md +169 -0
  119. package/skills/builtin/negotiation-simulator/SKILL.md +24 -0
  120. package/skills/builtin/nestjs-development/SKILL.md +56 -0
  121. package/skills/builtin/nextjs-development/SKILL.md +55 -0
  122. package/skills/builtin/parallel-dispatch/SKILL.md +83 -0
  123. package/skills/builtin/pdf-generation/SKILL.md +169 -0
  124. package/skills/builtin/personal-finance/SKILL.md +17 -0
  125. package/skills/builtin/pev-workflow/SKILL.md +62 -0
  126. package/skills/builtin/planning-with-files/SKILL.md +59 -0
  127. package/skills/builtin/pptx-generation/SKILL.md +117 -0
  128. package/skills/builtin/prisma-orm/SKILL.md +48 -0
  129. package/skills/builtin/rag-database-routing/SKILL.md +38 -0
  130. package/skills/builtin/rapid-prototyping/SKILL.md +152 -0
  131. package/skills/builtin/react-development/SKILL.md +244 -0
  132. package/skills/builtin/react-native-mobile/SKILL.md +113 -0
  133. package/skills/builtin/refactoring/SKILL.md +39 -0
  134. package/skills/builtin/reflexive-metacognition/SKILL.md +29 -0
  135. package/skills/builtin/riper-workflow/SKILL.md +214 -0
  136. package/skills/builtin/security-audit/SKILL.md +113 -0
  137. package/skills/builtin/security-self-audit/SKILL.md +311 -0
  138. package/skills/builtin/self-evolving-agent/SKILL.md +28 -0
  139. package/skills/builtin/self-improvement-loop/SKILL.md +58 -0
  140. package/skills/builtin/semantic-search/SKILL.md +93 -0
  141. package/skills/builtin/seo-audit-team/SKILL.md +27 -0
  142. package/skills/builtin/seo-optimization/SKILL.md +49 -0
  143. package/skills/builtin/server-management/SKILL.md +190 -0
  144. package/skills/builtin/social-media-content/SKILL.md +50 -0
  145. package/skills/builtin/sprint-planner/SKILL.md +49 -0
  146. package/skills/builtin/strategic-compact/SKILL.md +61 -0
  147. package/skills/builtin/strategy-advisor/SKILL.md +51 -0
  148. package/skills/builtin/structured-thinking/SKILL.md +70 -0
  149. package/skills/builtin/subagent-development/SKILL.md +105 -0
  150. package/skills/builtin/system-design/SKILL.md +66 -0
  151. package/skills/builtin/systematic-debugging/SKILL.md +87 -0
  152. package/skills/builtin/tailwind-css/SKILL.md +55 -0
  153. package/skills/builtin/taint-flow-tracer/SKILL.md +89 -0
  154. package/skills/builtin/teaching-agent-team/SKILL.md +32 -0
  155. package/skills/builtin/tech-debt-manager/SKILL.md +67 -0
  156. package/skills/builtin/technical-documentation/SKILL.md +47 -0
  157. package/skills/builtin/test-driven-development/SKILL.md +70 -0
  158. package/skills/builtin/theme-factory/SKILL.md +244 -0
  159. package/skills/builtin/threat-model-generator/SKILL.md +105 -0
  160. package/skills/builtin/trust-layer/SKILL.md +43 -0
  161. package/skills/builtin/typescript-patterns/SKILL.md +61 -0
  162. package/skills/builtin/ui-ux-design/SKILL.md +75 -0
  163. package/skills/builtin/verification-before-completion/SKILL.md +41 -0
  164. package/skills/builtin/verification-loop/SKILL.md +120 -0
  165. package/skills/builtin/waf-bypass-agent/SKILL.md +97 -0
  166. package/skills/builtin/web-artifacts-builder/SKILL.md +117 -0
  167. package/skills/builtin/web-assessment-executor/SKILL.md +66 -0
  168. package/skills/builtin/web-exploit-prover/SKILL.md +58 -0
  169. package/skills/builtin/web-scraping/SKILL.md +63 -0
  170. package/skills/builtin/webapp-testing/SKILL.md +86 -0
  171. package/skills/builtin/webhook-development/SKILL.md +62 -0
  172. package/skills/builtin/writing-skills/SKILL.md +67 -0
  173. package/skills/builtin/xlsx-generation/SKILL.md +116 -0
@@ -0,0 +1,227 @@
1
+ ---
2
+ name: frontend-development
3
+ description: "Use this skill when the user asks to build a website, web page, landing page, web UI, HTML/CSS/JS project, or any browser-based interface. Triggers: 'build me a website', 'create a landing page', 'make a web app', 'HTML page', 'frontend', 'web UI', 'responsive layout', 'CSS', styling tasks, accessibility fixes, or any request to create something that runs in a browser. Covers HTML, CSS, JavaScript, responsive design, accessibility, and modern web standards."
4
+ license: MIT
5
+ ---
6
+
7
+ # Frontend Development
8
+
9
+ ## What This Skill Does
10
+
11
+ Build complete, production-quality web interfaces. HTML, CSS, JavaScript. Responsive layouts, accessibility, modern patterns. From single landing pages to multi-page sites.
12
+
13
+ ## Before You Start
14
+
15
+ 1. **Fetch current docs** via Context7 if using any CSS framework (Tailwind, Bootstrap) or JS library
16
+ 2. **Check DeepWiki** if integrating with an unfamiliar frontend framework or build tool
17
+ 3. **Ask the user** about target browsers, mobile requirements, and any existing design system
18
+
19
+ ## Project Structure
20
+
21
+ ### Single Page
22
+ ```
23
+ index.html # Everything in one file for simple projects
24
+ ```
25
+
26
+ ### Multi-Page Site
27
+ ```
28
+ project/
29
+ ├── index.html
30
+ ├── about.html
31
+ ├── css/
32
+ │ └── styles.css
33
+ ├── js/
34
+ │ └── main.js
35
+ ├── assets/
36
+ │ └── images/
37
+ └── README.md
38
+ ```
39
+
40
+ ## HTML Standards
41
+
42
+ Write semantic HTML5. Every page needs:
43
+
44
+ ```html
45
+ <!DOCTYPE html>
46
+ <html lang="en">
47
+ <head>
48
+ <meta charset="UTF-8">
49
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
50
+ <meta name="description" content="Page description for SEO">
51
+ <title>Page Title</title>
52
+ </head>
53
+ <body>
54
+ <header>...</header>
55
+ <nav>...</nav>
56
+ <main>...</main>
57
+ <footer>...</footer>
58
+ </body>
59
+ </html>
60
+ ```
61
+
62
+ Semantic elements over divs: `<header>`, `<nav>`, `<main>`, `<section>`, `<article>`, `<aside>`, `<footer>`. Use `<div>` only when no semantic element fits.
63
+
64
+ ## CSS Patterns
65
+
66
+ ### Layout (use modern CSS)
67
+ - **Flexbox** for one-dimensional layouts (navbars, card rows, centering)
68
+ - **CSS Grid** for two-dimensional layouts (page layouts, dashboards, galleries)
69
+ - **Container queries** for component-level responsiveness
70
+ - Never use floats for layout
71
+
72
+ ### Responsive Design
73
+ ```css
74
+ /* Mobile-first breakpoints */
75
+ /* Base styles = mobile */
76
+ @media (min-width: 768px) { /* Tablet */ }
77
+ @media (min-width: 1024px) { /* Desktop */ }
78
+ @media (min-width: 1440px) { /* Large desktop */ }
79
+ ```
80
+
81
+ Use `clamp()` for fluid typography: `font-size: clamp(1rem, 2.5vw, 2rem);`
82
+
83
+ ### CSS Variables for Theming
84
+ ```css
85
+ :root {
86
+ --color-primary: #2563eb;
87
+ --color-surface: #ffffff;
88
+ --color-text: #1a1a2e;
89
+ --radius: 8px;
90
+ --shadow: 0 2px 8px rgba(0,0,0,0.08);
91
+ --transition: 200ms ease;
92
+ }
93
+
94
+ @media (prefers-color-scheme: dark) {
95
+ :root {
96
+ --color-surface: #0f0f1a;
97
+ --color-text: #e2e2e8;
98
+ }
99
+ }
100
+ ```
101
+
102
+ ### Animation
103
+ Prefer CSS transitions and animations over JavaScript. Use `prefers-reduced-motion`:
104
+
105
+ ```css
106
+ @media (prefers-reduced-motion: reduce) {
107
+ *, *::before, *::after {
108
+ animation-duration: 0.01ms !important;
109
+ transition-duration: 0.01ms !important;
110
+ }
111
+ }
112
+ ```
113
+
114
+ ## JavaScript Patterns
115
+
116
+ ### Modern JS (ES2022+)
117
+ - `const` and `let` only, never `var`
118
+ - Arrow functions for callbacks
119
+ - Template literals for string interpolation
120
+ - Optional chaining (`?.`) and nullish coalescing (`??`)
121
+ - `async/await` over `.then()` chains
122
+ - `fetch()` for HTTP requests
123
+
124
+ ### DOM Manipulation
125
+ ```javascript
126
+ // Query
127
+ const el = document.querySelector('.selector');
128
+ const els = document.querySelectorAll('.selector');
129
+
130
+ // Events (use delegation for dynamic content)
131
+ document.addEventListener('click', (e) => {
132
+ if (e.target.matches('.button')) {
133
+ handleClick(e.target);
134
+ }
135
+ });
136
+
137
+ // Create elements
138
+ const card = document.createElement('article');
139
+ card.className = 'card';
140
+ card.innerHTML = `<h3>${title}</h3><p>${description}</p>`;
141
+ container.appendChild(card);
142
+ ```
143
+
144
+ ### Form Handling
145
+ ```javascript
146
+ const form = document.querySelector('form');
147
+ form.addEventListener('submit', async (e) => {
148
+ e.preventDefault();
149
+ const data = new FormData(form);
150
+ const body = Object.fromEntries(data);
151
+
152
+ try {
153
+ const res = await fetch('/api/submit', {
154
+ method: 'POST',
155
+ headers: { 'Content-Type': 'application/json' },
156
+ body: JSON.stringify(body)
157
+ });
158
+ if (!res.ok) throw new Error(`HTTP ${res.status}`);
159
+ const result = await res.json();
160
+ showSuccess(result);
161
+ } catch (err) {
162
+ showError(err.message);
163
+ }
164
+ });
165
+ ```
166
+
167
+ ## Accessibility Checklist
168
+
169
+ Every page must pass these checks:
170
+
171
+ - All images have `alt` text (decorative images get `alt=""`)
172
+ - All interactive elements are keyboard-accessible (Tab, Enter, Escape)
173
+ - Color contrast ratio meets WCAG AA (4.5:1 for text, 3:1 for large text)
174
+ - Form inputs have associated `<label>` elements
175
+ - Page has a single `<h1>` and heading hierarchy doesn't skip levels
176
+ - Focus states are visible (never `outline: none` without a replacement)
177
+ - ARIA attributes used correctly: `aria-label`, `aria-expanded`, `aria-hidden`
178
+ - Skip-to-content link for screen readers
179
+ - Language attribute on `<html>` tag
180
+
181
+ ## Performance
182
+
183
+ - Images: use `loading="lazy"`, provide `width` and `height`, use modern formats (WebP, AVIF)
184
+ - Fonts: `font-display: swap`, preload critical fonts, limit to 2 families max
185
+ - CSS: critical styles inline in `<head>`, rest loaded async
186
+ - JS: `defer` attribute on scripts, avoid render-blocking
187
+ - Largest Contentful Paint target: under 2.5 seconds
188
+
189
+ ## Verification
190
+
191
+ Before marking complete:
192
+ 1. Open in browser and test all interactive elements
193
+ 2. Resize to mobile, tablet, desktop widths
194
+ 3. Tab through the page for keyboard accessibility
195
+ 4. Check console for errors
196
+ 5. Validate HTML at validator.w3.org (if available)
197
+ 6. Test dark mode if implemented
198
+
199
+ ## Integration with Other Skills
200
+
201
+ - **context7-docs:** Fetch current Tailwind/Bootstrap docs before using utility classes
202
+ - **react-development:** Use that skill instead when the user specifies React
203
+ - **frontend-design:** Use that skill for visual design direction and aesthetic choices
204
+ - **web-artifacts-builder:** Use that skill for self-contained single-file web tools
205
+
206
+ ## Code Project Blocks (v0/Vercel pattern)
207
+
208
+ Group related files into coherent units. Present component + styles + tests + types together. When modifying existing code, show only changed sections with clear markers.
209
+
210
+ Give every task a descriptive name: "Creating authentication form" not "Writing code."
211
+
212
+ Default to shadcn/ui when available and no other library specified.
213
+
214
+ ## Discussion-First (Lovable pattern)
215
+
216
+ Ambiguous requests: discuss purpose, audience, constraints before building.
217
+ Clear requests: build immediately.
218
+ Keep non-code responses under 2 lines unless detail is requested.
219
+
220
+ ## Auto-SEO
221
+
222
+ Every page gets without being asked:
223
+ - `<title>` with descriptive content
224
+ - `<meta name="description">` with compelling summary
225
+ - Open Graph tags (og:title, og:description, og:image)
226
+ - Semantic HTML for crawlers
227
+ - `lang` attribute on `<html>`
@@ -0,0 +1,155 @@
1
+ # Frontend Slides
2
+
3
+ Create zero-dependency, animation-rich HTML presentations that run entirely in the browser.
4
+
5
+ ## When to Activate
6
+
7
+ - Creating a talk deck, pitch deck, workshop deck, or internal presentation
8
+ - Converting `.ppt` or `.pptx` slides into an HTML presentation
9
+ - Improving an existing HTML presentation's layout, motion, or typography
10
+ - Exploring presentation styles with a user who does not know their design preference yet
11
+
12
+ ## Non-Negotiables
13
+
14
+ 1. **Zero dependencies**: default to one self-contained HTML file with inline CSS and JS.
15
+ 2. **Viewport fit is mandatory**: every slide must fit inside one viewport with no internal scrolling.
16
+ 3. **Show, don't tell**: use visual previews instead of abstract style questionnaires.
17
+ 4. **Distinctive design**: avoid generic purple-gradient, Inter-on-white, template-looking decks.
18
+ 5. **Production quality**: keep code commented, accessible, responsive, and performant.
19
+
20
+ ## Workflow
21
+
22
+ ### 1. Detect Mode
23
+
24
+ Choose one path:
25
+ - **New presentation**: user has a topic, notes, or full draft
26
+ - **PPT conversion**: user has `.ppt` or `.pptx`
27
+ - **Enhancement**: user already has HTML slides and wants improvements
28
+
29
+ ### 2. Discover Content
30
+
31
+ Ask only the minimum needed:
32
+ - purpose: pitch, teaching, conference talk, internal update
33
+ - length: short (5-10), medium (10-20), long (20+)
34
+ - content state: finished copy, rough notes, topic only
35
+
36
+ If the user has content, ask them to paste it before styling.
37
+
38
+ ### 3. Discover Style
39
+
40
+ Default to visual exploration.
41
+
42
+ If the user already knows the desired preset, skip previews and use it directly.
43
+
44
+ Otherwise:
45
+ 1. Ask what feeling the deck should create: impressed, energized, focused, inspired.
46
+ 2. Generate **3 single-slide preview files** in `.ecc-design/slide-previews/`.
47
+ 3. Each preview must be self-contained, show typography/color/motion clearly, and stay under roughly 100 lines of slide content.
48
+ 4. Ask the user which preview to keep or what elements to mix.
49
+
50
+ ### 4. Build the Presentation
51
+
52
+ Output either:
53
+ - `presentation.html`
54
+ - `[presentation-name].html`
55
+
56
+ Use an `assets/` folder only when the deck contains extracted or user-supplied images.
57
+
58
+ Required structure:
59
+ - semantic slide sections
60
+ - a viewport-safe CSS base
61
+ - CSS custom properties for theme values
62
+ - a presentation controller class for keyboard, wheel, and touch navigation
63
+ - Intersection Observer for reveal animations
64
+ - reduced-motion support
65
+
66
+ ### 5. Enforce Viewport Fit
67
+
68
+ Treat this as a hard gate.
69
+
70
+ Rules:
71
+ - every `.slide` must use `height: 100vh; height: 100dvh; overflow: hidden;`
72
+ - all type and spacing must scale with `clamp()`
73
+ - when content does not fit, split into multiple slides
74
+ - never solve overflow by shrinking text below readable sizes
75
+ - never allow scrollbars inside a slide
76
+
77
+ ### 6. Validate
78
+
79
+ Check the finished deck at these sizes:
80
+ - 1920x1080
81
+ - 1280x720
82
+ - 768x1024
83
+ - 375x667
84
+ - 667x375
85
+
86
+ ### 7. Deliver
87
+
88
+ At handoff:
89
+ - delete temporary preview files unless the user wants to keep them
90
+ - open the deck with the platform-appropriate opener when useful
91
+ - summarize file path, preset used, slide count, and easy theme customization points
92
+
93
+ ## PPT / PPTX Conversion
94
+
95
+ For PowerPoint conversion:
96
+ 1. Prefer `python3` with `python-pptx` to extract text, images, and notes.
97
+ 2. If `python-pptx` is unavailable, ask whether to install it or fall back to a manual/export-based workflow.
98
+ 3. Preserve slide order, speaker notes, and extracted assets.
99
+ 4. After extraction, run the same style-selection workflow as a new presentation.
100
+
101
+ ## Implementation Requirements
102
+
103
+ ### HTML / CSS
104
+
105
+ - Use inline CSS and JS unless the user explicitly wants a multi-file project.
106
+ - Fonts may come from Google Fonts or Fontshare.
107
+ - Prefer atmospheric backgrounds, strong type hierarchy, and a clear visual direction.
108
+ - Use abstract shapes, gradients, grids, noise, and geometry rather than illustrations.
109
+
110
+ ### JavaScript
111
+
112
+ Include:
113
+ - keyboard navigation
114
+ - touch / swipe navigation
115
+ - mouse wheel navigation
116
+ - progress indicator or slide index
117
+ - reveal-on-enter animation triggers
118
+
119
+ ### Accessibility
120
+
121
+ - use semantic structure (`main`, `section`, `nav`)
122
+ - keep contrast readable
123
+ - support keyboard-only navigation
124
+ - respect `prefers-reduced-motion`
125
+
126
+ ## Content Density Limits
127
+
128
+ | Slide type | Limit |
129
+ |------------|-------|
130
+ | Title | 1 heading + 1 subtitle + optional tagline |
131
+ | Content | 1 heading + 4-6 bullets or 2 short paragraphs |
132
+ | Feature grid | 6 cards max |
133
+ | Code | 8-10 lines max |
134
+ | Quote | 1 quote + attribution |
135
+ | Image | 1 image constrained by viewport |
136
+
137
+ ## Style Presets
138
+
139
+ ### Mood to Preset Mapping
140
+
141
+ | Mood | Good Presets |
142
+ |------|--------------|
143
+ | Impressed / Confident | Bold Signal, Electric Studio, Dark Botanical |
144
+ | Excited / Energized | Creative Voltage, Neon Cyber, Split Pastel |
145
+ | Calm / Focused | Notebook Tabs, Paper & Ink, Swiss Modern |
146
+ | Inspired / Moved | Dark Botanical, Vintage Editorial, Pastel Geometry |
147
+
148
+ ## Anti-Patterns
149
+
150
+ - generic startup gradients with no visual identity
151
+ - system-font decks unless intentionally editorial
152
+ - bullet walls
153
+ - code blocks that need scrolling
154
+ - fixed-height content boxes that break on short screens
155
+ - invalid negated CSS functions like `-clamp(...)`
@@ -0,0 +1,286 @@
1
+ ---
2
+ name: fullstack-project
3
+ description: "Use this skill when the user asks to build a complete application with both frontend and backend, scaffold a new project from scratch, or create an end-to-end app. Triggers: 'build me an app', 'create a full application', 'fullstack', 'full-stack', 'scaffold a project', 'starter template', 'boilerplate', 'SaaS app', 'web application', or any request requiring both client and server code together."
4
+ license: MIT
5
+ ---
6
+
7
+ # Fullstack Project Scaffolding
8
+
9
+ ## What This Skill Does
10
+
11
+ Scaffold and build complete applications with frontend, backend, database, and deployment config. End-to-end project setup from zero to running app.
12
+
13
+ ## Before You Start
14
+
15
+ 1. **Context7:** Fetch docs for the chosen framework stack
16
+ 2. **DeepWiki:** Research any unfamiliar libraries in the stack
17
+ 3. **Ask the user** about their preferred stack if not specified. Default: Bun + Hono + React + PostgreSQL + TypeScript
18
+
19
+ ## Stack Options
20
+
21
+ ### Default (Fenix Native)
22
+ ```
23
+ Runtime: Bun
24
+ Backend: Hono
25
+ Frontend: React + Vite
26
+ Database: PostgreSQL + Drizzle ORM
27
+ Auth: JWT + bcrypt
28
+ Styling: Tailwind CSS
29
+ ```
30
+
31
+ ### Common Alternatives
32
+ | Layer | Options |
33
+ |-------|---------|
34
+ | Runtime | Node.js, Deno |
35
+ | Backend | Express, Fastify, Next.js API routes, NestJS |
36
+ | Frontend | Next.js, Vue + Nuxt, Svelte + SvelteKit, Astro |
37
+ | Database | SQLite, MySQL, MongoDB, Supabase |
38
+ | ORM | Prisma, Drizzle, Kysely, TypeORM |
39
+ | Auth | Auth.js, Lucia, Clerk, Supabase Auth |
40
+
41
+ ## Project Structure
42
+
43
+ ```
44
+ project/
45
+ ├── apps/
46
+ │ ├── web/ # Frontend
47
+ │ │ ├── src/
48
+ │ │ │ ├── components/ # Reusable UI components
49
+ │ │ │ ├── pages/ # Page components / routes
50
+ │ │ │ ├── hooks/ # Custom React hooks
51
+ │ │ │ ├── lib/ # API client, utilities
52
+ │ │ │ ├── styles/ # Global styles
53
+ │ │ │ └── App.tsx
54
+ │ │ ├── index.html
55
+ │ │ ├── vite.config.ts
56
+ │ │ └── package.json
57
+ │ └── server/ # Backend
58
+ │ ├── src/
59
+ │ │ ├── routes/
60
+ │ │ ├── services/
61
+ │ │ ├── middleware/
62
+ │ │ ├── db/
63
+ │ │ └── index.ts
64
+ │ ├── .env.example
65
+ │ └── package.json
66
+ ├── packages/
67
+ │ └── shared/ # Shared types, validators
68
+ │ ├── src/
69
+ │ │ ├── types.ts
70
+ │ │ └── validators.ts
71
+ │ └── package.json
72
+ ├── docker-compose.yml
73
+ ├── package.json # Workspace root
74
+ ├── tsconfig.base.json
75
+ └── README.md
76
+ ```
77
+
78
+ ### Simpler Alternative (small projects)
79
+
80
+ ```
81
+ project/
82
+ ├── src/
83
+ │ ├── client/ # Frontend
84
+ │ ├── server/ # Backend
85
+ │ └── shared/ # Shared types
86
+ ├── docker-compose.yml
87
+ ├── package.json
88
+ └── README.md
89
+ ```
90
+
91
+ Choose the simpler structure for MVPs and small projects. Use the monorepo structure for anything intended to grow.
92
+
93
+ ## Scaffolding Workflow
94
+
95
+ ### Phase 1: Foundation
96
+ ```
97
+ 1. Initialize project with package.json and tsconfig
98
+ 2. Set up database schema and migrations
99
+ 3. Create .env.example with all required variables
100
+ 4. Build health check endpoint (/api/health)
101
+ 5. Verify: server starts, DB connects, health returns 200
102
+ ```
103
+
104
+ ### Phase 2: Core Backend
105
+ ```
106
+ 1. Auth routes (register, login, logout, refresh)
107
+ 2. Core resource CRUD routes
108
+ 3. Input validation with Zod schemas
109
+ 4. Error handling middleware
110
+ 5. Verify: all routes respond correctly to valid and invalid input
111
+ ```
112
+
113
+ ### Phase 3: Frontend Shell
114
+ ```
115
+ 1. Vite + React setup with routing
116
+ 2. API client with auth header injection
117
+ 3. Login/register pages
118
+ 4. Layout component with navigation
119
+ 5. Verify: can register, login, and see authenticated pages
120
+ ```
121
+
122
+ ### Phase 4: Features + Polish
123
+ ```
124
+ 1. Build out feature pages
125
+ 2. Loading states, error states, empty states
126
+ 3. Responsive design pass
127
+ 4. Docker Compose for local dev (app + db)
128
+ 5. README with setup instructions
129
+ ```
130
+
131
+ ## Essential Files
132
+
133
+ ### docker-compose.yml (Local Development)
134
+ ```yaml
135
+ services:
136
+ db:
137
+ image: postgres:16-alpine
138
+ environment:
139
+ POSTGRES_DB: appdb
140
+ POSTGRES_USER: appuser
141
+ POSTGRES_PASSWORD: devpassword
142
+ ports:
143
+ - "5432:5432"
144
+ volumes:
145
+ - pgdata:/var/lib/postgresql/data
146
+
147
+ volumes:
148
+ pgdata:
149
+ ```
150
+
151
+ ### .env.example
152
+ ```
153
+ DATABASE_URL=postgresql://appuser:devpassword@localhost:5432/appdb
154
+ JWT_SECRET=change-me-in-production
155
+ PORT=3000
156
+ NODE_ENV=development
157
+ ```
158
+
159
+ ### README.md Template
160
+ ```markdown
161
+ # Project Name
162
+
163
+ One-line description.
164
+
165
+ ## Setup
166
+
167
+ 1. Clone and install: `bun install`
168
+ 2. Start database: `docker compose up -d`
169
+ 3. Run migrations: `bun run db:migrate`
170
+ 4. Start dev server: `bun run dev`
171
+
172
+ ## Environment Variables
173
+
174
+ Copy `.env.example` to `.env` and fill in values.
175
+
176
+ | Variable | Description | Required |
177
+ |----------|-------------|----------|
178
+ | DATABASE_URL | PostgreSQL connection string | Yes |
179
+ | JWT_SECRET | Secret for signing JWTs | Yes |
180
+ | PORT | Server port (default: 3000) | No |
181
+
182
+ ## Scripts
183
+
184
+ | Command | Description |
185
+ |---------|-------------|
186
+ | `bun run dev` | Start development server |
187
+ | `bun run build` | Build for production |
188
+ | `bun run db:migrate` | Run database migrations |
189
+ | `bun run test` | Run tests |
190
+ ```
191
+
192
+ ## Rules
193
+
194
+ - Always create a working `.env.example` with every required variable documented
195
+ - Always include a `docker-compose.yml` for local database
196
+ - Always include a README with setup instructions that work from zero
197
+ - Shared types go in `packages/shared/` or `src/shared/`, never duplicated
198
+ - API client and server must agree on types (shared Zod schemas are ideal)
199
+ - Every route must have input validation
200
+ - Default to TypeScript strict mode
201
+
202
+ ## Verification
203
+
204
+ Before marking complete:
205
+ 1. `bun install` succeeds with no errors
206
+ 2. `docker compose up -d` starts the database
207
+ 3. `bun run dev` starts both frontend and backend
208
+ 4. Registration and login work end to end
209
+ 5. At least one CRUD resource works
210
+ 6. README instructions work from a clean clone
211
+
212
+ ## Integration with Other Skills
213
+
214
+ - **frontend-development:** Delegates frontend build details
215
+ - **backend-development:** Delegates API design details
216
+ - **database-design:** Delegates schema and migration strategy
217
+ - **docker-deployment:** Extends local Docker setup to production
218
+ - **context7-docs:** Fetch framework docs before scaffolding
219
+
220
+ ## Spec-Driven Development (Kiro pattern)
221
+
222
+ Before writing any code, produce three documents in order:
223
+
224
+ ### 1. requirements.md
225
+ User stories in "As a [role], I want [feature], so that [benefit]" format. Acceptance criteria in EARS format: "WHEN [event] THEN [system] SHALL [response]". Each requirement gets a unique ID (REQ-001).
226
+
227
+ ### 2. design.md
228
+ Architecture decisions, component breakdown, interface definitions, data models, error handling strategy, and testing strategy. Include mermaid diagrams where they clarify structure.
229
+
230
+ ### 3. tasks.md
231
+ Numbered checkbox list. Each task is a meaningful unit of work (~20 minutes for a professional developer). Tasks reference specific requirement IDs. Only coding tasks, no deployment or user testing.
232
+
233
+ **Each document requires user approval before proceeding to the next.** The agent cannot write implementation code during spec creation.
234
+
235
+ ## Mock-First Development (Emergent E1 pattern)
236
+
237
+ After specs are approved:
238
+
239
+ 1. Create `contracts.md` defining all API contracts (request/response shapes, status codes, error formats)
240
+ 2. Build mock implementations for every API endpoint (return hardcoded valid responses)
241
+ 3. Wire up the full flow with mocks. Verify the flow works end to end.
242
+ 4. Replace mocks with real implementations one at a time
243
+ 5. Test after each replacement. If a replacement breaks the flow, fix before proceeding.
244
+
245
+ This catches integration issues before real implementation begins.
246
+
247
+ ## Dynamic Scaffolding
248
+
249
+ Adapt project structure based on complexity discovered during planning. Start with the simplest viable structure. Add layers (services, middleware, queues) only when a specific requirement demands them.
250
+
251
+ ## Subagent Compilation Checker
252
+
253
+ For multi-module builds, delegate compile-checking to a subagent:
254
+
255
+ ### Pattern
256
+ After making changes across multiple packages/modules:
257
+ 1. Dispatch a compile-check subagent for each modified module
258
+ 2. Each subagent runs `tsc --noEmit` (or equivalent) in its module
259
+ 3. Collect results: which modules compile, which have errors
260
+ 4. If errors found, fix in dependency order (shared → server → web)
261
+
262
+ ### Implementation
263
+ ```typescript
264
+ // Dispatch compile checks in parallel for each modified module
265
+ const modules = getModifiedModules(gitDiff);
266
+ const checks = modules.map((mod) => ({
267
+ agent: "compile-checker",
268
+ prompt: `Run type checking in ${mod.path}. Report any errors.`,
269
+ cwd: mod.path,
270
+ tools: ["bash"], // minimal tool access
271
+ }));
272
+ const results = await Promise.all(checks.map(dispatchSubagent));
273
+
274
+ // Fix in dependency order
275
+ const failures = results.filter((r) => r.errors.length > 0);
276
+ const sorted = topologicalSort(failures, dependencyGraph);
277
+ for (const failure of sorted) {
278
+ await fixCompileErrors(failure);
279
+ }
280
+ ```
281
+
282
+ ### Rules
283
+ - Always check shared/common packages first (they affect downstream)
284
+ - Compile check uses `--noEmit` (no artifacts, just validation)
285
+ - If a fix in module A causes a new error in module B, re-check B
286
+ - Maximum 3 fix iterations per module before escalating