adding-a-new-app-route

Fully wires up a new route with required boilerplate, following this repo's conventions for subapps. Use when user wants to add a new route or app or subapp or page or screen.

632 stars

Best use case

adding-a-new-app-route is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Fully wires up a new route with required boilerplate, following this repo's conventions for subapps. Use when user wants to add a new route or app or subapp or page or screen.

Teams using adding-a-new-app-route should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/adding-a-new-app-route/SKILL.md --create-dirs "https://raw.githubusercontent.com/artsy/force/main/.claude/skills/adding-a-new-app-route/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/adding-a-new-app-route/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How adding-a-new-app-route Compares

Feature / Agentadding-a-new-app-routeStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Fully wires up a new route with required boilerplate, following this repo's conventions for subapps. Use when user wants to add a new route or app or subapp or page or screen.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# Adding a new route

Use this checklist to track your work:

- [ ] Determine name & route for the new app
- [ ] Determine the kind of app to create
- [ ] Create a folder for the new app
- [ ] Mount the new app in the global routes listing
- [ ] Consider next steps

## Determine name & route for the new app

If the name of the new app and the desired route have not already been specified, `AskUserQuestion` to determine that information, e.g. `MyApp` at `/my-app`.

## Determine the kind of app to create

- **Static**: The simplest possible app with static-only content
- **Dynamic**: A typical app that fetches data based on route params

Use the answer in the next step.

## Create a folder for the new app

- Choose the correct template directory based on the previous step:
  - **Static**: `./templates/static/Replace/`
  - **Dynamic**: `./templates/dynamic/Replace/`
- Use that directory as the template for the new subapp
- Recreate that folder structure under `/src/Apps/<NewApp>`
- Replace all instances of `replace` and `Replace` with appropriate naming (case-sensitive)

## Mount the new app in the global routes listing

Add the new route to the main route list at `src/routes.tsx`. Follow existing conventions re: alphabetization.

## Consider next steps

Additional dev advice:

- You may need to restart the server for the new route to take effect
- Then visit http://localhost:4000/{replace} to see your new app
- Examine the generated code for additional follow-ups

## Celebrate

Indicate you are done with a /beep

Related Skills

beep

632
from artsy/force

Play a system beep. Use when asked to beep, play a beep, issue a system beep etc.

General Utilities

llm-router

3891
from openclaw/skills

Unified LLM Gateway - One API for 70+ AI models. Route to GPT, Claude, Gemini, Qwen, Deepseek, Grok and more with a single API key.

LLM Management & Routing

clawrouter

3891
from openclaw/skills

Smart LLM router — save 67% on inference costs. Routes every request to the cheapest capable model across 41 models from OpenAI, Anthropic, Google, DeepSeek, and xAI.

AI Optimization & Cost Savings

skill-router

31355
from sickn33/antigravity-awesome-skills

Use when the user is unsure which skill to use or where to start. Interviews the user with targeted questions and recommends the best skill(s) from the installed library for their goal.

nano-banana-pro-openrouter

28865
from github/awesome-copilot

Generate or edit images via OpenRouter with the Gemini 3 Pro Image model. Use for prompt-only image generation, image edits, and multi-image compositing; supports 1K/2K/4K output.

webiny-admin-router-catalog

7955
from webiny/webiny-js

admin/router — 6 abstractions.

astrai-inference-router

3891
from openclaw/skills

Route all LLM calls through Astrai for 40%+ cost savings with intelligent routing and privacy controls

openrouter-image-generation

3891
from openclaw/skills

Generate or edit images through OpenRouter's multimodal image generation endpoint (`/api/v1/chat/completions`) using OpenRouter-compatible image models. Use for text-to-image or image-to-image requests when the user wants OpenRouter, `OPENROUTER_API_KEY`, model overrides, or provider-specific `image_config` options.

smart-router

3891
from openclaw/skills

No description provided.

llmcouncil-router

3891
from openclaw/skills

Route any prompt to the best-performing LLM using peer-reviewed council rankings from LLM Council

memory-router

3891
from openclaw/skills

Central dispatch layer for OpenClaw Memory Stack. Routes memory queries to the best backend via signal detection, class-based dispatch, and sequential fallback.

wheels-router

3891
from openclaw/skills

Plan public transit trips globally using Wheels Router (Hong Kong) and Transitous (worldwide)