Skip to content

Commit 2c00f88

Browse files
HackStrixHackStrix
committed
forcing npm ci without cache
1 parent 617afdb commit 2c00f88

File tree

8 files changed

+397
-12
lines changed

8 files changed

+397
-12
lines changed

‎.github/README-CICD.md‎

Lines changed: 22 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,39 @@
11
# CI/CD Quick Start
22

3-
## Pull Production Images
3+
## 🌐 **Live Application**
4+
- **Frontend**: https://ocpp.sankalpnarula.com (Cloudflare Workers)
5+
- **Backend**: Pull from GHCR for your orchestration
6+
7+
## 📦 **Pull Production Images**
48

59
```bash
6-
# Backend
10+
# Backend (for your orchestration)
711
docker pull ghcr.io/hackstrix/ocpp-chaos-simulator:latest
812

9-
# Frontend
10-
docker pull ghcr.io/hackstrix/ocpp-chaos-simulator-frontend:latest
13+
# Frontend (deployed to Cloudflare Workers automatically)
14+
# No manual deployment needed - handled by GitHub Actions
1115
```
1216

13-
## Deploy with Docker Compose
17+
## 🚀 **Deployment Architecture**
18+
19+
- **Frontend**: Auto-deployed to Cloudflare Workers on push to main
20+
- **Backend**: Docker image pushed to GHCR, use with your orchestration
1421

1522
```bash
16-
# Use production compose file
23+
# Backend deployment with Docker Compose
1724
docker-compose -f deployments/docker-compose.prod.yml up -d
1825
```
1926

20-
## Pipeline Status
27+
## 📊 **Pipeline Status**
2128

2229
- ✅ **Build & Test**: Runs on all pushes and PRs
23-
- 🚀 **Deploy**: Runs on main branch merges
24-
- 📦 **Registry**: Images pushed to GHCR automatically
30+
- 🚀 **Deploy**:
31+
- Frontend → Cloudflare Workers (automatic)
32+
- Backend → GHCR (for your orchestration)
33+
34+
## 📚 **Documentation**
2535

26-
For detailed documentation, see [docs/ci-cd-pipeline.md](../docs/ci-cd-pipeline.md)
36+
- [CI/CD Pipeline Details](../docs/ci-cd-pipeline.md)
37+
- [Cloudflare Workers Migration](../docs/cloudflare-workers-migration.md)
38+
- [Custom Domain Setup](../docs/custom-domain-setup.md)
2739

‎.github/workflows/build-test.yml‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,9 @@ jobs:
7070
cache-dependency-path: './frontend/package-lock.json'
7171

7272
- name: Install dependencies
73-
run: npm ci
73+
run: |
74+
npm cache clean --force
75+
npm ci --legacy-peer-deps
7476
7577
- name: Run linter
7678
run: npm run lint

‎.github/workflows/deploy.yml‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,9 @@ jobs:
121121
cache-dependency-path: './frontend/package-lock.json'
122122

123123
- name: Install dependencies
124-
run: npm ci
124+
run: |
125+
npm cache clean --force
126+
npm ci --legacy-peer-deps
125127
126128
- name: Install Wrangler
127129
run: npm install -g wrangler

