senior-frontend

Automate React/Next.js frontend engineering decisions for scaffolding, performance, and accessibility.

1|Updated Apr 13, 2026
One-click install
npx skills add https://github.com/OMIXEC/Mobile-dev-skills --skill senior-frontend-omixec
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: senior-frontend
Source: https://github.com/OMIXEC/Mobile-dev-skills/tree/main/skills/senior-frontend
Command: npx skills add https://github.com/OMIXEC/Mobile-dev-skills --skill senior-frontend-omixec

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

Frontend engineers often struggle with repetitive patterns, inconsistent UI design, and performance pitfalls. This skill provides a comprehensive playbook of React/Next.js patterns, accessibility checks, and scaffolding templates to accelerate development and improve quality.

Core Features & Use Cases

  • Project scaffolding and component generation with TypeScript and Tailwind CSS.
  • Bundle size and performance analysis, with guidance on code-splitting and lazy loading.
  • Accessibility and testing patterns, design systems, and maintainable UI architecture.

Quick Start

Create a starter frontend scaffold or request optimization guidance for an existing Next.js project.

Frequently Asked Questions about senior-frontend

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

FAQPage Schema
How do I optimize React and Next.js performance with code-splitting and lazy loading?

To optimize React and Next.js performance, apply code-splitting and lazy loading patterns to reduce bundle size. This skill automates bundle analysis and provides actionable guidance on implementing lazy loading to improve application load times.

What is the best way to scaffold a new TypeScript and Tailwind CSS component?

Scaffolding a TypeScript and Tailwind CSS component is best handled by using automated generation templates. This skill enforces scalable architecture and maintainable UI patterns when creating new project structures and components.

How do I automate accessibility auditing in a Next.js project?

Automating accessibility auditing in a Next.js project involves applying predefined testing patterns. This skill loads contextual references to enforce accessibility checks and maintainable UI architecture during development.

Can I use this frontend engineering skill for maintaining existing design systems?

Yes, you can use this skill for maintaining existing design systems. It applies UI pattern reviews and enforces scalable architecture across React and Next.js projects to ensure long-term consistency.

Why does my React UI architecture suffer from inconsistent patterns and performance pitfalls?

React UI architecture suffers from inconsistent patterns due to repetitive development and lack of standardized checks. This skill provides a playbook of best-practice decisions to resolve performance pitfalls and improve design quality.