Skills tagged "nextjs" (82)

🎨 Use Ai Sdk

This skill helps developers integrate and reason about the AI SDK to build agents, tools, and chat features efficiently.

aifrontendbackendapi

882

🐛 Gs Santry Observability

This skill enhances Sentry observability across Clean Architecture layers by tracing use cases, logging per layer, and capturing user context.

observabilityperformancebackendnextjs

3

🎨 Gs Zod Validation

This skill helps you enforce input shape with Zod in the presentation layer, while business rules live in entities and server actions use schemas.

backendfrontendtypescriptnextjs

3

🎨 Nextfriday React

This skill helps you write cleaner React and JSX code by applying Next Friday patterns for props, lazy loading, destructuring, and formatting.

reactnextjsformattingrefactor

3

🎨 Nextfriday Types

This skill enforces TypeScript patterns from Next Friday to standardize props, params, and return types for safer, clearer React code.

typescriptreactnextjscode-review

3

🎨 Shadcn Baseui

This skill enforces Base UI patterns in shadcn/ui projects, preventing incorrect Radix UI guidance and ensuring render prop usage.

frontendreactnextjsshadcn

3

🎨 Velt Notifications Best Practices

This skill helps you implement robust notification systems in React and Next.js, covering panels, delivery channels, and user preferences.

reactnextjstypescriptfrontend

3

⚙️ Calcom Api

This skill helps you manage Cal.com API v2 scheduling, bookings, and calendars, enabling seamless event creation, availability checks, and webhooks.

apibackendresttrpc

2

🎨 Copycat

This skill inventories a Next.js app's public and authenticated views, confirms view names with you, and plans a shadcn-based clean platform scaffold.

nextjsshadcnplanningfrontend

2

🎨 Creating Components

This skill guides you through creating reusable Gluestack UI v4 components, covering planning, structure, styling, TypeScript, and accessibility best practices.

frontendreactnextjstypescript

2

🧪 Debug With Playwright

This skill helps you debug E2E tests by capturing targeted Playwright screenshots to visually inspect app state during failures.

debuggingtestingautomationfrontend

2

🎨 Feature Gating

This skill helps you enforce premium feature access with Flowglad, gating features and paywalls based on user subscriptions.

nextjstypescriptreacttrpc

2

🎨 Frontend Dev

This skill helps you craft production-grade frontend interfaces with bold, memorable aesthetics across components, dashboards, and pages.

frontenddesignuxaccessibility

2

🎨 Fullstack Developer

This skill designs and implements complete full-stack systems with Next.js, React, Firebase, and Stripe, delivering production-ready apps with scalable

fullstacknextjsfirebasestripe

2

🎨 Remember Learnings

This skill autonomously reviews the session for errors and snags and updates AGENTS.md with actionable learnings to improve future runs.

aiautomationproductivitygit

2

🛡️ Security Review

This skill helps you perform a security-focused code review by applying a comprehensive checklist to identify vulnerabilities across categories.

securitycode-reviewtypescriptjavascript

2

🧪 Senior Qa

This skill helps you design and execute robust QA strategies for React, Next.js, and Node.js apps with automated test suite generation and coverage analysis.

testingautomationreactnextjs

2

🛡️ Setup

This skill sets up Clerk authentication across frameworks by following official quickstart guides and configuring keys to secure your app.

frontendbackendautomationsecurity

2

🐛 @Gw Config Management

This skill helps you configure and optimize gw tooling for various project types, automating setup, auto-copy, and troubleshooting for Next.js, Node.js, and

automationdevopsclinextjs

🔍 Accelint Nextjs Best Practices

This skill helps you optimize Next.js apps by applying performance and best-practice patterns for server components, actions, and data fetching.

nextjsperformancecode-reviewdebugging

🧪 Add Provider Package

This skill guides you through creating a new @ai-sdk/provider package to integrate an AI service into the SDK.

aidocstypescriptjavascript

🎨 Ai Elements

This skill helps you create AI Elements interface components following shadcn/ui patterns and Vercel AI SDK conventions for rapid integration.

frontendreactnextjstypescript

🎨 App Builder

This skill helps you scaffold new projects quickly by selecting a matching template for your tech stack and starting from a proven structure.

nextjstypescriptfrontend

🛡️ Auth Security

This skill secures your application with Clerk authentication and authorization, protecting routes, verifying permissions, and enforcing subscription-based

securitybackendapinextjs

🎨 Babysit

This skill helps you implement Zustand state management with type-safe stores, slices, and middleware for scalable React apps.

typescriptjavascriptreactnextjs

⚙️ Backend Dev

This skill helps you design and implement robust backend endpoints, schemas, and LLM integration for Resume Matcher.

backendfastapidatabasepython

🎨 Book Translation

This skill translates The Interactive Book of Prompting content and UI strings into a target language, preserving structure and usability for multilingual

aicontenttypescriptnextjs

🎨 Check Workflows

This skill analyzes the past day's GitHub Actions workflow runs to detect actionable failures and open issues for remediation.

ci-cddevopsautomationdebugging

🛡️ Clerk

This skill helps you integrate Clerk authentication in Next.js projects by guiding setup, custom UI, and advanced patterns.

nextjssecurityfrontendapi

🧪 Code Review

This skill helps you handle code review feedback rigorously, verify implications, and push back with technical reasoning before implementing.

code-reviewtestingdebuggingrefactor

🔍 Code Standards

