React Native & Mobile App Development

What it does

React Native & Mobile App Development is a Cursor skill: a SKILL.md playbook that AgenticKit installs at .cursor/skills/mobile-react-native. Cursor's agent loads it when the task matches the skill description, instead of stuffing the same rules into every chat.

Mobile app standards for React Native and Expo, covering file-based routing, native gesture handlers, offline caching, and push notifications.

Expo Router, native device APIs, responsive mobile styling, and offline cache. The file is domain knowledge, not a slash macro. You do not type it. The agent reads it when the job is mobile react native.

Why it exists

Default Cursor has no memory of how your team ships code, schema, and tests. Founders paste the same conventions into chat, then watch the model drift on the next turn. This skill exists so those conventions live on disk and load only when relevant.

It ships in the Engineering Kit. It is wired to the Mobile App Developer (mobile-engineer) and React 19 & Next.js Specialist (react-specialist) agents. It is wired to the /mobile-screen: React Native Mobile Screen Builder and /build-page: UI Page & Responsive Component Builder commands. That graph is the point: the skill is the standard, the agent is the role, the command is the trigger.

When to use it

• Use React Native & Mobile App Development when the work is specifically about expo router, native device apis, responsive mobile styling, and offline cache.
• Load it before a long session that will touch this surface more than once. A one-line edit does not need the full playbook.
• Use it on production SaaS work (multi-tenant apps, paid features, anything that will be reviewed) rather than a throwaway prototype.

When not to use it

• Do not treat the skill as a replacement for a slash command. Skills teach. Commands run a pipeline.
• Do not paste the whole SKILL.md into chat. If Cursor is not loading it, fix the description or invoke the matching command.
• Do not use it as a generic 'write better code' rule. Scope is this domain only.

Example workflow

1. Install the Engineering Kit so .cursor/skills/mobile-react-native lands in the repo.
2. Open a new Cursor agent chat pointed at the files this skill governs.
3. Ask the Mobile App Developer (mobile-engineer) to read the skill, or run /mobile-screen: React Native Mobile Screen Builder.
4. Review the first artifact against the practices below. If it violates one, stop and correct the file. Do not prompt 'just finish it'.
5. Commit the skill-guided files with the rest of the slice so the next session inherits the same standard.

Example usage

Example prompt: "Read .cursor/skills/mobile-react-native and apply it to this change. Do not invent extra conventions."

Or trigger the pipeline: /mobile-screen: React Native Mobile Screen Builder. That command is written to load this skill.

Check the output against: Use Expo Router for intuitive file-based routing and deep linking support

Example output

• The skill itself does not write a single output file. It changes what the agent is allowed to produce in code, schema, and tests.
• When you run /mobile-screen: React Native Mobile Screen Builder, expect repo files plus notes under docs/, not a chat-only answer.

Best practices

• Use Expo Router for intuitive file-based routing and deep linking support
• Cache API responses locally using SQLite or MMKV for instantaneous offline loads
• Optimize list rendering performance with FlashList instead of basic FlatList
• Handle safe area insets and notches cleanly across iPhone and Android devices

Common mistakes

• Ignoring "Use Expo Router for intuitive file-based routing and deep linking support" and hoping a later prompt will clean it up.
• Copying the skill into .cursor/rules as always-on. That burns context and fights Cursor's load-on-match design.
• Running two overlapping skills that contradict each other in the same turn.
• Letting the agent skip tests or types because 'the skill is about architecture'.