[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6EBMBPF3C52TS5TA4W954HE":3,"skill-same:01M6EBMBPF3C52TS5TA4W954HE":85},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":18,"publishedAt":37,"linkOnly":38,"markdownContent":39,"markdownBody":40,"frontMatter":41,"refName":42,"commitSha":43,"skillDirectory":44,"forksCount":45,"repositoryHtmlUrl":46,"repositoryHomepageUrl":47,"ownerHtmlUrl":48,"ownerBlogUrl":6,"ownerDescription":49,"updatedAt":50,"install":51,"resources":64},"01M6EBMBPF3C52TS5TA4W954HE","nextjs-app-router",null,"File-system routing, Layouts, and Route Groups. Use when implementing App Router routing, nested layouts, or route groups in Next.js. (triggers: app\u002F**\u002Fpage.tsx, app\u002F**\u002Flayout.tsx, app\u002F**\u002Floading.tsx, App Router, Layout, Route Group, parallel routes)","ComeOnOliver\u002Fskillshub","ComeOnOliver","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F43215937?v=4","01M6E5JNFECJAAVFE0W7SMWWD2","Haoran Shu","01M6E5JNNDQS7AJZDYFQ8TPZCK",67,"MIT","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002FHoangNguyen0403\u002Fagent-skills-standard\u002Fnextjs-app-router\u002FSKILL.md",[],[19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36],"router","nextjs app router","app","nextjs","Next.js","js","system","page","parallel","use","routing","tsx","nested","route","next","layout","triggers","file","2026-11-10 10:12:30",false,"---\nname: nextjs-app-router\ndescription: 'File-system routing, Layouts, and Route Groups. Use when implementing App Router routing, nested layouts, or route groups in Next.js. (triggers: app\u002F**\u002Fpage.tsx, app\u002F**\u002Flayout.tsx, app\u002F**\u002Floading.tsx, App Router, Layout, Route Group, parallel routes)'\n---\n\n## **Priority: P0 (CRITICAL)**\n\n## Implementation Guidelines\n\n### Routing Architecture\n\n- **Structure**: Use the **`app\u002F` directory**. Define routes with **`app\u002Fdashboard\u002Flayout.tsx`** returning **`{children}`**; shared UI nests inside `app\u002Flayout.tsx` automatically. Handle states with **`loading.tsx`**, **`error.tsx`**, and **`not-found.tsx`**.\n- **Segments**: Organize features with **Route Groups** (brackets **`(auth)`**) to be **excluded from URL path**. Use **Dynamic Routes** (brackets `[slug]`) and define static paths via **`generateStaticParams`**.\n- **Specialized**: Use **Parallel Routes** (**`@modal`**) by adding the slot to the parent layout and providing a **`default.tsx`** fallback. Use **Intercepting Routes** (`(.)route`) for advanced layouts like dashboards.\n\n### Data & Functions\n\n- **Next.js 15+ Async**: Always **`await`** the **`params: Promise`**, **`searchParams`**, **`cookies()`**, and **`headers()`**.\n- **Security**: Use **`middleware.ts`** for edge-side authentication and redirection. Ensure all **Route Handlers (`route.ts`)** are secured with appropriate auth checks.\n- **RSC**: Default to **React Server Components (RSC)**. Only use **`'use client'`** at leaf nodes for interactivity (hooks\u002Fevents).\n- **Error Boundaries**: Create **`app\u002Fdashboard\u002Floading.tsx`** to auto-wrap routes in a **Suspense boundary**. In **`error.tsx`**, use **`'use client'`** and provide a **`reset: () => void`** function.\n  const theme = cookieStore.get('theme');\n\n```\n\n## File Conventions\n\n- **page.tsx**: UI for a route.\n- **layout.tsx**: Shared UI wrapping children. Persists across navigation.\n- **loading.tsx**: Suspense boundary for loading states.\n- **error.tsx**: Error boundary (Must be Client Component).\n- **route.ts**: Server-side API endpoint.\n\n## Structure Patterns\n\n- **Route Groups**: Use parenthesis `(auth)` to organize without affecting URL path.\n- **Private Folders**: Use underscore `_lib` to exclude from routing.\n- **Dynamic Routes**: Use brackets `[slug]` or `[...slug]` (catch-all).\n\n## Best Practices\n\n- **RSC Boundaries**: Ensure props passed to Client Components are serializable. See [RSC Boundaries & Serialization](..\u002Farchitecture\u002Freferences\u002FRSC_BOUNDARIES.md).\n- **Parallel Routes (`@folder`)**: Render multiple pages in the same layout. Use `default.tsx` for fallback.\n- **Intercepting Routes (`(..)folder`)**: Load routes within current layout context.\n- **Colocation**: Keep component files, styles, and tests inside the route folder.\n- **Layouts**: Use Root Layout (`app\u002Flayout.tsx`) for `\u003Chtml>` and `\u003Cbody>` tags.\n- [**Self-Hosting Standard**](references\u002FSELF_HOSTING.md)\n\n\n## Anti-Patterns\n\n- **No unawaited async APIs**: `params`, `cookies()`, `headers()` are Promises in Next.js 15+; always await.\n- **No `'use client'` at tree root**: Place at leaves; keep layouts and pages as Server Components.\n- **No `\u003Chtml>`\u002F`\u003Cbody>` in nested layouts**: Only `app\u002Flayout.tsx` (root layout) should include them.\n- **No missing `error.tsx`**: Every route segment needs a Client Component error boundary.\n```\n\n","## **Priority: P0 (CRITICAL)**\n\n## Implementation Guidelines\n\n### Routing Architecture\n\n- **Structure**: Use the **`app\u002F` directory**. Define routes with **`app\u002Fdashboard\u002Flayout.tsx`** returning **`{children}`**; shared UI nests inside `app\u002Flayout.tsx` automatically. Handle states with **`loading.tsx`**, **`error.tsx`**, and **`not-found.tsx`**.\n- **Segments**: Organize features with **Route Groups** (brackets **`(auth)`**) to be **excluded from URL path**. Use **Dynamic Routes** (brackets `[slug]`) and define static paths via **`generateStaticParams`**.\n- **Specialized**: Use **Parallel Routes** (**`@modal`**) by adding the slot to the parent layout and providing a **`default.tsx`** fallback. Use **Intercepting Routes** (`(.)route`) for advanced layouts like dashboards.\n\n### Data & Functions\n\n- **Next.js 15+ Async**: Always **`await`** the **`params: Promise`**, **`searchParams`**, **`cookies()`**, and **`headers()`**.\n- **Security**: Use **`middleware.ts`** for edge-side authentication and redirection. Ensure all **Route Handlers (`route.ts`)** are secured with appropriate auth checks.\n- **RSC**: Default to **React Server Components (RSC)**. Only use **`'use client'`** at leaf nodes for interactivity (hooks\u002Fevents).\n- **Error Boundaries**: Create **`app\u002Fdashboard\u002Floading.tsx`** to auto-wrap routes in a **Suspense boundary**. In **`error.tsx`**, use **`'use client'`** and provide a **`reset: () => void`** function.\n  const theme = cookieStore.get('theme');\n\n```\n\n## File Conventions\n\n- **page.tsx**: UI for a route.\n- **layout.tsx**: Shared UI wrapping children. Persists across navigation.\n- **loading.tsx**: Suspense boundary for loading states.\n- **error.tsx**: Error boundary (Must be Client Component).\n- **route.ts**: Server-side API endpoint.\n\n## Structure Patterns\n\n- **Route Groups**: Use parenthesis `(auth)` to organize without affecting URL path.\n- **Private Folders**: Use underscore `_lib` to exclude from routing.\n- **Dynamic Routes**: Use brackets `[slug]` or `[...slug]` (catch-all).\n\n## Best Practices\n\n- **RSC Boundaries**: Ensure props passed to Client Components are serializable. See [RSC Boundaries & Serialization](..\u002Farchitecture\u002Freferences\u002FRSC_BOUNDARIES.md).\n- **Parallel Routes (`@folder`)**: Render multiple pages in the same layout. Use `default.tsx` for fallback.\n- **Intercepting Routes (`(..)folder`)**: Load routes within current layout context.\n- **Colocation**: Keep component files, styles, and tests inside the route folder.\n- **Layouts**: Use Root Layout (`app\u002Flayout.tsx`) for `\u003Chtml>` and `\u003Cbody>` tags.\n- [**Self-Hosting Standard**](references\u002FSELF_HOSTING.md)\n\n\n## Anti-Patterns\n\n- **No unawaited async APIs**: `params`, `cookies()`, `headers()` are Promises in Next.js 15+; always await.\n- **No `'use client'` at tree root**: Place at leaves; keep layouts and pages as Server Components.\n- **No `\u003Chtml>`\u002F`\u003Cbody>` in nested layouts**: Only `app\u002Flayout.tsx` (root layout) should include them.\n- **No missing `error.tsx`**: Every route segment needs a Client Component error boundary.\n```\n\n",{"name":5,"description":7},"main","def8531e65114c0fca8fb8551c1871ee0eed705c","skills\u002FHoangNguyen0403\u002Fagent-skills-standard\u002Fnextjs-app-router",24,"https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub","https:\u002F\u002Fskillshub.wtf","https:\u002F\u002Fgithub.com\u002FComeOnOliver","AI & Blockchain Engineer\r\n","2026-06-24 22:07:19",{"source":8,"skillName":5,"commands":52,"prompt":62,"zipAvailable":63},[53,56,59],{"tool":54,"command":55},"npx","npx skills add ComeOnOliver\u002Fskillshub --skill nextjs-app-router",{"tool":57,"command":58},"bunx","bunx skills add ComeOnOliver\u002Fskillshub --skill nextjs-app-router",{"tool":60,"command":61},"pnpm","pnpm dlx skills add ComeOnOliver\u002Fskillshub --skill nextjs-app-router","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002FHoangNguyen0403\u002Fagent-skills-standard\u002Fnextjs-app-router\u002FSKILL.md",true,[65,71,77,81],{"path":66,"resourceType":67,"resourceTypeDesc":68,"sizeBytes":69,"sourceHtmlUrl":70},"LICENSE.txt","LICENSE","许可证",11345,"https:\u002F\u002Fgithub.com\u002Fa1627418541\u002F-\u002Fblob\u002Fmain\u002F.pi\u002Fskills\u002Fweb-artifacts-builder\u002FLICENSE.txt",{"path":72,"resourceType":73,"resourceTypeDesc":74,"sizeBytes":75,"sourceHtmlUrl":76},"scripts\u002Fbundle-artifact.sh","SCRIPT","脚本",1517,"https:\u002F\u002Fgithub.com\u002Fa1627418541\u002F-\u002Fblob\u002Fmain\u002F.pi\u002Fskills\u002Fweb-artifacts-builder\u002Fscripts\u002Fbundle-artifact.sh",{"path":78,"resourceType":73,"resourceTypeDesc":74,"sizeBytes":79,"sourceHtmlUrl":80},"scripts\u002Finit-artifact.sh",9924,"https:\u002F\u002Fgithub.com\u002Fa1627418541\u002F-\u002Fblob\u002Fmain\u002F.pi\u002Fskills\u002Fweb-artifacts-builder\u002Fscripts\u002Finit-artifact.sh",{"path":82,"resourceType":73,"resourceTypeDesc":74,"sizeBytes":83,"sourceHtmlUrl":84},"scripts\u002Fshadcn-components.tar.gz",19967,"https:\u002F\u002Fgithub.com\u002Fa1627418541\u002F-\u002Fblob\u002Fmain\u002F.pi\u002Fskills\u002Fweb-artifacts-builder\u002Fscripts\u002Fshadcn-components.tar.gz",[86,100,110,119,125,132],{"skillNo":87,"name":88,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":89,"categories":90,"keywords":96,"publishedAt":37},"01M6FKJN13GMG4KY57J3QD8GY5","model-hierarchy-skill","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzscole\u002Fmodel-hierarchy-skill\u002Fmodel-hierarchy-skill\u002FSKILL.md",[91],{"categoryNo":92,"categoryName":93,"taxonomyType":94,"taxonomyTypeDesc":95},"01JBSEEDCAT000000000000023","Skill与智能体开发","SCENARIO","使用场景",[97,98,99],"model","model hierarchy","model hierarchy skill",{"skillNo":101,"name":102,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":103,"categories":104,"keywords":106,"publishedAt":37},"01M6FKJJJ6GCAMR4PPPRD12M5X","zoom-mcp","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fzoom-mcp\u002FSKILL.md",[105],{"categoryNo":92,"categoryName":93,"taxonomyType":94,"taxonomyTypeDesc":95},[107,108,109],"MCP","zoom","zoom mcp",{"skillNo":111,"name":112,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":113,"categories":114,"keywords":115,"publishedAt":37},"01M6FKJE3KYT3KPEZMEEHYKA6K","zoom-apps-sdk","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fzoom-apps-sdk\u002FSKILL.md",[],[116,117,118,108],"sdk","zoom apps sdk","apps",{"skillNo":120,"name":121,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":122,"categories":123,"keywords":124,"publishedAt":37},"01M6FKJ9EDH9Q5VWDF8HAJRSP0","windows","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwindows\u002FSKILL.md",[],[121],{"skillNo":126,"name":127,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":128,"categories":129,"keywords":131,"publishedAt":37},"01M6FKJ666BEEFC3AE9GJ72Q93","whiteboard","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwhiteboard\u002FSKILL.md",[130],{"categoryNo":92,"categoryName":93,"taxonomyType":94,"taxonomyTypeDesc":95},[127],{"skillNo":133,"name":134,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":135,"categories":136,"keywords":137,"publishedAt":37},"01M6FKJ21WFCDGTJQ2Q91T9DVW","websockets","https:\u002F\u002Fgithub.com\u002FComeOnOliver\u002Fskillshub\u002Fblob\u002Fmain\u002Fskills\u002Fzoom\u002Fskills\u002Fwebsockets\u002FSKILL.md",[],[134]]