The Ultimate Cloudflare Setup Guide for Beginners

By /

Most people’s very first interaction with Cloudflare happens when a web hosting tutorial tells them to “point your domain’s nameservers to Cloudflare.” You follow the steps, update your nameservers, confirm your site is up, and then log into the dashboard.

Suddenly, you’re greeted by a massive sidebar menu: Domains, Compute, AI, Storage & Databases, Application Security, Zero Trust. Every option sounds important, but you’re left wondering: Which of these do I actually need, and what can I ignore?

Quick Note: Throughout this walkthrough, we’ll use example.com as a placeholder. Just swap it out with your actual registered domain when following along.

1. What Can Cloudflare Actually Do for the Average User?

A common misconception is treating Cloudflare as merely a Content Delivery Network (CDN) that makes pages load a bit faster. While true, that’s only scratching the surface.

A more accurate way to look at Cloudflare is as a smart reverse proxy standing directly between your visitors and your origin server. Once your domain is routed through Cloudflare, every incoming HTTP/HTTPS request hits Cloudflare’s global edge network first. Cloudflare then decides the best course of action:

  • Serve cached static assets immediately from the edge.
  • Pass the request along to your VPS/origin server.
  • Block malicious scrapers and DDoS attacks in real time.
  • Execute lightweight serverless code on the fly.

Because of this architecture, Cloudflare’s capabilities fall into three primary layers:

  1. The Web Gateway (Core Tier): Handles DNS resolution, CDN caching, free SSL/TLS certificates, and fundamental Web Application Firewall (WAF) security. This is where 90% of users start.
  2. The Developer Platform: Features Workers and Pages for running serverless code, backed by R2 (object storage), KV (key-value storage), and D1 (SQL database). You can build and scale full-stack web applications without ever touching or paying for a traditional server.
  3. Agent & AI Infrastructure: Offers Workers AI to run open-source LLMs directly on the edge, specialized middleware to guide AI Agents, and dedicated CLI tools tailored for autonomous workflows.

The Best Part: The Free Tier Goes extremely Far

Every single feature covered in this guide is 100% free. For personal blogs, portfolio sites, documentation hubs, and indie developer tools, you will rarely—if ever—hit the upper bounds of Cloudflare’s free limits.

2. Onboarding Your Domain into Cloudflare

Step 1: Navigating the Dashboard

Once logged into the Cloudflare Dashboard, the left-hand sidebar acts as your master control center. Don’t let the sheer volume of options overwhelm you. Focus initially on these core sections:

  • Domains: Manage your onboarded domains, DNS records, SSL/TLS certificates, and site-level firewall rules.
  • Compute: Access Workers, Pages, and Email Routing.
  • AI: Access Workers AI models and AI-specific settings.
  • Storage & Databases: Access R2 Buckets, Workers KV, and D1 Databases.

Pro Tip: Cloudflare updates its dashboard UI frequently. If a menu item isn’t where you expect it to be, press ⌘ + K (or Ctrl + K on Windows) to bring up the global search bar. Searching by feature name is almost always faster than manually hunting through menus.

Step 2: Adding Your Domain

  1. Head over to Domains and click Add a Domain (or Onboard a Domain).
  2. Enter your apex domain (e.g., example.com). Do not include www here; subdomains are managed later via DNS records.
  3. Select the Free Plan when prompted.
  4. Cloudflare will automatically scan your existing DNS zone file.

Crucial Check: The automated scan is not always 100% exhaustive. Double-check that three main categories were pulled over correctly:

  • Your root domain (example.com) A/AAAA records.
  • Common subdomains (like www or blog).
  • Mail server records (MX, SPF, DKIM, DMARC).

If your MX or SPF records get dropped during this phase, your incoming and outgoing emails will instantly break the moment you switch nameservers!

Step 3: Updating Nameservers at Your Registrar

Cloudflare will provide you with two unique custom nameservers (e.g., ashton.ns.cloudflare.com). Log into your domain registrar (such as Namecheap, Spaceship, Porkbun, or GoDaddy) and replace your default nameservers with Cloudflare’s pair.

Safety Warning: Before updating nameservers, check if DNSSEC is currently enabled at your registrar. If it is, disable DNSSEC first. Migrating nameservers with an active, mismatched DNSSEC key can temporarily break your domain’s DNS resolution worldwide. You can easily re-enable DNSSEC directly inside Cloudflare after activation completes.

Step 4: Verification & Domain-Specific Settings

