Configure App Router and Pages Router usage for Next.js SSR and CSR workflows.
npx skills add https://github.com/calcosmic/Aether --skill nextjs-calcosmic
Please help me install this Agent Skill. Skill: nextjs Source: https://github.com/calcosmic/Aether/tree/main/.aether/skills-codex/domain/nextjs Command: npx skills add https://github.com/calcosmic/Aether --skill nextjs-calcosmic
Next.js projects often struggle with choosing the right routing model and data-fetching patterns. This skill provides clear guidance on when to use App Router vs Pages Router, proper server/client component usage, and performance optimizations to keep SSR/CSR workflows efficient.
Analyze your Next.js project to determine the router pattern and apply the guidelines to structure components, data loading, and routes for optimum performance.
High-intent search queries and answers about installing and using this skill.
Choose the Next.js App Router for scalable projects requiring advanced server components and nested layouts, while using the Pages Router for simpler, legacy routing patterns. The decision depends on your project's complexity and specific data-fetching needs.
Use Server Components for direct data fetching to keep client-side JavaScript minimal, and switch to Client Components only when you need interactivity. This pattern optimizes SSR workflows and maintains robust UI performance.
The best way to handle caching in Next.js is aligning Server Actions with robust data-fetching strategies to manage revalidation. This approach ensures efficient performance and keeps your UI data fresh without unnecessary fetches.
Structure Next.js API routes by following route handler conventions aligned with App Router or Pages Router patterns. This ensures your endpoints handle SSR and CSR data requests efficiently while maintaining project scalability.
Yes, Next.js provides built-in image optimization to automatically resize and serve images efficiently. Implementing this alongside proper caching strategies significantly improves both page load performance and overall SEO.
PlazaCCIdentify and enforce Next.js best practice guidelines across a codebase.
alkalisummerExplain CSR, SSR, SSG, ISR, and streaming for Next.js and Remix.
xmun74Provides frontend architecture and coding standards for TanStack Query-based projects.
silverbee-aiDiagnose SSR, hydration, and dynamic rendering crawlability issues on JS-heavy sites.