‎docs/cloudflare-workers-migration.md‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
# Cloudflare Workers Migration Guide
2+
3+
## ✅ **Migration Completed**
4+
5+
Your frontend has been successfully migrated from Cloudflare Pages to **Cloudflare Workers** deployment.
6+
7+
## 🔄 **What Changed**
8+
9+
### **1. Next.js Configuration (`frontend/next.config.js`)**
10+
- ✅ Changed `output: 'standalone'` → `output: 'export'`
11+
- ✅ Added `images: { unoptimized: true }` for static export
12+
- ✅ Conditional rewrites (development only)
13+
- ✅ Proper static site generation
14+
15+
### **2. Package Configuration (`frontend/package.json`)**
16+
- ✅ Added `@cloudflare/next-on-pages` dependency
17+
- ✅ New scripts:
18+
- `build:cloudflare` - Build for Workers deployment
19+
- `preview` - Local preview with Wrangler
20+
- `deploy` - Direct deployment via CLI
21+
22+
### **3. Wrangler Configuration (`frontend/wrangler.toml`)**
23+
- ✅ **NEW**: Configured for Workers (not Pages)
24+
- ✅ Build command: `npx @cloudflare/next-on-pages`
25+
- ✅ Worker entry point: `_worker.js`
26+
- ✅ Node.js compatibility enabled
27+
28+
### **4. GitHub Actions (`.github/workflows/deploy.yml`)**
29+
- ✅ Updated job name: "Deploy Frontend to Cloudflare Workers"
30+
- ✅ Build command: `npm run build:cloudflare`
31+
- ✅ Deploy command: `wrangler deploy`
32+
- ✅ Updated deployment summary
33+
34+
## 🚀 **How Deployment Works Now**
35+
36+
```mermaid
37+
graph LR
38+
A[Push to main] --> B[GitHub Actions]
39+
B --> C[npm run build:cloudflare]
40+
C --> D[Next.js Static Export]
41+
D --> E[@cloudflare/next-on-pages]
42+
E --> F[Workers-compatible bundle]
43+
F --> G[wrangler deploy]
44+
G --> H[Cloudflare Workers Edge]
45+
```
46+
47+
## 📋 **Required Secrets (Unchanged)**
48+
49+
Your GitHub repository needs these secrets:
50+
- ✅ `CLOUDFLARE_API_TOKEN` - Your Cloudflare API token
51+
- ✅ `CLOUDFLARE_ACCOUNT_ID` - Your Cloudflare account ID
52+
- ✅ `BACKEND_API_URL` - Your backend API URL for environment variables
53+
54+
## 🧪 **Local Development & Testing**
55+
56+
```bash
57+
# Development (with API proxy)
58+
npm run dev
59+
60+
# Build for Workers
61+
npm run build:cloudflare
62+
63+
# Preview locally
64+
npm run preview
65+
66+
# Deploy directly (if needed)
67+
npm run deploy
68+
```
69+
70+
## ⚡ **Workers vs Pages Comparison**
71+
72+
| Feature | Cloudflare Pages | Cloudflare Workers |
73+
|---------|------------------|-------------------|
74+
| **Deployment** | Git-based | API/CLI-based |
75+
| **Runtime** | Static + Functions | Edge Runtime |
76+
| **Performance** | CDN cached | Edge compute |
77+
| **Scaling** | Automatic | Automatic |
78+
| **Pricing** | Free tier generous | Pay-per-request |
79+
| **WebSockets** | Limited | Full support |
80+
81+
## ✅ **Benefits of Workers Migration**
82+
83+
- **⚡ Faster**: Edge runtime, no cold starts
84+
- **🌍 Global**: Deployed to Cloudflare's global network
85+
- **💡 Flexible**: Can add serverless functions later
86+
- **🔄 Real-time**: Better WebSocket support for OCPP
87+
- **📦 Smaller**: Optimized bundle size
88+
89+
## ⚠️ **Important Notes**
90+
91+
1. **Static Export**: Your frontend is now statically exported
92+
2. **API Routing**: Use environment variables for backend URLs
93+
3. **Development Proxy**: Rewrites only work in development mode
94+
4. **Build Artifacts**: Generated in `.vercel/output/static/`
95+
96+
## 🔗 **Useful Commands**
97+
98+
```bash
99+
# Check build artifacts
100+
ls -la .vercel/output/static/
101+
102+
# Test deployment locally
103+
wrangler dev .vercel/output/static/_worker.js
104+
105+
# View deployment logs
106+
wrangler tail
107+
108+
# Check deployment status
109+
wrangler deployments list
110+
```
111+
112+
## 🎯 **Next Steps**
113+
114+
1. **✅ Test deployment** - Push to main and verify Workers deployment
115+
2. **🔧 Configure custom domain** - Add routes in wrangler.toml
116+
3. **📊 Monitor performance** - Use Cloudflare Analytics
117+
4. **🛡️ Add security headers** - Configure in wrangler.toml
118+
5. **🚀 Add Workers functions** - For backend proxy if needed
119+
120+
Your frontend will now deploy as a Cloudflare Worker on every push to main! 🎉

‎docs/custom-domain-setup.md‎

