code-server/cursor-fullstack/cloudflare/CLOUDFLARE_SETUP.md

# إعداد Cloudflare - Cursor Full Stack AI IDE

## 🌐 إعداد Cloudflare للعمل مع التطبيق

هذا الدليل يوضح كيفية إعداد التطبيق للعمل على Cloudflare Workers وPages.

## 🚀 المتطلبات

### 1. حساب Cloudflare
- سجل في [Cloudflare](https://cloudflare.com)
- تأكد من تفعيل Workers وPages

### 2. أدوات التطوير
```bash
# تثبيت Wrangler CLI
npm install -g wrangler

# تسجيل الدخول إلى Cloudflare
wrangler login
```

## 📦 إعداد المشروع

### 1. إعداد Backend (Workers)
```bash
# الانتقال إلى مجلد Backend
cd cloudflare/backend

# تثبيت التبعيات
npm install

# نشر Worker
wrangler deploy
```

### 2. إعداد Frontend (Pages)
```bash
# الانتقال إلى مجلد Frontend
cd cloudflare/frontend

# تثبيت التبعيات
npm install

# بناء المشروع
npm run build

# نشر إلى Pages
wrangler pages deploy dist
```

## 🔧 إعداد الخدمات

### 1. إعداد Durable Objects
```bash
# إنشاء Durable Object
wrangler durable-object create WebSocketDO
```

### 2. إعداد KV Storage
```bash
# إنشاء KV namespace
wrangler kv:namespace create "API_KEYS"
wrangler kv:namespace create "API_KEYS" --preview

# إضافة معرفات KV إلى wrangler.toml
```

### 3. إعداد R2 Storage
```bash
# إنشاء R2 bucket
wrangler r2 bucket create cursor-files
wrangler r2 bucket create cursor-files-preview
```

## 🌍 إعداد النطاق

### 1. إعداد Subdomain
```bash
# إعداد subdomain للBackend
wrangler subdomain set cursor-backend

# إعداد subdomain للFrontend
wrangler subdomain set cursor-frontend
```

### 2. إعداد Custom Domain (اختياري)
```bash
# إضافة custom domain
wrangler custom-domains add cursor-backend.yourdomain.com
wrangler custom-domains add cursor-frontend.yourdomain.com
```

## ⚙️ متغيرات البيئة

### Backend Environment Variables
```bash
# إضافة متغيرات البيئة
wrangler secret put NODE_ENV
wrangler secret put CORS_ORIGIN
wrangler secret put API_KEYS_NAMESPACE_ID
wrangler secret put FILE_STORAGE_BUCKET_NAME
```

### Frontend Environment Variables
```bash
# إضافة متغيرات البيئة للFrontend
wrangler pages secret put VITE_BACKEND_URL
wrangler pages secret put VITE_WS_URL
```

## 🚀 نشر التطبيق

### 1. نشر Backend
```bash
cd cloudflare/backend
wrangler deploy
```

### 2. نشر Frontend
```bash
cd cloudflare/frontend
npm run build
wrangler pages deploy dist
```

### 3. إعداد DNS
```bash
# إضافة DNS records
wrangler dns create cursor-backend.yourdomain.com A 192.0.2.1
wrangler dns create cursor-frontend.yourdomain.com A 192.0.2.1
```

## 🔗 روابط التطبيق

بعد النشر، سيكون التطبيق متاحاً على:

### Backend (Workers)
- **URL**: `https://cursor-backend.YOUR_SUBDOMAIN.workers.dev`
- **WebSocket**: `wss://cursor-backend.YOUR_SUBDOMAIN.workers.dev`

### Frontend (Pages)
- **URL**: `https://cursor-frontend.YOUR_SUBDOMAIN.pages.dev`
- **Custom Domain**: `https://cursor-frontend.yourdomain.com`

## 📊 مراقبة الأداء

### 1. Cloudflare Analytics
- انتقل إلى Cloudflare Dashboard
- اختر Workers & Pages
- عرض الإحصائيات والأداء

### 2. Logs
```bash
# عرض logs للBackend
wrangler tail cursor-backend

# عرض logs للFrontend
wrangler pages tail cursor-frontend
```

## 🔒 الأمان

### 1. CORS Configuration
```javascript
// في wrangler.toml
[env.production.vars]
CORS_ORIGIN = "https://cursor-frontend.YOUR_SUBDOMAIN.pages.dev"
```

### 2. Rate Limiting
```javascript
// إضافة rate limiting
const rateLimiter = new RateLimiter({
  limit: 100,
  windowMs: 60000
});
```

### 3. API Key Security
```javascript
// تخزين API keys في KV Storage
await env.API_KEYS.put(`key_${provider}_${userId}`, apiKey);
```

## 🚀 التحسينات

### 1. Caching
```javascript
// إضافة caching للاستجابات
const cache = caches.default;
const cacheKey = new Request(url, request);
const cachedResponse = await cache.match(cacheKey);
```

### 2. Compression
```javascript
// ضغط الاستجابات
const response = new Response(compressedBody, {
  headers: {
    'Content-Encoding': 'gzip',
    'Content-Type': 'application/json'
  }
});
```

### 3. CDN
- Cloudflare CDN مفعل تلقائياً
- تحسين الأداء عالمياً
- تقليل زمن الاستجابة

## 🔧 استكشاف الأخطاء

### 1. مشاكل الاتصال
```bash
# فحص حالة Workers
wrangler whoami

# فحص logs
wrangler tail cursor-backend --format=pretty
```

### 2. مشاكل WebSocket
```javascript
// فحص WebSocket connection
if (ws.readyState === WebSocket.OPEN) {
  console.log('WebSocket connected');
} else {
  console.log('WebSocket not connected');
}
```

### 3. مشاكل Storage
```bash
# فحص KV Storage
wrangler kv:key list --namespace-id=YOUR_NAMESPACE_ID

# فحص R2 Storage
wrangler r2 bucket list
```

## 📈 الأداء

### 1. Cold Start
- **Workers**: ~50ms
- **Pages**: ~100ms
- **Durable Objects**: ~200ms

### 2. Throughput
- **Workers**: 100,000 requests/second
- **Pages**: 10,000 requests/second
- **WebSocket**: 1,000 concurrent connections

### 3. Storage
- **KV**: 1GB per namespace
- **R2**: 10GB free tier
- **Durable Objects**: 128MB per object

## 🎯 أفضل الممارسات

### 1. Code Organization
```javascript
// تنظيم الكود في modules
import { handleAIChat } from './ai-handlers.js';
import { executeTool } from './tool-handlers.js';
```

### 2. Error Handling
```javascript
// معالجة الأخطاء
try {
  const result = await processRequest(request);
  return new Response(JSON.stringify(result));
} catch (error) {
  return new Response(JSON.stringify({ error: error.message }), {
    status: 500
  });
}
```

### 3. Monitoring
```javascript
// إضافة monitoring
console.log('Request processed:', {
  method: request.method,
  url: request.url,
  timestamp: new Date().toISOString()
});
```

## 🎉 النشر النهائي

### 1. Production Deployment
```bash
# نشر Backend
cd cloudflare/backend
wrangler deploy --env production

# نشر Frontend
cd cloudflare/frontend
npm run build
wrangler pages deploy dist --project-name cursor-frontend
```

### 2. Custom Domain Setup
```bash
# إضافة custom domain
wrangler custom-domains add cursor-backend.yourdomain.com
wrangler custom-domains add cursor-frontend.yourdomain.com
```

### 3. SSL Certificate
- Cloudflare SSL مفعل تلقائياً
- دعم HTTP/2 وHTTP/3
- أمان عالي

## 📞 الدعم

### 1. Cloudflare Support
- [Cloudflare Documentation](https://developers.cloudflare.com/)
- [Workers Documentation](https://developers.cloudflare.com/workers/)
- [Pages Documentation](https://developers.cloudflare.com/pages/)

### 2. Community
- [Cloudflare Community](https://community.cloudflare.com/)
- [Discord Server](https://discord.gg/cloudflaredev)
- [GitHub Issues](https://github.com/cloudflare/workers)

---

**تطبيق Cursor Full Stack AI IDE جاهز للعمل على Cloudflare! 🚀**

**استمتع بأداء عالي وأمان متقدم! 🌍**