Skip to main content
Mobile Launcher
Advanced AI

Claude Skills

The Claude Code skills bundled with the boilerplate under .claude/skills

Claude Skills

The boilerplate bundles a set of Claude Code skills under .claude/skills/. Skills are reusable, model-invoked playbooks — when you describe a task that matches one, Claude Code loads that skill's instructions and follows them. They ship in the repo, so any AI assistant that reads .claude/skills/ gets them for free.

Skills are just folders with a SKILL.md. They're versioned in the repo alongside your code, so they stay in sync with the boilerplate's actual architecture instead of drifting out of date.

Bundled skills

SkillWhat it does
mobilelauncherGenerate boilerplate-consistent code: features, screens, components, hooks, Redux slices, RTK Query endpoints, and Zod schemas
claude-design-idea-to-readyDrive a UI from a one-line idea to on-brand, shippable design — foundation first, generation last
configure-analyticsWalk you through wiring Firebase Analytics + Crashlytics into your own project
configure-revenuecatWalk you through connecting RevenueCat and your store products

mobilelauncher — the getting-started skill

The project skill for adding anything new to the codebase. It knows the boilerplate's feature-first architecture, its styling system, and its TypeScript strict rules, and generates code that matches — so new work looks like it belongs.

Ask for any of these and it scaffolds them consistently:

  • feature <name> — a new feature folder
  • screen <feature> <name> — a screen inside a feature
  • component <name> — a reusable UI component
  • hook <name> — a custom hook
  • slice <feature> — a Redux slice
  • endpoint <feature> <name> — an RTK Query endpoint
  • schema <name> — a Zod schema
  • orient — get your bearings in the codebase

New here? Run the orient action first to have the skill explain how the pieces fit together before you generate anything.


claude-design-idea-to-ready — the design skill

A token-first design pipeline: it takes a UI from a one-line idea to on-brand output in the order that actually produces on-brand results — brand foundation first, generation last.

The core rule: the model can only be as on-brand as the constraints it has before it generates. So the skill front-loads the work — it won't generate a screen until the foundation exists:

  1. Foundation — a single source of truth for tokens (color, type, spacing, radius as names, not raw hex) plus a design-rules block in CLAUDE.md.
  2. Components before screens — define primitives with their variants and states first.
  3. Screens and hierarchy — compose from components; one primary action per screen.
  4. Interactions and states — loading, empty, error, transitions.
  5. Accessibility pass — contrast, touch targets, semantics.
  6. Generate — only now, against the foundation.
  7. Verify — read the output back against the design rules to catch invented hex or a second primary action.

This is the same workflow described in AI Design with Claude — the skill packages it so Claude Code follows it every time you design a screen.


configure-analytics — wire up analytics

A guided setup skill for connecting Firebase Analytics + Crashlytics to your own project. Analytics and crash reporting are already wired in code; the native builds just need your Firebase config files. This skill walks you through supplying them and verifying events land.

Pair it with the Firebase MCP server so the assistant can read your GA4 data back and confirm the wiring works end to end. Full manual steps live in the Firebase Integration guide.


configure-revenuecat — wire up subscriptions

A guided setup skill for connecting RevenueCat: your API keys, store products, entitlement, and offering. The entitlement is parameterized via EXPO_PUBLIC_REVENUECAT_ENTITLEMENT_ID, so the skill helps you set that and match it to what you create in the RevenueCat dashboard.

Pair it with the RevenueCat MCP server to inspect your products and subscriptions from the assistant. Full manual steps live in the RevenueCat Integration guide.


Using a skill

In Claude Code, you don't invoke skills manually — describe what you want and the matching skill loads automatically. For example:

"Add a new journal feature with a list screen and a Redux slice."

triggers mobilelauncher, while

"Design the settings screen so it matches our brand."

triggers claude-design-idea-to-ready. The skills live in .claude/skills/ if you want to read or extend them.