Skills
.Work. You
Rest

fe-bff-patterns

Community

Design efficient Backend for Frontend layers.

Software Engineering#frontend architecture#api design#bff#micro-frontends#data orchestration#backend for frontend
Authorhilaryosborne
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill addresses the complexity of fetching and shaping data for frontend applications by guiding the design and implementation of Backend for Frontend (BFF) layers, ensuring the frontend receives exactly the data it needs in the optimal format.

Core Features & Use Cases

  • BFF Philosophy: Understand the core principles of BFF, including its ownership by the frontend team and its role as a component-aware orchestration layer.
  • Response Shape Design: Learn to structure BFF responses to mirror the frontend component hierarchy, pre-compute display values, and include only necessary data.
  • Orchestration Patterns: Implement strategies for parallel API calls, graceful degradation, error translation, and effective caching.
  • Use Case: When building a new e-commerce product detail page, use this skill to design a BFF that aggregates data from inventory, pricing, and review services into a single, component-ready JSON payload for the frontend.

Quick Start

Use the fe-bff-patterns skill to design a BFF response that mirrors the component tree for a product card.

Dependency Matrix

Required Modules

None required

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: fe-bff-patterns
Download link: https://github.com/hilaryosborne/skills/archive/main.zip#fe-bff-patterns

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.