portal-component

Generate Next.js portal components by using templates for page.tsx, loading.tsx, layout.tsx, and feature components organized under apps/portal. The Skill provides standardized folder structures and TypeScript patterns that follow Next.js 16 app router conventions, ensuring consistent component architecture across your portal application.

Structure portal features by creating a feature folder with page.tsx for routing, loading.tsx for skeleton states, layout.tsx for shared layouts, and a components subdirectory containing feature-page.tsx, feature-content.tsx, and feature-context.tsx. This pattern aligns with Next.js 16 app router best practices and portal conventions.

Yes, Jotai atoms are optional but recommended for portal state management. The Skill provides guidance on organizing atoms in domain-specific folders, allowing you to manage component state consistently within the portal's feature structure and React context patterns.

Yes, the portal component templates are built with TypeScript support. All generated page, component, and layout files follow TypeScript conventions, providing type safety and alignment with modern Next.js 16 app router development standards.

Loading states are handled via loading.tsx files that generate skeleton components matching your feature's UI. These load concurrently with page.tsx under Next.js 16's Suspense boundaries, providing instant visual feedback while your portal feature content fetches data.

Barrel exports (index.ts files) are generated to aggregate component exports from feature folders, simplifying imports across your portal application. This pattern reduces import path complexity and centralizes re-export logic following Next.js component best practices.