Expo Dom

Use Expo DOM components to run web code in a webview on native and as-is on web. Migrate web code to native incrementally. For the end-to-end migration of a whole web app, use the expo-web-to-native skill.

3,971 stars 249 forksMobile DevelopmentOfficial

Install

skills CLI (Claude Code, Cursor, Codex and more)

npx skills add expo/skills --skill expo-dom

Manual install

git clone --depth 1 https://github.com/expo/skills.git /tmp/skills
mkdir -p ~/.claude/skills
cp -r /tmp/skills/plugins/expo/skills/expo-dom ~/.claude/skills/expo-dom

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

## What are DOM Components?

DOM components allow web code to run verbatim in a webview on native platforms while rendering as-is on web. This enables using web-only libraries like `recharts`, `react-syntax-highlighter`, or any React web library in your Expo app without modification.

## When to Use DOM Components

Use DOM components when you need:

- **Web-only libraries** — Charts (recharts, chart.js), syntax highlighters, rich text editors, or any library that depends on DOM APIs
- **Migrating web code** — Bring existing React web components to native without rewriting
- **Complex HTML/CSS layouts** — When CSS features aren't available in React Native
- **iframes or embeds** — Embedding external content that requires a browser context
- **Canvas or WebGL** — Web graphics APIs not available natively

## When NOT to Use DOM Components

Avoid DOM components when:

- **Native performance is critical** — Webviews add overhead
- **Simple UI** — React Native components are more efficient for basic layouts
- **Deep native integration** — Use local modules instead for native APIs
- **Layout routes** — `_layout` files cannot be DOM components

## Basic DOM Component

Create a new file with the `'use dom';` directive at the top:

Read the full skill on GitHub

Details

Skill name: expo-dom
Repository: expo/skills
Path: plugins/expo/skills/expo-dom/SKILL.md
License: MIT
Repo updated: 30 October 2026
Listed in: heilcheng/awesome-agent-skills, travisvn/awesome-claude-skills

FAQ

What does the Expo Dom skill do?

How do I install the Expo Dom skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add expo/skills --skill expo-dom. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is Expo Dom popular?

It lives in expo/skills, which has 3,971 GitHub stars and 249 forks, and is included in 2 curated skill lists.

Related skills

Eas Hosting

expo/skills

Deploy Expo websites and Expo Router API routes to EAS Hosting - export the web bundle, run eas deploy for production and PR preview URLs, manage environment secrets and custom domains, and work within the Cloudflare Workers runtime. Also covers authoring API routes (+api.ts handlers, HTTP methods, request handling, CORS). Use when deploying an Expo web app or API routes, setting up EAS Hosting, or configuring hosting environments and domains. Not for native builds or store releases - use the eas-app-stores skill for those.

DevOps & CloudIn 2 lists249

Expo Native UI

expo/skills

Build beautiful, native-feeling Expo screens. Covers Apple HIG styling, semantic colors, native controls, SF Symbols, media, visual effects, gradients, storage, and responsive layout. For routing and navigation, use the expo-router skill; for motion and animation, use the expo-animation skill.

Mobile DevelopmentIn 2 lists249

Expo Router

expo/skills

Navigation and routing for Expo Router. Covers file-based routes, groups and dynamic routes, folder organization, Link with previews and context menus, native Stack, page titles, modals and form sheets, NativeTabs, headers and toolbars, and header search bars.

Mobile DevelopmentIn 2 lists249

Monkeydev

6.8k

AloneMonkey/MonkeyDev

使用 MonkeyDev 在 Apple Silicon Mac 上创建 Xcode MonkeyApp、MonkeyPod 插件库、越狱 Logos/CaptainHook Tweak 和 iOS 命令行工具，完成插件开发、签名打包、USB/SSH 安装，以及 LLDB 调试、OC 头文件导出、符号还原、Reveal/Lookin 视图检查和方法追踪。

Mobile Development1.2k

Vercel React Native Skills

33k

vercel-labs/agent-skills

React Native and Expo best practices for building performant mobile apps. Use when building React Native components, optimizing list performance, implementing animations, or working with native modules. Triggers on tasks involving React Native, Expo, mobile performance, or native platform APIs.

Mobile DevelopmentIn 2 lists2.9k

Expo Upgrade

expo/skills

Guidelines for upgrading Expo SDK versions and fixing dependency issues

Mobile DevelopmentIn 2 lists249

Browse the most popular Claude skills, all mobile development skills, or write your own with the skills generator.