Implements navigation patterns and routing for both frontend (React/TS) and backend (Python) including menus, tabs, breadcrumbs, client-side routing, and server-side route configuration.
NewMaintained
Automatic
◆Frontend / UI pack
Last verified 8/21/2026
What it changes
Passed 0 of 24 test cases with the skill, and 24 of 24 without it.
Without skill100%
With skill0%
0 fixed20 passed either way3 still failing1 broke
Pass-rate lift
-100 pp
Tokens
+103%
Agent turns
0%
Response time
+4%
Model gemini-3.6-flashMeasured 8/21/2026v120 of 24 cases passed with skill
Tokens, turns and time describe resource use, not a dollar price.
What's inside
The instructions your model reads when the skill loads.
SKILL.md237 lines14 filesincludes scripts
Navigation Patterns & Routing Implementation
Purpose
This skill provides comprehensive guidance for implementing navigation systems across both frontend and backend applications. It covers client-side navigation patterns (menus, tabs, breadcrumbs) and routing (React Router, Next.js) as well as server-side route configuration (Flask, Django, FastAPI).
When to Use
Use this skill when:
Building primary navigation (top, side, mega menus)
Creating mobile navigation patterns (hamburger, bottom nav)
Implementing keyboard-accessible navigation
Building command palettes or search-driven navigation
Creating multi-step wizards or steppers
Ensuring WCAG 2.1 AA compliance for navigation
Navigation Decision Framework
Information Architecture → Navigation Pattern
Flat (1-2 levels) → Top Navigation
Deep (3+ levels) → Side Navigation
E-commerce/Large → Mega Menu
Linear Process → Stepper/Wizard
Long Content → Table of Contents
Power Users → Command Palette
Multi-section Page → Tabs
Large Data Sets → Pagination