InnoPot Product Ideas

Kleine Fullstack-App mit React, Vite, Cloudflare Workers, D1 und R2.

Projektstruktur

• src/: React SPA
• worker/: Cloudflare Worker mit API und Bildauslieferung
• migrations/: D1-Migrationen

Lokale Entwicklung

1. Abhängigkeiten installieren:

   npm install

2. D1-Datenbank anlegen:

   npx wrangler d1 create innopot-ideas-db

   Trage danach die database_id in wrangler.toml ein.
3. R2-Buckets anlegen:

   npx wrangler r2 bucket create innopot-ideas-images
   npx wrangler r2 bucket create innopot-ideas-images-preview

4. Migration ausführen:

   npx wrangler d1 migrations apply innopot-ideas-db --local
   npx wrangler d1 migrations apply innopot-ideas-db --remote

5. Worker starten:

   npm run worker:dev

6. Frontend starten:

   npm run dev

Deployment

npm run deploy

Annahmen

• Bilder werden nicht öffentlich aus R2 exponiert, sondern über GET /images/:key vom Worker ausgeliefert.
• Das Frontend nutzt relative Pfade wie /api/ideas und /images/....
• Styling-Klassen aus dem gelieferten React-Code bleiben erhalten; eine CSS/Tailwind-Basis wird im bestehenden Projekt vorausgesetzt oder kann ergänzt werden.