Lines changed: 171 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,171 @@
1+
# Custom Domain Setup: ocpp.sankalpnarula.com
2+
3+
## 🎯 **Goal**
4+
Configure `ocpp.sankalpnarula.com` as the custom domain for your OCPP Chaos Simulator frontend deployed on Cloudflare Workers.
5+
6+
## ✅ **Configuration Complete**
7+
Your `wrangler.toml` is already configured with:
8+
```toml
9+
[[env.production.routes]]
10+
pattern = "ocpp.sankalpnarula.com/*"
11+
zone_name = "sankalpnarula.com"
12+
```
13+
14+
## 🔧 **Setup Methods**
15+
16+
### **Method 1: Automatic (Recommended)**
17+
18+
When you deploy via GitHub Actions, Wrangler will automatically:
19+
1. Create the subdomain route
20+
2. Configure SSL certificates
21+
3. Set up the custom domain
22+
23+
**No manual steps required!** 🎉
24+
25+
### **Method 2: Manual Dashboard Setup**
26+
27+
If you prefer manual control:
28+
29+
#### **Step 1: Cloudflare DNS**
30+
1. Go to **Cloudflare Dashboard** → `sankalpnarula.com`
31+
2. Navigate to **DNS** → **Records**
32+
3. **Add record**:
33+
```
34+
Type: CNAME
35+
Name: ocpp
36+
Target: ocpp-chaos-simulator.YOUR_SUBDOMAIN.workers.dev
37+
Proxy: Enabled (🧡)
38+
TTL: Auto
39+
```
40+
41+
#### **Step 2: Workers Custom Domain**
42+
1. **Workers & Pages** → **ocpp-chaos-simulator**
43+
2. **Settings** → **Triggers** → **Custom Domains**
44+
3. **Add Custom Domain**: `ocpp.sankalpnarula.com`
45+
4. **Activate**
46+
47+
## 🚀 **Deployment Process**
48+
49+
### **GitHub Actions (Automatic)**
50+
```bash
51+
# Your current workflow will:
52+
1. Build frontend → npm run build:cloudflare
53+
2. Deploy to Workers → wrangler deploy
54+
3. Configure domain → ocpp.sankalpnarula.com
55+
4. Report success → GitHub Actions summary
56+
```
57+
58+
### **Manual Deployment**
59+
```bash
60+
# Local deployment (if needed)
61+
cd frontend
62+
npm run build:cloudflare
63+
npm run deploy
64+
65+
# Or step by step
66+
wrangler login
67+
wrangler deploy
68+
```
69+
70+
## 🌐 **Domain Architecture**
71+
72+
```
73+
sankalpnarula.com (Main domain)
74+
├── www.sankalpnarula.com (Your main site)
75+
├── api.sankalpnarula.com (Potential backend)
76+
└── ocpp.sankalpnarula.com (OCPP Simulator) ← NEW
77+
```
78+
79+
## 📊 **Expected Results**
80+
81+
### **✅ Success Indicators**
82+
- Frontend accessible at: `https://ocpp.sankalpnarula.com`
83+
- SSL certificate automatically provisioned
84+
- Cloudflare global CDN enabled
85+
- Worker deployment in all Cloudflare edge locations
86+
87+
### **📈 Performance Benefits**
88+
- **Global Edge**: Deployed to 200+ locations worldwide
89+
- **SSL/TLS**: Automatic HTTPS with Cloudflare certificates
90+
- **Caching**: Static assets cached at edge
91+
- **Speed**: Sub-100ms response times globally
92+
93+
## 🛠️ **Configuration Details**
94+
95+
### **Current wrangler.toml**
96+
```toml
97+
name = "ocpp-chaos-simulator"
98+
main = "_worker.js"
99+
compatibility_date = "2024-01-15"
100+
101+
[build]
102+
command = "npx @cloudflare/next-on-pages"
103+
104+
[env.production]
105+
compatibility_flags = ["nodejs_compat"]
106+
107+
[[env.production.routes]]
108+
pattern = "ocpp.sankalpnarula.com/*"
109+
zone_name = "sankalpnarula.com"
110+
```
111+
112+
### **GitHub Actions Integration**
113+
Your deployment summary will show:
114+
```
115+
✅ Frontend (Cloudflare Workers)
116+
- Status: Deployed successfully
117+
- Platform: Cloudflare Workers
118+
- Domain: https://ocpp.sankalpnarula.com
119+
```
120+
121+
## 🔍 **Verification Steps**
122+
123+
### **1. DNS Propagation**
124+
```bash
125+
# Check DNS resolution
126+
dig ocpp.sankalpnarula.com
127+
128+
# Expected: CNAME record pointing to Cloudflare Workers
129+
```
130+
131+
### **2. SSL Certificate**
132+
```bash
133+
# Check SSL certificate
134+
curl -I https://ocpp.sankalpnarula.com
135+
136+
# Expected: HTTP/2 200 with Cloudflare SSL
137+
```
138+
139+
### **3. Worker Response**
140+
```bash
141+
# Test the application
142+
curl https://ocpp.sankalpnarula.com
143+
144+
# Expected: Your Next.js application HTML
145+
```
146+
147+
## 🎯 **Next Steps After Deployment**
148+
149+
1. **✅ Push to main** → Triggers automatic deployment
150+
2. **🔍 Verify domain** → Check `https://ocpp.sankalpnarula.com`
151+
3. **📊 Monitor performance** → Cloudflare Analytics
152+
4. **🔧 Configure features** → Add environment variables if needed
153+
154+
## 🚨 **Troubleshooting**
155+
156+
### **Domain Not Working?**
157+
1. Check DNS propagation: `dig ocpp.sankalpnarula.com`
158+
2. Verify Cloudflare proxy is enabled (🧡)
159+
3. Check Workers deployment status in dashboard
160+
161+
### **SSL Issues?**
162+
1. Ensure domain is proxied through Cloudflare
163+
2. Check SSL/TLS encryption mode is "Full (strict)"
164+
3. Wait 10-15 minutes for certificate provisioning
165+
166+
### **Deployment Failures?**
167+
1. Verify `CLOUDFLARE_API_TOKEN` has Workers:Edit permissions
168+
2. Check `CLOUDFLARE_ACCOUNT_ID` is correct
169+
3. Ensure domain is added to your Cloudflare account
170+
171+
Your subdomain will be live at **`https://ocpp.sankalpnarula.com`** after the next deployment! 🚀

0 commit comments

Comments
 (0)