DNS propagation can take anywhere from a few minutes to a couple of hours. Cloudflare checks periodically in the background. Once active, your domain status will change to Active.

Clicking on your active domain reconfigures the left sidebar to display domain-specific controls. This is where you’ll manage DNS, SSL/TLS, Security, Email Routing, and AI Crawl Control.

3. Mastering DNS, Proxy Status (The Clouds), and HTTPS

1. Orange Cloud vs. Grey Cloud

When viewing DNS → Records, every A, AAAA, and CNAME record features a toggleable Proxy Status:

  • Proxied (Orange Cloud): Traffic routes through Cloudflare first before reaching your origin server. CDN caching, SSL encryption, WAF protection, and IP masking are fully active. Visitors never see your real server IP.
  • DNS Only (Grey Cloud): Cloudflare operates strictly as a standard DNS provider, resolving queries directly to your server’s IP address without filtering or caching traffic.

When to use Orange Cloud vs. Grey Cloud:

  • Orange Cloud: Web traffic (Root domain example.com, www, web apps).
  • Grey Cloud:
    • Subdomains mapped to SSH/SFTP access (e.g., ssh.example.com). Cloudflare’s proxy only forwards standard web ports; unproxied connections are required for raw SSH.
    • Subdomains dedicated to mail servers (e.g., mail.example.com).
    • Direct database or game server connections using non-HTTP ports.

Best Practice: Keep your public-facing web traffic on an Orange Cloud domain, and assign a separate, unproxied (Grey Cloud) subdomain exclusively for backend admin tasks like SSH.

2. Configuring SSL/TLS Encryption Modes

Navigate to SSL/TLS → Overview. This controls how traffic is encrypted between Cloudflare and your origin server (the client-to-Cloudflare link is encrypted automatically).

  • Automatic SSL/TLS (Recommended): Cloudflare probes your origin server and automatically selects the highest supported security level (typically Full (Strict)).
  • Full (Strict): Connects via HTTPS and enforces strict validation of a trusted, unexpired SSL certificate on your origin server. (Most secure).
  • Full: Connects via HTTPS but accepts self-signed or unverified certificates on your origin.
  • Flexible: Connects to your origin server via unencrypted HTTP.
  • Off: Disables encryption entirely. (Never use this).

Troubleshooting Tip: A classic mistake is choosing Flexible when your origin web server (e.g., Nginx, Apache, or Caddy) is configured to force-redirect HTTP to HTTPS. This creates an infinite ERR_TOO_MANY_REDIRECTS loop (Cloudflare talks to the server over HTTP, the server tells Cloudflare to switch to HTTPS, and repeat). Switching your mode to Full or Full (Strict) resolves this issue instantly.

3. Enforce Always Use HTTPS

Under SSL/TLS → Edge Certificates, toggle on Always Use HTTPS. This automatically redirects any incoming http:// visitors to secure https:// URLs at the edge before hitting your origin.

4. Deploying Static & Full-Stack Websites directly from GitHub

1. Modern Deployment Pipeline: Workers & Pages

Historically, hosting static sites on Cloudflare meant creating a project in Cloudflare Pages. Cloudflare has since unified this workflow directly under Workers: you simply connect a GitHub repository, configure build settings, and deploy as a Worker on their edge infrastructure.

Static asset requests served through this workflow remain completely free and unmetered.

2. Linking GitHub to Cloudflare

  1. Go to Compute → Workers and Pages and click Create.
  2. Select Import from GitHub.
  3. Authorize Cloudflare to access your GitHub account (you can grant access to all repos or restrict it to specific ones).
  4. Select your project repository and proceed.

3. Build & Deployment Settings

  • Project Name: Defines your fallback preview URL (project-name.subdomain.workers.dev).
  • Build Command: Leave blank for raw static HTML/CSS/JS projects. For static site generators (Astro, VitePress, Hugo, Next.js, etc.), enter your framework’s build command (e.g., npm run build).
  • Deployment Command: Defaults to npx wrangler deploy (leave as-is).

Click Save and Deploy. Cloudflare pulls your code, builds the static assets, distributes them across their global network, and assigns a default workers.dev staging domain. Every subsequent git push to your main branch triggers an automated CI/CD deployment.

4. Attaching a Custom Domain

