nextjs
<essential_principles>
How Next.js 16 Works
Next.js 16 uses the App Router with React Server Components by default. It introduces Cache Components with the "use cache" directive, Turbopack as the default bundler, and React 19.2 features.
1. Server-First Rendering
Components are Server Components by default. They:
- Run only on the server
- Can directly fetch data (no useEffect needed)
- Cannot use hooks, event handlers, or browser APIs
- Reduce client JavaScript bundle
Add 'use client' only when you need interactivity, state, or browser APIs.
2. BFF Pattern (Backend for Frontend)
Next.js acts as an intermediate layer between your React UI and backend APIs:
More from faqndo97/ai-skills
kamal-deployment
Deploy containerized applications (especially Rails) to VPS using Kamal 2. Covers deploy.yml configuration, accessories (PostgreSQL, Redis, Sidekiq), SSL/TLS, secrets management, CI/CD with GitHub Actions, database backups, server hardening, debugging, and scaling. Use when setting up Kamal, configuring deployments, troubleshooting deploy issues, or managing production infrastructure with Kamal.
31stimulus
Build Stimulus controllers from scratch through production. Full lifecycle - create, debug, test, optimize, integrate with Turbo. Covers targets, values, actions, outlets, and UI patterns.
23ruby-llm
Build AI-powered Ruby applications with RubyLLM. Full lifecycle - chat, tools, streaming, Rails integration, embeddings, and production deployment. Covers all providers (OpenAI, Anthropic, Gemini, etc.) with one unified API.
20ruby-on-rails
Build Ruby on Rails features from scratch through production. Full lifecycle - build, debug, test, optimize, refactor. Follows Vanilla Rails philosophy (37signals/DHH), SOLID principles, and Rails 8 patterns.
19noticed
Build Rails notifications with the noticed gem. Full lifecycle - create notifiers, configure delivery methods (email, Slack, push, SMS, ActionCable), debug, and test. Covers individual and bulk delivery patterns.
15shadcn-ui
Build production-ready React/Next.js UIs with shadcn/ui components. Full lifecycle - install, customize, compose, debug, optimize. Covers components, forms, tables, theming, animations, and hooks.
14