Cloudflare पर Free में Full-Stack Project Deploy करें — Frontend, Backend, Database, Image Storage और Email Routing

1. Frontend Deploy करना — Cloudflare Pages

आपकी website या web app (React, Vue, Next.js, या plain HTML/CSS/JS) को host करने के लिए Cloudflare Pages इस्तेमाल होता है। इसमें आपको मिलता है:

Unlimited bandwidth (free tier पर भी)
Automatic builds जब आप GitHub/GitLab repo में push करते हैं
Global CDN के जरिए तेज़ loading speed
Free SSL certificate

बस अपना GitHub repository Cloudflare Pages से connect करें, build command और output folder set करें, और deploy पर क्लिक करें — कुछ ही मिनटों में आपकी site live हो जाती है।

2. Backend API Deploy करना — Cloudflare Workers

Backend API के लिए Cloudflare Workers एक serverless platform है, जो आपके code को दुनियाभर के edge locations पर चलाता है। Free tier में आपको हर दिन 1,00,000 requests मिलते हैं, जो ज्यादातर छोटे-मध्यम projects के लिए पर्याप्त हैं।

आप JavaScript, TypeScript या Rust (WASM) में API routes लिख सकते हैं, और `wrangler` CLI tool के जरिए एक ही command में deploy कर सकते हैं:

wrangler deploy

3. Database Setup — Cloudflare D1

Cloudflare D1 एक serverless SQL (SQLite-based) database है, जो सीधे आपके Workers के साथ integrate होता है। इसका free tier इतना generous है कि छोटे और मध्यम applications बिना किसी cost के आराम से चल सकते हैं।

Table बनाना, query चलाना और Workers से data fetch करना — सब कुछ बहुत सीधा है, और आपको अलग से कोई database server manage नहीं करना पड़ता।

4. Images और Files Store करना — Cloudflare R2

अगर आपके project में users images या files upload करते हैं, तो उसके लिए Cloudflare R2 object storage इस्तेमाल करें। यह Amazon S3 जैसा ही काम करता है, लेकिन सबसे बड़ी बात — R2 पर data transfer (egress) पर कोई charge नहीं लगता, जो इसे बाकी cloud providers से अलग बनाता है।

आप Workers के जरिए सीधे R2 bucket में images upload और retrieve कर सकते हैं, और चाहें तो एक custom domain के जरिए उन्हें publicly serve भी कर सकते हैं।

5. Subdomain Routing सेट करना

एक ही domain के नीचे अलग-अलग हिस्सों को organize करने के लिए subdomains बहुत काम आते हैं, जैसे:

app.yourdomain.com — Frontend (Pages)
api.yourdomain.com — Backend (Workers)
cdn.yourdomain.com — Images/Files (R2)

Cloudflare के DNS dashboard में जाकर आप हर subdomain के लिए एक CNAME या Worker route add कर सकते हैं, और कुछ ही मिनटों में पूरा setup तैयार हो जाता है — बिना किसी extra server या reverse proxy के।

6. Custom Email Routing — Cloudflare Email Routing

अपने domain पर professional email (जैसे contact@yourdomain.com) चाहिए, लेकिन paid email hosting नहीं लेना चाहते? Cloudflare Email Routing बिल्कुल free में यह सुविधा देता है। आप अपने domain पर आने वाले emails को अपने personal Gmail या किसी भी inbox पर forward कर सकते हैं, और चाहें तो Workers की मदद से emails को programmatically process भी कर सकते हैं (जैसे contact-form submissions या notifications भेजना)।

7. Secrets और Sensitive Values को Safe रखना

API keys, database credentials, tokens या कोई भी sensitive value कभी भी सीधे code में (hardcode करके) नहीं लिखनी चाहिए, वरना वो आपके GitHub repo या client-side bundle में expose हो सकती है। Cloudflare Workers इसके लिए एक secure तरीका देता है — Wrangler Secrets:

wrangler secret put API_KEY

यह command आपसे value मांगता है और उसे encrypted रूप में सीधे Cloudflare के पास store कर देता है — न वो आपके code में दिखती है, न repo में, न ही dashboard में plaintext में। Worker के अंदर आप इसे सिर्फ इस तरह access करते हैं:

export default {
  async fetch(request, env) {
    const key = env.API_KEY; // secret यहीं से मिलती है
    // ...
  }
}

कुछ ज़रूरी बातें ध्यान रखें:

Secrets को .env या wrangler.toml में plain text में कभी न रखें — wrangler.toml सिर्फ non-sensitive config values के लिए है, secrets के लिए नहीं।
Database connection strings, R2 access keys, third-party API tokens — सब कुछ wrangler secret put के जरिए ही add करें।
.env या किसी भी credentials file को हमेशा .gitignore में डालें, ताकि गलती से भी वो GitHub पर push न हो।
Frontend (Pages) में कभी भी secret keys न रखें — frontend का code browser में publicly visible होता है, इसलिए सारा sensitive काम Workers (backend) के through ही होना चाहिए।
अलग-अलग environments (development, staging, production) के लिए अलग secrets रखें, ताकि एक environment की leak दूसरी को प्रभावित न करे।

इस approach से आपकी credentials कहीं भी publicly expose नहीं होतीं, और पूरा project security best-practices के हिसाब से production-ready बनता है।

Cloudflare Architecture:

Cloudflare full-stack architecture diagram

Frontend → Cloudflare Pages
Backend API → Cloudflare Workers
Database → Cloudflare D1
Image/File Storage → Cloudflare R2
Subdomains → Cloudflare DNS + Routes
Email → Cloudflare Email Routing