Inside your deployment overview, switch to the Settings / Domains tab:

  1. Click Add Custom Domain.
  2. Type in your subdomain or root domain (e.g., blog.example.com).
  3. Since your domain is already hosted on Cloudflare DNS, Cloudflare handles CNAME record creation behind the scenes automatically.

5. Setting Up Free Custom Domain Email Forwarding

Having an address like contact@example.com looks professional, but managing a dedicated email server or paying for Workspace handles can be expensive. Cloudflare Email Routing solves this by accepting incoming mail for your domain and seamlessly forwarding it to your personal inbox (Gmail, Outlook, iCloud, etc.).

Step-by-Step Configuration

  1. Go to Compute → Email Services → Email Routing.
  2. Click Enable Email Routing / Onboard Domain. Cloudflare will automatically add the required MX, SPF (v=spf1 include:_spf.mx.cloudflare.net ~all), and DKIM records to your DNS settings.
  3. Add a Destination Address: Under the Destination addresses tab, add your real personal email address (e.g., myemail@gmail.com). Cloudflare will send a verification link. Click it to verify ownership.
  4. Create Routing Rules: Under Routing rules, create custom routing shortcuts:
    • Custom Address: hi@example.com
    • Action: Send to myemail@gmail.com
  5. (Optional) Enable the Catch-All rule to forward any unrecognized address sent to your domain directly to your inbox.

6. Zero-Egress Cloud Storage with Cloudflare R2

Why R2 Over Amazon S3?

Cloudflare R2 is an S3-compatible object storage system designed for storing images, media assets, backups, and raw files.

Its primary selling point is simple: Zero Egress Fees. Traditional cloud providers like AWS charge steep bandwidth fees every time a user downloads a file. R2 charges $0 for outgoing bandwidth.

The Free Tier Allowance:

  • 10 GB per month of standard storage.
  • 1,000,000 Class A operations (writes, lists, uploads).
  • 10,000,000 Class B operations (reads, file downloads).

Creating and Customizing an R2 Bucket

  1. Navigate to Storage and Databases → R2 Object Storage and click Create Bucket.
  2. Choose a permanent bucket name (e.g., media-assets). Leave location set to Automatic and Default Storage Class set to Standard.
  3. Enable Public Access: By default, buckets are locked. To serve images on your site, open your bucket’s Settings tab:
    • Connect Custom Domain: Click Add Custom Domain and assign an unallocated subdomain like img.example.com. Cloudflare configures the DNS routing automatically.
    • Public R2.dev URL: You can enable the fallback r2.dev URL for rapid testing, but avoid using it in production as it enforces strict rate limits.

Now, any image uploaded to your bucket can be referenced anywhere on the web via [https://img.example.com/your-image.jpg](https://img.example.com/your-image.jpg).

7. Securing Your Site Against Unwanted Traffic & AI Scrapers

As AI web crawlers proliferation grows, unthrottled bots can consume significant server resources without delivering referral traffic. Cloudflare gives site owners full transparency and control over AI bot activity.

1. Auditing Bot Traffic via AI Crawl Control

Under your domain’s dashboard, navigate to AI Crawl Control. This panel breaks down automated requests hitting your site, categorizing bots by operator (e.g., OpenAI, Anthropic, Common Crawl, ByteDance, Google).

You can see precisely how many requests were allowed versus blocked, as well as bot-driven 404 attempts.

2. Fine-Tuning Security Rules

Inside the Security sub-tab under AI Crawl Control:

  • Allow: Permit specific crawlers if they drive valuable traffic or search indexation (e.g., search engine bots).
  • Block: Deny automated agents from harvesting your content. You can configured blocks to issue an HTTP 403 Forbidden or a 402 Payment Required header.

3. Deploying the “AI Labyrinth”

To disrupt rogue scrapers that ignore standard robots.txt directives, enable Cloudflare’s AI Labyrinth feature under Security → Settings:

  • How It Works: AI Labyrinth injects invisible nofollow links into your site’s HTML that are completely hidden from human visitors. When non-compliant automated bots blindly follow these links, they get redirected into dynamically generated, endless AI-generated decoy paths—effectively stalling their scraping pipelines without disrupting legitimate user traffic.

Final Thoughts

Cloudflare has evolved far beyond a basic DNS utility or CDN layer. By taking advantage of its unified platform—routing DNS through its proxy, deploying static applications via Workers, forwarding email natively, hosting media assets on R2, and applying AI-driven firewall controls—you can run a highly performant, secure, and modern web presence at zero cost.

Related Posts

0 Comments
Scroll to Top