skills.rest
NitzanSelwyn
NitzanSelwynCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

use-dom

Run web-centric DOM code in Expo apps via webview with 'use dom' directives.

Updated Feb 26, 2026
Search Tags:#cross-platform#react-native#expo#webview#dom-components#use-dom
One-click install
npx skills add https://github.com/NitzanSelwyn/MomentumTrackerAdmin --skill use-dom-nitzanselwyn
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: use-dom
Source: https://github.com/NitzanSelwyn/MomentumTrackerAdmin/tree/main/.claude/skills/use-dom
Command: npx skills add https://github.com/NitzanSelwyn/MomentumTrackerAdmin --skill use-dom-nitzanselwyn

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Running web-centric DOM code inside native Expo apps typically required rewrites or bridge hacks. This skill provides a pattern to render web code in a webview on native while preserving behavior on web, enabling incremental migration.

Core Features & Use Cases

  • Unified rendering: execute DOM-based components in a webview for native while keeping web rendering unchanged on the web.
  • Incremental migration: migrate existing web components to native progressively to reduce rewrite work.
  • Library compatibility: use web libraries that depend on the DOM (charts, syntax highlighters, editors) within Expo apps.

Quick Start

Create a new DOM component with the 'use dom'; directive at the top and render it in your Expo app to begin embedding web content inside a native context.

Frequently Asked Questions about use-dom

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

FAQPage Schema
How do I run existing web components inside a native Expo app?▼

You can run web components inside a native Expo app by rendering them via a webview while keeping standard web rendering intact. This approach allows incremental migration of existing web components and embedding DOM-dependent libraries without rewrites.

Can I use web libraries that depend on the DOM in React Native?▼

Yes, you can use web libraries that depend on the DOM, such as charts or syntax highlighters, in React Native. The component renders inside a webview on native platforms, ensuring library compatibility while maintaining web parity when deployed to the web.

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

The best way to incrementally migrate a web app to native is rendering web-centric DOM code inside a webview. This allows you to progressively transition existing components to native, reducing rewrite work while maintaining unified rendering across platforms.

How does the 'use dom' directive work in Expo components?▼

The 'use dom' directive works in Expo components by enforcing per-file frontmatter rules that enable web code to run in a webview on native. It requires a single default export, explicit dom props typing, and in-component CSS to ensure proper execution.

When should I avoid using a webview for DOM components in Expo?▼

You should avoid using a webview for DOM components in Expo when native components are sufficient for your rendering needs. If your application does not rely on complex HTML, CSS, or DOM-dependent web libraries, standard native components offer better performance without webview overhead.

Related Skills

Explore More Software Engineering Skills→
nawab69nawab69

use-dom

Run web React components inside Expo apps via a webview-backed DOM component.

Community
Intermediate
emilyLi2020emilyLi2020
2

use-dom

Execute DOM-dependent React web code in native Expo applications.

Community
Intermediate
rostiSerostiSe
1

use-dom

Render web code in Expo React Native apps via DOM components in a webview.

Community
Intermediate
Yemomo511Yemomo511
2

use-dom

Run existing web code in WebView within Expo native apps.

Community
Intermediate