web-frameworks
Description
Build modern full-stack web applications with Next.js (App Router, Server Components, RSC, PPR, SSR, SSG, ISR), Turborepo.
How to Use
- Visit the GitHub repository to get the SKILL.md file
- Copy the file to your project root or .cursor/rules directory
- Restart your AI assistant or editor to apply the new skill
Full Skill Documentation
name
web-frameworks
description
Build modern full-stack web applications with Next.js (App Router, Server Components, RSC, PPR, SSR, SSG, ISR), Turborepo (monorepo management, task pipelines, remote caching, parallel execution), and RemixIcon (3100+ SVG icons in outlined/filled styles). Use when creating React applications, implementing server-side rendering, setting up monorepos with multiple packages, optimizing build performance and caching strategies, adding icon libraries, managing shared dependencies, or working with TypeScript full-stack projects.
license
MIT
version
1.0.0
Tags
About web-frameworks
web-frameworks is an AI skill in the frontend category, designed to help developers and users work more effectively with AI tools. Build modern full-stack web applications with Next.js (App Router, Server Components, RSC, PPR, SSR, SSG, ISR), Turborepo.
This skill has earned 1,000 stars on GitHub, reflecting strong community adoption and trust. It is compatible with claude, codex.
Key Capabilities
Why Use web-frameworks
Adding web-frameworks to your AI workflow can significantly enhance your productivity in frontend tasks. With pre-defined prompt templates and best practices, this skill helps AI assistants better understand your requirements and deliver more accurate responses.
Whether you use claude or codex, you can easily integrate this skill into your existing development environment.
Explore More frontend Skills
Discover more AI skills in the frontend category to build a comprehensive AI skill stack.
Related Skills
react-code-fix-linter
Facebook official React code fix and linting skill. Automates code formatting and linting checks to ensure code quality and CI compliance before committing.
vercel-react-best-practices
Vercel official React best practices for building production-grade applications. Covers component patterns, state management, performance optimization, and Next.js integration.
nextjs-cache-components-expert
Vercel official Next.js Cache Components expert. Optimizes Next.js using Cache Components, Partial Prerendering (PPR), and modern caching directives.
remotion-best-practices
Best practices for Remotion - programmatic video creation in React. Covers composition, animation, rendering pipelines, and performance optimization.
vercel-composition-patterns
Vercel official composition patterns for building modular, scalable React applications. Covers component composition, layout patterns, and reusable UI architecture.