jac-cl-routing

Implements client-side routing in Jac apps using file-based pages or manual Router declarations.

Updated Jul 26, 2026
One-click install
npx skills add https://github.com/nihalnihalani/jachacks-sf-2026 --skill jac-cl-routing-nihalnihalani
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: jac-cl-routing
Source: https://github.com/nihalnihalani/jachacks-sf-2026/tree/main/plugins/jac-codex/skills/jac-cl-routing
Command: npx skills add https://github.com/nihalnihalani/jachacks-sf-2026 --skill jac-cl-routing-nihalnihalani

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Building multi-page Jac client applications requires choosing and correctly wiring a routing system, and common mistakes like mixing file-based routing with a manual Router or exporting the wrong app shape silently break navigation. ## Core Features & Use Cases - File-based routing: Files in a pages/ directory become routes by convention, with [id] dynamic params, route groups like (auth)/ for automatic protection, nested layouts via <Outlet/>, and catch-all 404 pages. - Manual routing: An explicit <Router>/<Routes> route table for apps that prefer one file of route declarations, with components kept outside pages/. - Navigation APIs: Covers <Link>, useNavigate, <Navigate>, useParams, useLocation, and query-string parsing with URLSearchParams. - Use Case: Add a protected /dashboard section with a shared layout and a /users/:id detail page to a Jac web app, including the correct main.jac app(children) export so routes actually render. ## Quick Start Add a pages directory with index.jac and about.jac routes to my Jac app and update main.jac to export an app that renders the router children.

Frequently Asked Questions about jac-cl-routing

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add multiple pages to a Jac client app?▼

Create a pages/ directory where each file with a public export returning JsxPage becomes a route by convention, such as pages/about.jac mapping to /about. Then make main.jac export def:pub app(children) that renders the children so the generated router tree displays.

File-based routing vs manual Router in Jac, which should I use?▼

File-based routing with a pages/ directory is the recommended default since routes are created by convention with no Router wiring. Manual <Router>/<Routes> is the alternative for one explicit route table, but you must pick one system and never mix them.

How do I create protected routes in a Jac app?▼

Place pages inside a route group folder named (auth)/ and the build automatically wraps every page inside with an AuthGuard, adding no URL segment. The default unauthenticated redirect is /login, configurable via auth_redirect in jac.toml.

Why are my Jac pages routes not rendering?▼

The most common cause is an app export that ignores its children, such as the single-page template shape, which silently drops every route. Export def:pub app(children) returning JSX that renders children, since a JSX-less app is placed server-side and never exported to the client entry.

How do I read URL params and query strings in Jac?▼

Use useParams() and access values by subscript like params["id"], since it returns a plain dict and dot access fails. For query strings, parse useLocation().search with new(URLSearchParams, location.search), as there is no useSearchParams hook.