Skills
.Work. You
Rest

react-pwa-designer

Official

Build robust React PWAs with offline-first design

Design & Creative#workflow#design#react#offline#pwa#shadcn
AuthorAeyeOps
Version1.0.0
Installs0

System Documentation

What problem does it solve?

The React PWA Designer provides a structured approach for planning, designing, and implementing modern React Progressive Web Apps that work offline, install cleanly, and adapt to various devices.

Core Features & Use Cases

  • SuperDesign-guided workflow: a four-phase process (Discovery, Design, PWA, and Development Best Practices) to shape architecture, components, and deployment.
  • shadcn/ui integration guidance: helps discover and implement shadcn/ui components with production-grade patterns.
  • PWA fundamentals & accessibility: covers manifest, service workers, offline strategies, performance optimization, and WCAG AA accessibility patterns. Use case: A frontend team designing a new PWA can follow this skill to map components, apply design patterns, implement PWA features, and validate accessibility.

Quick Start

Review the reference materials under reference/ and start with the layout design, then proceed to theme and animation steps using the SuperDesign workflow. Initialize a PWA-ready React project skeleton and iterate on component implementations with shadcn UI.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: react-pwa-designer
Download link: https://github.com/AeyeOps/aeo-skill-marketplace/archive/main.zip#react-pwa-designer

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.