skills.rest
billlzzz26
billlzzz26COMMUNITY
Explore all skills by this author →
GitHub

spark-app-template

Scaffold a Vite React TypeScript app with Tailwind CSS and shadcn UI.

4|1|Updated Feb 19, 2026
Search Tags:#typescript#template#react#vite#tailwind#shadcn#web
One-click install
npx skills add https://github.com/billlzzz26/visual-story-extension --skill spark-app-template
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: spark-app-template
Source: https://github.com/billlzzz26/visual-story-extension/tree/main/.github/plugins/spark/skills/spark-app-template
Command: npx skills add https://github.com/billlzzz26/visual-story-extension --skill spark-app-template

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Developers often spend excessive time configuring project scaffolds, choosing tech stacks, and ensuring design consistency for new web applications.

Core Features & Use Cases

  • Opinionated Stack: Sets up Vite, React 19+, TypeScript, Tailwind CSS, and shadcn/ui with proper path aliases.
  • Guided Workflow: Provides a step‑by‑step order for project creation, component installation, and routing setup to avoid configuration errors.
  • Design & Performance: Enforces OKLCH colors, accessibility contrasts, and Core Web Vitals targets for production‑ready apps.
  • Use Cases: Ideal for building dashboards, data tools, content sites, or any interactive web interface where a reliable foundation and design system are needed.

Quick Start

Use the spark app template skill to create a new Vite React TypeScript project configured with Tailwind and shadcn UI.

Frequently Asked Questions about spark-app-template

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I scaffold a Vite React TypeScript app with Tailwind and shadcn?▼

Scaffold a Vite React TypeScript app with Tailwind and shadcn using a guided workflow that configures project creation, component installation, and routing setup to avoid configuration errors. It provides opinionated defaults for immediate development.

What is the best way to set up TypeScript path aliases for a React dashboard?▼

Set up TypeScript path aliases for a React dashboard by applying an opinionated stack configuration that pre-configures Vite, React 19+, Tailwind CSS, and shadcn/ui. This ensures proper module resolution and design system consistency from the start.

Can I use this Vite React template for data visualization projects?▼

Yes, you can use this Vite React template for data visualization projects. It is specifically designed for building dashboards, data tools, and content sites, providing a reliable foundation with an integrated design system and interactive web interface support.

Does this React scaffold enforce accessibility contrast and Core Web Vitals?▼

Yes, this React scaffold enforces accessibility contrast and Core Web Vitals targets by applying OKLCH color standards and performance guidelines. It ensures production-ready apps meet modern web performance and accessibility requirements immediately.

What are the limitations of using an opinionated React stack for web development?▼

The limitation of using an opinionated React stack is that it enforces specific choices like Vite, React 19+, Tailwind CSS, and shadcn/ui. Developers needing alternative frameworks or custom design architectures may find these defaults restrictive for non-standard projects.

Related Skills

Explore More Software Engineering Skills→
GemachDAOGemachDAO
4

gdex-ui-install-setup

Scaffold a React or Next.js project with a GDEX SDK provider.

Official
Intermediate
aresbitaresbit
7

webapp-building

Create React web applications with TypeScript, Vite, Tailwind CSS, and shadcn/ui.

Community
Intermediate
SSujitXSSujitX
11

Frontend Development

Provides architectural guidance for authenticated Vite and React dashboard interfaces.

Community
Intermediate
finsilabsfinsilabs
44

jamstack-storefront

Build Jamstack e-commerce storefronts with Next.js or Astro and headless commerce APIs.

Official
Intermediate