skills.rest
amanhsn
amanhsnCOMMUNITY
Explore all skills by this author →
GitHub

senior-frontend

Scaffold React and Next.js projects with TypeScript and Tailwind CSS.

Updated Feb 27, 2026
Search Tags:#typescript#frontend#react#optimization#scaffolding#next.js#tailwind css
One-click install
npx skills add https://github.com/amanhsn/flyerbuild --skill senior-frontend-amanhsn
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: senior-frontend
Source: https://github.com/amanhsn/flyerbuild/tree/main/.cursor/skills/senior-frontend
Command: npx skills add https://github.com/amanhsn/flyerbuild --skill senior-frontend-amanhsn

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires pypdf, pdfplumber, pdf2image, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill streamlines the entire frontend development lifecycle, from project setup and component generation to performance optimization and accessibility best practices, ensuring high-quality, maintainable code.

Core Features & Use Cases

  • Project Scaffolding: Quickly create new Next.js or React projects with pre-configured TypeScript, Tailwind CSS, and essential features like authentication or API clients.
  • Component Generation: Generate React components, hooks, and tests with optional Storybook stories, following established patterns.
  • Bundle Analysis & Optimization: Identify and fix heavy dependencies and optimize your frontend bundle size for faster load times.
  • Best Practices: Implement accessibility standards, robust testing strategies, and modern TypeScript patterns.
  • Use Case: Kickstart a new Next.js dashboard application with authentication, API integration, and form handling in minutes, complete with a well-structured project layout and reusable UI components.

Quick Start

Use the senior-frontend skill to create a new Next.js project named 'my-dashboard' with authentication and API features.

Frequently Asked Questions about senior-frontend

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

FAQPage Schema
How do I scaffold a new Next.js project with TypeScript and Tailwind CSS?▼

Scaffolding a Next.js project with TypeScript and Tailwind CSS is handled via deterministic Python scripts that pre-configure authentication and API client features. This generates a structured project layout with reusable UI components in minutes.

What is the best way to generate React components and hooks with Storybook stories?▼

Generating React components, hooks, and tests with optional Storybook stories is achieved using established patterns. This ensures high-quality, maintainable code by adhering to robust testing strategies and modern TypeScript patterns during component templating.

How do I optimize frontend bundle size and identify heavy dependencies?▼

Optimizing frontend bundle size requires identifying and fixing heavy dependencies to achieve faster load times. This skill provides bundle analysis capabilities to evaluate your application and apply performance optimization best practices automatically.

Does this frontend development workflow support accessibility and testing best practices?▼

Accessibility standards and robust testing strategies are fully supported as core best practices. It ensures high-quality, maintainable code by implementing modern TypeScript patterns alongside accessibility and testing standards throughout the development lifecycle.

Can I use Python scripts for deterministic task execution in React project setup?▼

Python scripts are used for deterministic task execution during React project setup and component templating. This approach streamlines the frontend development lifecycle by ensuring consistent project creation and component generation workflows.

Related Skills

Explore More Software Engineering Skills→
windyskywindysky

moai-lang-typescript

Implement TypeScript 5.9+ patterns for React and Next.js applications.

Community
Intermediate
BorisserzBorisserz
1

performance-optimization

Measure application performance bottlenecks and verify targeted optimizations.

Community
Advanced
webdevtodayjasonwebdevtodayjason
7

frontend-patterns

Design scalable React and Next.js frontend architectures with TypeScript patterns.

Community
Advanced
SJTU-IPADSSJTU-IPADS
7

python-coding

Generate Python modules with HTTP API scaffolding and error handling.

Official
Intermediate