use-dom

Name: use-dom
Availability: InStock
Author: raphaelmans

Run web components unchanged in native webviews across iOS, Android, and Web.

Updated Feb 28, 2026

Search Tags:#components #migration #react-native #expo #dom #webview #web-to-native

Ready to run

npx skills add https://github.com/raphaelmans/agent-skills --skill use-dom-raphaelmans

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: use-dom
Source: https://github.com/raphaelmans/agent-skills/tree/main/use-dom
Command: npx skills add https://github.com/raphaelmans/agent-skills --skill use-dom-raphaelmans

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Web-to-native integration friction by letting web code run in a native webview while remaining unchanged on the web.

Core Features & Use Cases

Run web libraries (e.g., charts, syntax highlighters) inside native apps without full porting.
Migrate existing web components to native incrementally.
Embed complex HTML/CSS or iframes in Expo apps with a browser context.

Quick Start

Create a new React component and add the 'use dom'; directive at the top, then export a single default component.

Frequently Asked Questions about use-dom

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I run web code in React Native without rewriting components?▼

To run web code in React Native, you can use a 'use dom' directive in a React component to execute web code inside a native webview. This allows existing web libraries and HTML to render on iOS and Android without requiring a full port.

Can I use web libraries like charts or syntax highlighters in Expo apps?▼

Yes, you can use web libraries in Expo apps by embedding them within a DOM component. The web code runs inside a native webview browser context, enabling complex libraries to function on mobile platforms unchanged.

What is the best way to migrate web components to native incrementally?▼

Migrating web components to native incrementally is achieved by using the 'use dom' directive to isolate web UI in a webview. This eliminates porting friction by letting the web code remain unchanged while running on native platforms.

Does embedding complex HTML and CSS in Expo require a full webview setup?▼

Embedding complex HTML and CSS in Expo does not require a manual webview setup; adding the 'use dom' directive to a React component provides the necessary browser context. The component must have a single default export to function correctly.

How do I add scripts and assets to a DOM component in React Native?▼

To add scripts and assets to a DOM component in React Native, you define optional DOM resources alongside the 'use dom' directive. This provides references for scripts and assets needed by the embedded web code.

Are there limitations when using 'use dom' for web-to-native migration?▼

A limitation of using the 'use dom' directive is that it enforces one default export per component and requires a 'use dom' directive at the top. Complex native integrations outside the webview browser context may still need alternative native code.