skills.rest
Intelligent-Internet
Intelligent-InternetOFFICIAL
Explore all skills by this author →
Website𝕏@ii_postsGitHub

use-dom

Run web code in native apps using DOM components with a 'use dom' directive.

3.4k|522|Updated Apr 7, 2025
Search Tags:#components#migration#react-native#expo#dom#webview#web-libraries
One-click install
npx skills add https://github.com/Intelligent-Internet/ii-agent --skill use-dom-intelligent-internet
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: use-dom
Source: https://github.com/Intelligent-Internet/ii-agent/tree/main/src/ii_agent/settings/skills/builtin/expo-use-dom
Command: npx skills add https://github.com/Intelligent-Internet/ii-agent --skill use-dom-intelligent-internet

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Web code often needs to run inside native apps or be migrated gradually to native. DOM components let web code run verbatim in a webview on native platforms while rendering as-is on web, enabling reuse of web libraries in Expo apps and incremental migration.

Core Features & Use Cases

  • Runs web content in a native context via a webview
  • Enables using web libraries (charts, syntax highlighters, editors) in Expo apps without full rewrites
  • Supports incremental migration from web to native across platforms

Quick Start

Create a simple DOM component that renders a webview-wrapped UI using a sample dataset.

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 inside a native React Native app?▼

To run web code inside a native app, use DOM components that render web content verbatim in a webview on native platforms while rendering as-is on web. This enables reusing web libraries directly in Expo projects.

What is the best way to migrate web UI to native gradually?▼

The best way to migrate web UI to native gradually is using DOM components. They enable incremental migration by letting web code run verbatim in a native webview, allowing step-by-step UI conversion without a full rewrite.

Can I use web libraries like charts and editors in Expo apps?▼

Yes, you can use web libraries like charts and syntax highlighters in Expo apps by wrapping them in DOM components. This runs the web code in a native webview, avoiding the need to rewrite libraries for React Native.

Does the 'use dom' directive require a specific component export structure?▼

Yes, the 'use dom' directive requires a specific structure: it must be at the top of the file, the component must use DOMProps for props, and it requires a single default export per component file.

How do I add CSS styles to a DOM component?▼

To add CSS styles to a DOM component, include the CSS directly in the component file. This approach supports standard web styling inside the webview, ensuring the web code renders verbatim on native platforms.

Related Skills

Explore More Software Engineering Skills→
sc30gswsc30gsw

use-dom

Run web React components inside native Expo apps via webview.

Community
Intermediate
RipKDRRipKDR
2

use-dom

Run web code inside native apps using Expo DOM components.

Community
Intermediate
rostiSerostiSe
1

use-dom

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

Community
Intermediate
msichtermanmsichterman

use-dom

Embed web-only code in native Expo apps using DOM components.

Community
Intermediate