skills.rest
steedos
steedosOFFICIAL
Explore all skills by this author →
WebsiteGitHub

steedos-webapps

Create and manage modular Steedos webapps built with React and Vite.

1.6k|413|Updated Mar 4, 2019
Search Tags:#react#vite#spa#webapps#amis#steedos#iife
One-click install
npx skills add https://github.com/steedos/steedos-platform --skill steedos-webapps
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: steedos-webapps
Source: https://github.com/steedos/steedos-platform/tree/main/skills/steedos-webapps
Command: npx skills add https://github.com/steedos/steedos-platform --skill steedos-webapps

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Steedos enables packaging and hosting modular React + Vite webapps inside Steedos packages, letting teams ship standalone UI components as part of a single platform.

Core Features & Use Cases

  • Independent webapps stored under webapps/, each compiled into a self-registering AMIS renderer (IIFE)
  • CSS isolation via a per-webapp scope prefix to avoid host-page style leaks
  • Express-based SPA routing and per-webapp routes to host standalone pages and embeddable components
  • Multi-webapp management with isolated build pipelines and per-app dependencies

Quick Start

Create a new webapp under webapps/your-app using the recommended scaffold and run the build commands to produce the IIFE renderer and load it into Steedos.

Frequently Asked Questions about steedos-webapps

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

FAQPage Schema
How do I build modular React webapps inside a Steedos package?▼

Build modular React webapps inside a Steedos package by scaffolding independent SPAs under the webapps/ directory, using Vite for compilation and IIFE distribution to integrate them into the host platform.

What is the best way to isolate CSS styles in Steedos webapps?▼

Isolate CSS styles in Steedos webapps by applying postcss-prefix-selector to enforce a per-webapp scope prefix, preventing host-page style leaks between independent React components.

How does IIFE distribution work for standalone SPA routing in Steedos?▼

IIFE distribution compiles each standalone SPA into a self-registering AMIS renderer, allowing Express-based per-webapp routing to host standalone pages and embeddable components within Steedos.

Can I manage multiple isolated webapps with different dependencies in Steedos?▼

Manage multiple isolated webapps in Steedos using isolated build pipelines for each scaffold under webapps/, supporting per-app dependencies alongside dedicated build scripts like build:amis and build:all.

Does Steedos support embedding an AMIS renderer within a React Vite application?▼

Steedos supports embedding an AMIS renderer within React Vite applications by compiling dedicated webapps into IIFE renderers, enabling standalone UI components to load directly into the host platform.

Why do my Steedos webapp styles leak into the host page after building?▼

Steedos webapp styles leak into the host page when CSS scoping via postcss-prefix-selector is misconfigured, requiring a strict per-webapp scope prefix to isolate standalone SPA components.

Related Skills

Explore More Software Engineering Skills→
DanielKerridgeDanielKerridge
56

power-apps-code-apps

Scaffold and deploy Power Apps Code Apps using PAC and Vite pipelines.

Community
Advanced
LostovayneLostovayne
2

clerk-react-patterns

Implement Clerk authentication patterns for React SPAs with protected routes.

Community
Advanced
steedossteedos
1.6k

steedos-object-micro-pages

Render custom Steedos object pages with Amis and pageAssignments.

Official
Intermediate
jbandijbandi

convert-web-app

Convert web applications into hybrid MCP Apps with resource wrapping and tool registration.

Community
Intermediate