cloudflare-full-stack-integration

SKILL.md

Production-tested patterns for React + Cloudflare Workers + Hono + Clerk authentication.

Key Insight: The Worker and frontend run on the SAME port during development.

Why: The Vite plugin runs your Worker using workerd directly in the dev server. No proxy needed!

React 프런트엔드를 Cloudflare Worker 백엔드에 연결하기 위해 프로덕션 테스트를 거친 통합 패턴 Hono, 사무원 인증 및 D1 데이터베이스를 사용합니다. 일반적인 프런트엔드-백엔드 연결 문제를 방지합니다. CORS 오류, 인증 토큰 실패 및 경쟁 조건. 사용 시기: 프런트엔드를 백엔드에 연결, 인증 흐름 구현, API 호출 설정, CORS 문제 해결, 경쟁 조건 수정, 인증 토큰 통과 안 됨, 프런트엔드-백엔드 연결 오류, 401 오류, 직원과 직원 통합, 전체 스택 Cloudflare 앱 설정, vite cloudflare 플러그인 설정. 방지 사항: CORS 오류, 401 무단, 인증 토큰 불일치, 인증 로드 시 경합 상태, 환경 변수 혼동, 프런트엔드에서 잘못된 엔드포인트 호출, JWT 확인 오류, D1 연결 문제. 키워드: 프런트엔드 백엔드 통합, Cloudflare Workers, Hono, 사무원 인증, JWT 확인, CORS, React API 클라이언트, 경쟁 조건, 인증 로딩, 연결 문제, 전체 스택 통합, vite 플러그인, @cloudflare/vite-plugin, D1 데이터베이스, 환경 변수, 토큰 첨부, 세션 관리, 보호 경로, API 미들웨어 출처: jackspace/claudeskillz.

원본 보기