workleap-squide

Configure FireflyRuntime and AppRouter for modular React host applications.

8|2|Updated Apr 26, 2023
One-click install
npx skills add https://github.com/workleap/wl-squide --skill workleap-squide
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: workleap-squide
Source: https://github.com/workleap/wl-squide/tree/main/agent-skills/workleap-squide
Command: npx skills add https://github.com/workleap/wl-squide --skill workleap-squide

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Squide provides a framework to build and maintain a modular React application shell, enabling teams to compose apps from independently developed modules with centralized hosting, routing, and data management.

Core Features & Use Cases

  • Register host routes, navigation items, and MSW handlers by module to compose scalable apps
  • Integrate with essential tools like FireflyRuntime, AppRouter, TanStack Query, i18next, and LaunchDarkly
  • Support deferred registrations to register static routes upfront and defer navigation until remote data or feature flags are ready
  • Provide patterns for public/protected routes, global data fetching, error boundaries, and multi-module composition

Quick Start

Initialize a FireflyRuntime with local modules, then render the host app via AppRouter and register routes/navigation in a host module.

Frequently Asked Questions about workleap-squide

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

FAQPage Schema
How do I build a modular React application shell with dynamic routing?

To build a modular React application shell, you can use Squide to compose apps from independently developed modules by defining routes, navigation items, and MSW handlers with centralized hosting and data management.

How does deferred registration work for navigation in a modular React app?

Deferred registration allows you to register static routes upfront while deferring navigation rendering until remote data or feature flags are ready, ensuring dynamic routing remains stable during module loading.

How do I configure public and protected routes in a modular host application?

You can configure public and protected routes in a modular host application by utilizing the FireflyRuntime and AppRouter to define routing boundaries, feature flags, and error boundaries for each module.

Can I use MSW handlers with feature flags in a modular React architecture?

Yes, you can register MSW handlers by module and integrate LaunchDarkly feature flags to control API mocking and feature visibility dynamically across your modular React architecture.

What is the best way to handle multi-module composition in React without conflicting routes?

The best way to handle multi-module composition without conflicting routes is to register routes and navigation items by individual module, allowing the host application to assemble independent modules into a single scalable app.