skills.rest
roviczzz
roviczzzCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

frontend-developer

Guide React 19 and Next.js 15 application development with modern architecture.

1|Updated Mar 23, 2026
Search Tags:#accessibility#state management#React#Next.js#performance optimization#frontend development
One-click install
npx skills add https://github.com/roviczzz/agentic-dev --skill frontend-developer-roviczzz
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-developer
Source: https://github.com/roviczzz/agentic-dev/tree/main/skills/frontend-developer
Command: npx skills add https://github.com/roviczzz/agentic-dev --skill frontend-developer-roviczzz

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires react, next, typescript, tailwindcss, emotion, styled-components, webpack, vite, prisma, drizzle, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill addresses the challenges of frontend development in modern web applications, particularly with React and Next.js, by providing expert guidance on building components, layouts, and state management.

Core Features & Use Cases

  • React 19 Expertise: Utilizes React 19 features for advanced UI components and server components.
  • Next.js Integration: Offers Next.js 15 support for server-side rendering, API routes, and edge functions.
  • Modern Frontend Architecture: Focuses on component-driven development, micro-frontends, and design systems.
  • State Management & Data Fetching: Implements modern state management solutions and data fetching techniques.
  • Styling & Design Systems: Integrates Tailwind CSS, CSS-in-JS, and responsive design principles.
  • Performance & Optimization: Optimizes for Core Web Vitals and implements advanced performance strategies.
  • Testing & Quality Assurance: Provides tools and best practices for testing, accessibility, and type safety.
  • Developer Experience: Enhances development workflows with modern tools and best practices.
  • Third-Party Integrations: Supports authentication, payment processing, analytics, and database integration.
  • Behavioral Traits: Prioritizes user experience, maintainability, and accessibility.
  • Knowledge Base: Offers a comprehensive understanding of React, Next.js, TypeScript, and modern CSS.
  • Response Approach: Analyzes requirements, suggests optimized solutions, and provides production-ready code.
  • Example Interactions: Builds server components, creates forms with server actions, implements design systems, optimizes components, sets up Next.js middleware, creates accessible data tables, implements real-time updates, and builds PWAs.

Quick Start

Use the frontend-developer skill to implement a React component with server-side rendering and state management.

Frequently Asked Questions about frontend-developer

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

FAQPage Schema
How do I implement server-side rendering and state management in Next.js 15?▼

You can implement server-side rendering and state management in Next.js 15 by utilizing React 19 server components and modern state management solutions to build optimized, production-ready frontend architectures.

What is the best way to optimize React 19 components for Core Web Vitals?▼

Optimizing React 19 components for Core Web Vitals involves applying advanced performance strategies, component-driven development, and modern data fetching techniques to significantly improve loading speed and user experience.

Does this React and Next.js development approach support Tailwind CSS and Emotion?▼

Yes, this React and Next.js development approach fully supports Tailwind CSS, Emotion, and styled-components to implement responsive design systems and modern CSS architectures efficiently.

How do I build accessible data tables and forms with Next.js server actions?▼

Building accessible data tables and forms with Next.js server actions requires prioritizing user experience, maintainability, and accessibility using React 19 features and TypeScript for strict type safety.

Can I integrate Prisma and Drizzle for database operations within my React frontend?▼

Yes, you can integrate Prisma and Drizzle for database operations within your React frontend by leveraging Next.js API routes and edge functions to handle data fetching and third-party integrations.

Related Skills

Explore More Software Engineering Skills→
TheBushidoCollectiveTheBushidoCollective
187

storybook-configuration

Configure Storybook main and preview files with addons and framework-specific builders.

Official
Intermediate
tech-leads-clubtech-leads-club
5.0k

web-quality-audit

Analyze websites for performance, accessibility, and SEO issues.

Official
Basic
MohabsmarMohabsmar

fullstack-dev

Scaffold Next.js 16 projects with TypeScript, Tailwind, Prisma, and shadcn/ui.

Community
Advanced
HafizFasihHafizFasih

robotics-theme-expert

Implement a robotics-themed design system for dark-mode industrial dashboards.

Community
Advanced