pf-feature_skill

Overview

This skill codifies a repeatable, end-to-end feature development flow for the PF DEV TypeScript monorepo. It guides developers from requirement analysis through branch creation, design, implementation, testing, code review prep, and PR creation. The goal is predictable delivery, clear handoffs, and fewer rework cycles.

How this skill works

The skill inspects the requested feature intent and walks developers through a seven-step flow: requirements analysis, branch naming, component and API design, implementation, testing, review readiness, and PR creation. It outputs checklists, component structure examples, API service patterns, test and lint commands, and a PR template to standardize submissions. It also suggests quick commands for common monorepo tasks.

When to use it

• When adding a new UI feature or page (e.g., user profile).
• When onboarding or aligning multiple contributors on one feature.
• When converting designs or specs into implementable tasks and components.
• When preparing a feature branch for review and release.
• When you need a repeatable checklist to reduce regression and review cycles.

Best practices

• Start with a clear success criteria and user scenarios before coding.
• Create a feature branch using feature/<issue>-short-desc naming convention.
• Break work into types, API services, components, hooks, and route changes with a task checklist.
• Implement types and API service functions first to enable type-safe development.
• Run lint, type-check, and local dev server before opening a PR.
• Use the provided PR template and self-review checklist (accessibility, responsiveness, console logs).

Example use cases

• Implementing a user profile page with ProfileHeader, ProfileForm, and AvatarUpload components.
• Adding a dark-mode toggle across apps in the monorepo with a feature branch and shared hook.
• Onboarding a new teammate by giving them the feature checklist and component blueprint.
• Preparing a small API-backed feature: define types, create service functions, then implement components.
• Creating a storybook or component test as part of the feature’s test step.