add-federated-tab

Community

Quickly add new tabs to your modular React platform.

Authorfkalinski
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Integrating new features as federated tabs in a modular React application involves intricate Module Federation, Webpack, and React configurations. This Skill provides a comprehensive, step-by-step guide to streamline the process, ensuring your new tab integrates seamlessly without manual guesswork.

Core Features & Use Cases

  • Guided Tab Creation: Follow a detailed guide to set up directory structure, install dependencies, and create core tab components.
  • Module Federation Configuration: Learn to correctly configure Webpack for exposing your tab and consuming shared modules.
  • Use Case: When a product manager requests a new "Analytics Dashboard" tab, use this Skill to generate the boilerplate and guide you through the integration steps, saving hours of setup and configuration time.

Quick Start

Use the add-federated-tab skill to create a new federated tab named 'AnalyticsDashboard'.

Dependency Matrix

Required Modules

npmwebpackreacttypescript@module-federation/enhanced

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: add-federated-tab
Download link: https://github.com/fkalinski/modular-react/archive/main.zip#add-federated-tab

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.