use-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.
Profile →npx skills add sickn33/agentic-awesome-skills --skill use-dom --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
## 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 `'u
- What are DOM Components?
- When to Use DOM Components
- When NOT to Use DOM Components
- Basic DOM Component
- Rules for DOM Components
- The dom Prop
- Common dom Prop Options
- Exposing Native Actions to the Webview
- Using Web Libraries
- CSS in DOM Components
- Expo Router in DOM Components
- Router APIs That Require Props
- Detecting DOM Environment
- Assets
What does the use-dom skill do?
Use Expo DOM components to run web code in a webview on native and as-is on web. Migrate web code to native incrementally.
How do I install it?
Run `npx skills add sickn33/agentic-awesome-skills --skill use-dom --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From sickn33/agentic-awesome-skills, a repository with 44,414 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.