skills.rest
epiphanyapps
epiphanyappsOFFICIAL
Explore all skills by this author →
WebsiteGitHub

use-dom

Run web-only React libraries and components in Expo webviews via DOM APIs.

Updated Jan 17, 2026
Search Tags:#cross-platform#react native#web components#expo#dom#webview
One-click install
npx skills add https://github.com/epiphanyapps/mapyourhealth --skill use-dom-epiphanyapps
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: use-dom
Source: https://github.com/epiphanyapps/mapyourhealth/tree/main/.agents/skills/use-dom
Command: npx skills add https://github.com/epiphanyapps/mapyourhealth --skill use-dom-epiphanyapps

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill allows you to seamlessly integrate web-only libraries and existing web code into your Expo applications, enabling a unified development experience across native and web platforms.

Core Features & Use Cases

  • Web-only Libraries: Utilize libraries like recharts, react-syntax-highlighter, or any React web library that depends on DOM APIs directly within your Expo app.
  • Incremental Migration: Migrate existing React web components to native incrementally without a full rewrite.
  • Complex Layouts: Implement complex HTML/CSS layouts or use web graphics APIs like Canvas or WebGL that are not natively available.
  • Use Case: Embed a complex charting library like Recharts into your Expo app to visualize data, which would otherwise require a complete native rewrite.

Quick Start

Create a new file with the 'use dom'; directive at the top to define a DOM component.

Frequently Asked Questions about use-dom

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

FAQPage Schema
How do I use web-only React libraries like Recharts in a React Native Expo app?▼

You can use web-only React libraries in an Expo app by running them within a webview on native platforms. This allows libraries that depend on DOM APIs, like Recharts, to function without requiring a complete native rewrite.

Can I incrementally migrate existing React web components to native without a full rewrite?▼

Yes, you can migrate React web components to native incrementally by leveraging DOM APIs within a webview. This approach lets you run existing web code directly on native platforms, avoiding a full rewrite.

Does Expo support complex HTML, CSS layouts, and WebGL graphics on native?▼

Expo can support complex HTML, CSS layouts, Canvas, WebGL, and iframes on native by running the web code inside a webview. This provides access to web graphics APIs not natively available.

How do I define a DOM component to run web code on native and web platforms?▼

To define a DOM component, create a new file and add the 'use dom'; directive at the top. This enables the web code within the file to run directly on the web and inside a webview on native platforms.

What is the best way to run web code that depends on DOM APIs across native and web?▼

The best way to run web code with DOM dependencies across native and web is to use a webview on native platforms while running directly on the web. This unifies the development experience across platforms.

Can I embed iframes and web embeds in a React Native application?▼

Yes, you can embed iframes and other web embeds in a React Native application by rendering the web code within a webview on native platforms. This supports complex layouts and embeds natively unavailable.

Related Skills

Explore More Software Engineering Skills→
treesus6treesus6
1

use-dom

Integrate web code into Expo apps using DOM components in a WebView.

Community
Intermediate
miles990miles990
20

mobile

Provide patterns and best practices for React Native and Flutter mobile development.

Community
Intermediate
emilyLi2020emilyLi2020
2

expo-module

Create cross-platform native modules for Expo applications using the Expo Modules API.

Community
Intermediate
luke-h1luke-h1
13

use-dom

Run web-only React components in Expo apps via webview.

Community
Intermediate