Initial Spark Skill #9
Conversation
There was a problem hiding this comment.
Pull request overview
This PR introduces a comprehensive "Spark App Template" skill that provides opinionated guidance for building modern web applications. The skill includes detailed stack templates for different application types (default web app, data dashboard, content showcase, complex application) and extensive reference materials covering design systems, typography, color palettes, component patterns, and performance optimization.
Changes:
- Added main SKILL.md entry point with quick start workflow and tech stack foundation
- Added four stack variation templates with specific package recommendations and patterns
- Added seven reference guides covering design, typography, colors, components, performance, PRD templates, and Radix migration
Reviewed changes
Copilot reviewed 12 out of 12 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| SKILL.md | Main entry point defining when to use the skill, quick start workflow, and core tech stack |
| stacks/default-webapp.md | Template for general-purpose web applications with package versions and setup instructions |
| stacks/data-dashboard.md | Template for analytics/admin panels with data visualization packages |
| stacks/content-showcase.md | Template for content-focused sites with typography emphasis |
| stacks/complex-application.md | Template for SaaS/enterprise apps with state management and advanced patterns |
| references/typography-pairings.md | Font pairing recommendations with personality guidance |
| references/radix-migration-guide.md | Migration path from Radix UI to Base UI alternatives |
| references/prd-template.md | Planning framework for new applications |
| references/performance-checklist.md | Core Web Vitals optimization guide |
| references/design-system.md | Comprehensive design philosophy and implementation patterns |
| references/component-patterns.md | shadcn/ui usage patterns and best practices |
| references/color-palettes.md | Pre-curated OKLCH color palettes with accessibility validation |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| const { data, isLoading } = useQuery({ | ||
| queryKey: ['users', page], | ||
| queryFn: () => fetchUsers(page), | ||
| keepPreviousData: true, |
There was a problem hiding this comment.
The option "keepPreviousData" has been renamed to "placeholderData" in TanStack Query v5. This code uses the deprecated v4 API. Update to use "placeholderData: 'previous'" or the appropriate v5 pattern for maintaining previous data during refetches.
| keepPreviousData: true, | |
| placeholderData: 'previous', |
| "typescript": "~5.9.0", | ||
| "@tailwindcss/vite": "^4.1.11", | ||
| "tailwindcss": "^4.1.11", | ||
| "biome": "^2.3.0", |
There was a problem hiding this comment.
The package name "biome" should be "@biomejs/biome" for correct installation. The documentation inconsistently uses both forms - line 28 shows "biome" but line 117 and SKILL.md correctly show "@biomejs/biome".
| "biome": "^2.3.0", | |
| "@biomejs/biome": "^2.3.0", |
Spark App Template provides defaults and guidance for building web applications. When a user asks to build a web app, this skill provides the technical foundation and design direction to create functional applications.
When to Use This Skill
Activate Spark App Template when the user: