feat: Add Cloudflare Pages deployment scripts and docs

Introduces deployment scripts, documentation, and updates package.json for Cloudflare Pages deployment.

Co-authored-by: logato7838 <logato7838@vsihay.com>
This commit is contained in:
Cursor Full Stack AI IDE 2025-10-12 14:37:37 +00:00
parent 1b19e8504f
commit 50553a4b05
6 changed files with 465 additions and 8 deletions

View file

@ -0,0 +1,182 @@
# 🚀 دليل التثبيت والنشر - Cursor Full Stack AI IDE
## 📋 نظرة عامة
هذا دليل شامل لتثبيت ونشر تطبيق Cursor Full Stack AI IDE على Cloudflare Pages.
## 🚀 النشر السريع
### 1. النشر بنقرة واحدة
```bash
cd cloudflare/frontend
./one-click-deploy.sh
```
### 2. النشر المتقدم
```bash
cd cloudflare/frontend
./deploy.sh
```
## 🛠️ التثبيت اليدوي
### 1. تثبيت المتطلبات
```bash
# تثبيت Node.js 18+
# تثبيت npm 8+
# تثبيت Wrangler CLI
npm install -g wrangler
```
### 2. تسجيل الدخول إلى Cloudflare
```bash
wrangler login
```
### 3. تثبيت التبعيات
```bash
cd cloudflare/frontend
npm install
```
### 4. بناء المشروع
```bash
npm run build
```
### 5. نشر على Cloudflare Pages
```bash
wrangler pages deploy dist --project-name cursor-ide
```
## 🔧 إعداد Cloudflare Pages
### 1. إنشاء مشروع جديد
1. انتقل إلى [Cloudflare Dashboard](https://dash.cloudflare.com)
2. اختر **Pages** > **Create a project**
3. اختر **Connect to Git**
4. اختر المستودع الخاص بك
5. إعدادات البناء:
- **Framework preset**: Vite
- **Build command**: `npm run build`
- **Build output directory**: `dist`
### 2. إضافة متغيرات البيئة
```bash
VITE_BACKEND_URL=https://cursor-backend.workers.dev
VITE_WS_URL=wss://cursor-backend.workers.dev
VITE_APP_NAME=Cursor Full Stack AI IDE
VITE_APP_VERSION=1.0.0
```
## 🌍 النتيجة المتوقعة
بعد النشر، ستحصل على:
- **Frontend**: `https://cursor-ide.pages.dev`
- **Backend**: `https://cursor-backend.workers.dev`
- **WebSocket**: `wss://cursor-backend.workers.dev`
## 🔧 استكشاف الأخطاء
### مشكلة: Wrangler غير مثبت
```bash
npm install -g wrangler
```
### مشكلة: غير مسجل الدخول
```bash
wrangler login
```
### مشكلة: البناء فشل
```bash
rm -rf node_modules package-lock.json
npm install
npm run build
```
### مشكلة: النشر فشل
```bash
wrangler pages project create cursor-ide
wrangler pages deploy dist --project-name cursor-ide
```
## 📋 خطوات النشر النهائية
### 1. إعداد المستودع
```bash
# إنشاء مستودع جديد
gh repo create cursor-ide-frontend --public
# نسخ الملفات
cp -r cloudflare/frontend/* cursor-ide-frontend/
cd cursor-ide-frontend
# إعداد Git
git init
git add .
git commit -m "Initial commit"
git remote add origin https://github.com/your-username/cursor-ide-frontend.git
git push -u origin main
```
### 2. ربط Cloudflare Pages
1. انتقل إلى Cloudflare Dashboard
2. Pages > Create a project
3. Connect to Git
4. اختر المستودع الجديد
5. إعدادات البناء:
- Framework: Vite
- Build command: `npm run build`
- Build output directory: `dist`
### 3. إضافة متغيرات البيئة
```bash
VITE_BACKEND_URL=https://cursor-backend.workers.dev
VITE_WS_URL=wss://cursor-backend.workers.dev
```
### 4. النشر
- Cloudflare Pages سيبني المشروع تلقائياً
- ستحصل على رابط مباشر للتطبيق
## 🎉 النتيجة النهائية
تطبيق Cursor Full Stack AI IDE سيكون متاحاً على:
- **Frontend**: `https://cursor-ide.pages.dev`
- **Backend**: `https://cursor-backend.workers.dev`
- **WebSocket**: `wss://cursor-backend.workers.dev`
## 🚀 البدء السريع
```bash
# 1. النشر بنقرة واحدة
cd cloudflare/frontend
./one-click-deploy.sh
# 2. أو النشر المتقدم
cd cloudflare/frontend
./deploy.sh
# 3. أو النشر اليدوي
cd cloudflare/frontend
npm install
npm run build
wrangler pages deploy dist --project-name cursor-ide
```
---
**🎯 هذا الحل سيضمن نشر التطبيق بنجاح على Cloudflare Pages!**

View file

@ -34,17 +34,12 @@ git push -u origin main
- **Framework preset**: Vite
- **Build command**: `npm run build`
- **Build output directory**: `dist`
- **Root directory**: `/` (root)
### 3. إضافة متغيرات البيئة
في Cloudflare Pages Dashboard، أضف:
```bash
VITE_BACKEND_URL=https://cursor-backend.workers.dev
VITE_WS_URL=wss://cursor-backend.workers.dev
VITE_APP_NAME=Cursor Full Stack AI IDE
VITE_APP_VERSION=1.0.0
```
## 🛠️ التطوير المحلي

View file

@ -0,0 +1,177 @@
#!/bin/bash
# Cursor Full Stack AI IDE - Deploy to Cloudflare Pages
# This script automates the deployment process to Cloudflare Pages
set -e
# Colors
GREEN='\033[0;32m'
BLUE='\033[0;34m'
YELLOW='\033[1;33m'
RED='\033[0;31m'
NC='\033[0m'
echo -e "${BLUE}"
echo "=========================================="
echo " 🚀 Cursor Full Stack AI IDE"
echo " 📦 Deploy to Cloudflare Pages"
echo "=========================================="
echo -e "${NC}"
# Configuration
PROJECT_NAME="cursor-ide"
BUILD_DIR="dist"
NODE_VERSION="18"
# Check if Wrangler is installed
check_wrangler() {
if ! command -v wrangler &> /dev/null; then
echo -e "${RED}Wrangler CLI is not installed${NC}"
echo "Installing Wrangler CLI..."
npm install -g wrangler
fi
echo -e "${GREEN}✅ Wrangler CLI is available${NC}"
}
# Check if user is logged in
check_auth() {
if ! wrangler whoami &> /dev/null; then
echo -e "${RED}Not logged in to Cloudflare${NC}"
echo "Please log in to Cloudflare..."
wrangler login
fi
echo -e "${GREEN}✅ Logged in to Cloudflare${NC}"
}
# Install dependencies
install_dependencies() {
echo -e "${YELLOW}Installing dependencies...${NC}"
npm install
echo -e "${GREEN}✅ Dependencies installed${NC}"
}
# Build the project
build_project() {
echo -e "${YELLOW}Building project...${NC}"
npm run build
echo -e "${GREEN}✅ Project built successfully${NC}"
}
# Create or update Pages project
setup_pages_project() {
echo -e "${YELLOW}Setting up Pages project...${NC}"
# Check if project exists
if wrangler pages project list | grep -q "$PROJECT_NAME"; then
echo "Project $PROJECT_NAME already exists"
else
echo "Creating new Pages project: $PROJECT_NAME"
wrangler pages project create "$PROJECT_NAME"
fi
echo -e "${GREEN}✅ Pages project ready${NC}"
}
# Deploy to Cloudflare Pages
deploy_to_pages() {
echo -e "${YELLOW}Deploying to Cloudflare Pages...${NC}"
# Deploy the built files
wrangler pages deploy "$BUILD_DIR" --project-name "$PROJECT_NAME"
echo -e "${GREEN}✅ Deployed to Cloudflare Pages${NC}"
}
# Get deployment URL
get_deployment_url() {
echo -e "${YELLOW}Getting deployment URL...${NC}"
# Get the deployment URL
DEPLOYMENT_URL=$(wrangler pages project list | grep "$PROJECT_NAME" | awk '{print $2}')
if [ -n "$DEPLOYMENT_URL" ]; then
echo -e "${GREEN}✅ Deployment URL: https://$DEPLOYMENT_URL${NC}"
else
echo -e "${YELLOW}⚠️ Could not get deployment URL${NC}"
fi
}
# Test deployment
test_deployment() {
echo -e "${YELLOW}Testing deployment...${NC}"
if [ -n "$DEPLOYMENT_URL" ]; then
if curl -f "https://$DEPLOYMENT_URL" > /dev/null 2>&1; then
echo -e "${GREEN}✅ Deployment is accessible${NC}"
else
echo -e "${YELLOW}⚠️ Deployment might not be ready yet${NC}"
fi
fi
}
# Show deployment summary
show_summary() {
echo -e "\n${GREEN}=========================================="
echo " 🎉 DEPLOYMENT COMPLETE! 🎉"
echo "=========================================="
echo -e "${NC}"
echo -e "${GREEN}✅ Frontend deployed successfully${NC}"
if [ -n "$DEPLOYMENT_URL" ]; then
echo -e " URL: https://$DEPLOYMENT_URL"
fi
echo -e "\n${BLUE}🔗 Access your application:${NC}"
echo -e "Frontend: https://$DEPLOYMENT_URL"
echo -e "Backend: https://cursor-backend.workers.dev"
echo -e "WebSocket: wss://cursor-backend.workers.dev"
echo -e "\n${YELLOW}📋 Next Steps:${NC}"
echo -e "1. 🌐 Open your application in the browser"
echo -e "2. 🔑 Configure your AI provider API keys"
echo -e "3. 🧪 Test the application functionality"
echo -e "4. 📊 Monitor performance in Cloudflare Dashboard"
echo -e "\n${GREEN}=========================================="
echo " 🚀 Your AI IDE is now live! 🚀"
echo "=========================================="
echo -e "${NC}"
}
# Main execution
main() {
check_wrangler
check_auth
install_dependencies
build_project
setup_pages_project
deploy_to_pages
get_deployment_url
test_deployment
show_summary
}
# Parse command line arguments
while [[ $# -gt 0 ]]; do
case $1 in
--project-name)
PROJECT_NAME="$2"
shift 2
;;
--help)
echo "Usage: $0 [OPTIONS]"
echo "Options:"
echo " --project-name NAME Cloudflare Pages project name (default: cursor-ide)"
echo " --help Show this help message"
exit 0
;;
*)
echo "Unknown option: $1"
exit 1
;;
esac
done
# Run main function
main

View file

@ -0,0 +1,44 @@
#!/bin/bash
# Cursor Full Stack AI IDE - One-Click Deploy to Cloudflare Pages
# This script provides the simplest possible deployment experience
set -e
# Colors
GREEN='\033[0;32m'
BLUE='\033[0;34m'
YELLOW='\033[1;33m'
RED='\033[0;31m'
NC='\033[0m'
echo -e "${BLUE}"
echo "=========================================="
echo " 🚀 Cursor Full Stack AI IDE"
echo " ⚡ One-Click Deploy to Cloudflare Pages"
echo "=========================================="
echo -e "${NC}"
# Check if user wants to proceed
echo -e "${YELLOW}This will automatically:${NC}"
echo "✅ Install Wrangler CLI (if needed)"
echo "✅ Authenticate with Cloudflare"
echo "✅ Install dependencies"
echo "✅ Build the project"
echo "✅ Deploy to Cloudflare Pages"
echo "✅ Provide you with live URL"
echo ""
read -p "Do you want to proceed? (y/N): " -n 1 -r
echo
if [[ ! $REPLY =~ ^[Yy]$ ]]; then
echo "Deployment cancelled."
exit 1
fi
# Run the deployment
echo -e "${GREEN}Starting deployment...${NC}"
./deploy.sh
echo -e "${GREEN}🎉 Deployment completed successfully!${NC}"
echo -e "${BLUE}Your AI IDE is now live and ready to use!${NC}"

View file

@ -0,0 +1,31 @@
{
"name": "cursor-fullstack-ai-ide-frontend",
"version": "1.0.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "cursor-fullstack-ai-ide-frontend",
"version": "1.0.0",
"license": "MIT",
"dependencies": {
"@monaco-editor/react": "^4.6.0",
"lucide-react": "^0.294.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"socket.io-client": "^4.7.4"
},
"devDependencies": {
"@types/react": "^18.2.43",
"@types/react-dom": "^18.2.17",
"@vitejs/plugin-react": "^4.2.1",
"autoprefixer": "^10.4.16",
"postcss": "^8.4.32",
"tailwindcss": "^3.3.6",
"typescript": "^5.2.2",
"vite": "^5.0.8",
"wrangler": "^3.0.0"
}
}
}
}

View file

@ -1,11 +1,13 @@
{
"name": "cursor-frontend-cloudflare",
"name": "cursor-fullstack-ai-ide-frontend",
"version": "1.0.0",
"description": "A complete AI-powered development environment with Monaco Editor, real-time chat, and integrated tools",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview",
"dev": "vite dev"
"deploy": "npm run build && wrangler pages deploy dist --project-name cursor-ide"
},
"dependencies": {
"@monaco-editor/react": "^4.6.0",
@ -22,6 +24,32 @@
"postcss": "^8.4.32",
"tailwindcss": "^3.3.6",
"typescript": "^5.2.2",
"vite": "^5.0.8"
"vite": "^5.0.8",
"wrangler": "^3.0.0"
},
"keywords": [
"ai-ide",
"monaco-editor",
"code-editor",
"development",
"cloudflare",
"react",
"typescript",
"vite",
"tailwindcss"
],
"author": "Cursor Full Stack AI IDE",
"license": "MIT",
"repository": {
"type": "git",
"url": "https://github.com/your-username/cursor-fullstack-ai-ide.git"
},
"bugs": {
"url": "https://github.com/your-username/cursor-fullstack-ai-ide/issues"
},
"homepage": "https://cursor-ide.pages.dev",
"engines": {
"node": ">=18.0.0",
"npm": ">=8.0.0"
}
}