This skill helps enforce code quality in TypeScript projects by guiding reviews with a structured checklist for critical issues, quality, style, and linting.

code-reviewlintingtypescriptdebugging

🎨 Codebase Navigator

This skill helps you navigate and understand a TypeScript codebase using fast search, trace, and architecture insights to accelerate onboarding.

debuggingscriptingproductivitytypescript

🧪 Codex Test

This skill helps you set up, run, and edit the codex-test Next.js project with minimal, scoped changes.

nextjstypescriptfrontendlinting

🎨 Cra To Next Migration

This skill guides migrating CRA projects to Next.js, converting routing, data fetching, and assets to modern patterns for improved performance and server

nextjsmigrationreacttypescript

🎨 Custom Ui

This skill helps you tailor Clerk component appearance by applying themes, layout, colors, and fonts to match branding.

frontendnextjsdesignux

🎨 Dashboard Builder

This skill helps you build professional data visualization dashboards with Next.js, Tailwind, and Recharts, delivering fast UI and live analytics.

frontendanalyticsreactnextjs

🧪 E2e Rebase

This skill helps you rebase e2e test snapshots by extracting failed tests from PR comments and updating snapshots accordingly.

testingautomationgitdebugging

🛡️ Fastapi

This skill helps you build robust Python APIs with FastAPI, Pydantic, and async SQLAlchemy, featuring JWT auth and solid validation.

pythonfastapiapidatabase

🧪 Figma D3 React Ts

This skill helps you build pixel-perfect D3 visualizations inside React/Next.js, matching Figma designs and validating visuals with Playwright.

reactnextjsdataanalytics

🧪 Fix Issue

This skill helps you create a clear plan to fix a GitHub issue and implement it locally, accelerating debugging and validation.

planningdebuggingtestinggit

🎨 Frontend Agent

This skill helps you build accessible, design-faithful React and Next.js UI using shadcn/ui, server components, and design tokens for performance.

frontendreactnextjsshadcn

🎨 Frontend Dev

This skill helps you create and modify Next.js pages, React components, and Tailwind styles following Swiss International Style.

frontendnextjstailwindtypescript

🎨 Frontend Developer

This skill helps you build scalable React and Next.js UI components with accessible, responsive layouts and optimized performance.

reactnextjsfrontendperformance

🎨 Frontend Ui Skill

This skill helps audit and build enterprise SaaS UIs with Tailwind v4, shadcn/ui, and Next.js/Vite while ensuring accessibility and performance.

frontendreactnextjstailwind

🧪 Generate Marketing Screens

This skill generates pixel-perfect marketing screenshots and compelling Product Hunt copy for Next.js apps using Playwright MCP.

marketingaiautomationproduct

🧪 Generate Marketing Screenshots

This skill automates creating Product Hunt ready marketing screenshots and listing copy for deployed Next.js projects using Playwright MCP.

marketingautomationfrontendnextjs

🧪 Gs Create Domain Module

This skill helps generate production-ready feature modules using Clean Architecture principles for Next.js 15+, DynamoDB, and Vitest.

backendfullstacknextjsdatabase

⚙️ Harness Init

This skill initializes a project for harness setup using natural language, delivering ready-to-run plans and defaults for immediate development.

aiautomationdevopsplanning

🎨 Island Rescue

This skill helps you STOP marshal rescue guidance on STOP a lonely island scenario STOP by practical steps and STOP clear checklists

aiautomationplanningproduct

🎨 Mapcn Docs

This skill helps you build comprehensive Next.js App Router documentation sites with live previews, code samples, and accessible, theme-aware UI.

nextjsdocsaccessibilityreact

📝 Mastra Docs

This skill enforces Mastra documentation standards, ensuring clear, consistent guides and references across docs, guides, and reference sections.

docswritingcontentplanning

🧪 Multi Pr Review

This skill coordinates three specialized sub-agents to review PR diffs, validate issues by reasoning, and post a summarized verdict.

aiautomationcode-reviewtypescript

🎨 Next Cache Components

This skill helps you implement Next.js 16 Cache Components to mix static, cached, and dynamic content for faster, tailored pages.

nextjsperformancefrontendreact

🧪 Next Upgrade

This skill guides you upgrade Next.js to the latest version following official migration guides, codemods, and dependency updates.

nextjsmigrationautomationfrontend

🎨 Nextfriday Best Practices

This skill helps you write and review Next.js TypeScript code by applying 41 best-practice rules across naming, style, imports, types, and React patterns.

reactnextjstypescriptcode-review

🎨 Nextjs App Router

This skill guides you through Next.js App Router patterns, server/client components, and routing files to read, review, or create app directory files.

nextjsreactfrontendfullstack

🛡️ Nextjs Patterns

This skill helps you implement advanced Next.js patterns with Clerk, including middleware, server actions, and strategic caching for secure, efficient apps.

nextjssecurityperformancedebugging

🎨 Og Images

This skill helps you generate OpenGraph and Twitter share images for Next.js by applying best-practice layout, fonts, and metadata.

nextjsseosocial-mediareact

🛡️ Orgs

This skill helps you manage multi-tenant Clerk orgs with RBAC, org switching, and protected routes to streamline enterprise SaaS.

backendfullstackapinextjs

🎨 Pixel Perfect Ui

This skill converts Figma designs into production-ready Next.js components with pixel-perfect accuracy and automated visual validation.

frontendnextjsdesignux