webflow-local-dev-loop

# Webflow Local Dev Loop ## Overview Set up a fast, reproducible local development workflow for Webflow Data API v2 integrations with TypeScript, hot reload, vitest mocking, and ngrok webhook tunneling. ## Prerequisites - Completed `webflow-install-auth` setup - Node.js 18+ with npm/pnpm - API token with required scopes - ngrok (optional, for webhook testing) ## Instructions ### Step 1: Project Structure ``` my-webflow-project/ ├── src/ │ ├── webflow/ │ │ ├── client.ts # WebflowClient singleton │ │ ├── collections.ts # CMS collection operations │ │ ├── sites.ts # Site operations │ │ └── types.ts # Shared types │ ├── webhooks/ │ │ └── handler.ts # Webhook endpoint │ └── index.ts ├── tests/ │ ├── collections.test.ts │ └── fixtures/ │ └── mock-items.json ├── .env.local # Local secrets (git-ignored) ├── .env.example # Template for team ├── tsconfig.json ├── vitest.config.ts └── package.json ``` ### Step 2: Package Configuration ```json { "name": "my-webflow-project", "type": "module", "scripts": { "dev": "tsx watch src/index.ts", "build": "tsc", "test": "vitest run", "test:watch": "vitest --watch", "tunnel": "ngrok http 3000" }, "dependencies": { "webflow-api": "^3.3.0", "express": "^4.21.0" }, "devDependencies": { "tsx": "^4.19.0", "typescript": "^5.6.0", "vitest": "^2.1.0", "@types/express": "^5.0.0", "@...