skills.rest
firtoz
firtozCOMMUNITY
Explore all skills by this author →
Website𝕏@firtozGitHub

routing

Configure React Router v7 routes and environment variables in Cloudflare Workers.

10|Updated May 22, 2025
Search Tags:#routing#ssr#cloudflare-workers#react-router#env-variables#typegen
One-click install
npx skills add https://github.com/firtoz/cf-multiworker-starter-kit --skill routing-firtoz
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: routing
Source: https://github.com/firtoz/cf-multiworker-starter-kit/tree/main/agents/skills/routing
Command: npx skills add https://github.com/firtoz/cf-multiworker-starter-kit --skill routing-firtoz

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill provides structured guidance for implementing and maintaining React Router v7 routing patterns and environment variable configuration across Cloudflare Workers projects.

Core Features & Use Cases

  • File-based routing patterns and route configuration in a React Router v7 setup.
  • Guidance on environment variable usage and safe access in route context for SSR apps.
  • Best practices for type generation after editing routes.ts and exporting RoutePath for type safety.

Quick Start

Edit the routes in apps/web/app/routes.ts and run bun run typegen at the workspace root to regenerate type definitions.

Frequently Asked Questions about routing

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

FAQPage Schema
How do I configure environment variables for SSR in React Router v7?▼

To configure environment variables for SSR in React Router v7, you must use safe access patterns in route context and ensure compliant variable usage with cloudflare:workers bindings to prevent server-side rendering leaks.

What's the best way to manage file-based routing in a React Router v7 Cloudflare Workers project?▼

The best way to manage file-based routing in a React Router v7 Cloudflare Workers project is to edit routes in apps/web/app/routes.ts and run bun run typegen at the workspace root to regenerate type definitions.

How do I regenerate types after editing routes.ts in React Router v7?▼

You regenerate types after editing routes.ts in React Router v7 by running bun run typegen at the workspace root, which updates type definitions and ensures proper RoutePath exports for type safety.

Does this React Router v7 routing skill work with Cloudflare Workers bindings?▼

Yes, this React Router v7 routing skill works with Cloudflare Workers by ensuring route context interacts correctly with environment bindings and applying SSR-safe code patterns for compliant environment variable usage.

Why does my route context break when accessing env vars during SSR?▼

Your route context breaks during SSR when accessing env vars because it requires SSR-safe code patterns that properly interact with cloudflare:workers bindings rather than direct, unsafe environment variable access.

Related Skills

Explore More Software Engineering Skills→
WalshingtonWalshington

tanstack-start

Build and deploy TanStack Start full-stack React apps on Cloudflare Workers.

Community
Advanced
secondskysecondsky
204

cloudflare-nextjs

Deploy Next.js applications to Cloudflare Workers using the OpenNext adapter.

Community
Advanced
FenntasyFenntasy

react-router

Automate server-first data loading and mutations for React Router v7 SSR applications.

Community
Advanced
dotlab-hqdotlab-hq
1

tanstack-start

Set up full-stack React apps with SSR and Cloudflare Workers deployment.

Official
Advanced