So you've got your domain name and your hosting. Right now, it doesn't matter if your website is already online or not. The procedure is very similar either way.
Cloudflare is a reverse proxy server, which is a server that is a bridge between your visitors and your original web server. The goal of having a reverse proxy server is increasing speed, uptime, and security. You can more easily understand how a reverse proxy server works by looking at this simple graph:
Typically, requests from the users of the Internet go directly to the webserver. As you can see on the chart above, in case of using a proxy server, all requests will go through a middle-man. The user will never directly connect to the webserver. They will not even be able to know the origin IP of the website they are visiting. All requests will be handled by the reverse proxy, both ways. It sounds like it adds additional overhead, but actually, it has a ton of benefits.
Deliver dynamic and static content super-fast from Cloudflare edge servers. Over 200 data centers around the globe.
Once your website gets wildly popular and starts using massive resources, one server won't suffice. The next step is distributing your user's requests across a pool of servers, all managing requests for the same website. This is where a reverse proxy comes into play. It offers a load balancing solution that can spread the traffic cleverly between your origin servers and prevent any server from being overstressed. We're talking about websites that are getting millions of views daily. Typical niche site owners don't have to worry about this stuff.
Cloudflare's web application firewall (WAF) protects all its customers from dangerous attacks like XSS, forgeries, SQL injections, and more. The cool thing is that if an attack is performed against a single customer, the firewall learns about it for everyone's benefit.
One of Cloudflare's specialization is protection against distributed denial of services (DDoS) attacks. With a reverse proxy in place, you will never reveal your real origin server's IP to the attackers. Cloudflare implemented several smart tactics for detecting and mitigating DDoS attacks.
A reverse proxy is also able to cache static content, which results in better performance. DNS servers cache records for quicker lookups, CDN servers cache static content to lower latency, and web browsers cache HTML content, JS files, and pictures.
Have your https easy, free, and fast. No need to play around with Let's Encrypt or pay for certificates anymore. Computing encryption at the reverse proxy level also puts much less stress on your origin server.
Cloudflare supports advanced functions like script minification, file compression, and much more.
Cloudflare owns one of the fastest DNS networks in the world. The famous 220.127.116.11. Use it to your site's advantage.
Start by adding your site.
Select the free plan.
Cloudflare will now scan for existing DNS records. If your website is already up, Cloudflare will figure out the IP of your server and move what records it can see from your registrar down here.
If it's a new website, you will have to input all the records from scratch. Here's how Woodwaker's records look:
I modified my origin IP here because I don't want to reveal it publicly. The critical thing to notice here is your A records. Let's say your domain is "gearbest.com" and your server's address is 18.104.22.168. It will go like this:
Make sure your A records are proxied(orange cloud icon on) or all of this won't work.
Next, you'll have to replace the nameservers at your registrar with Cloudflare's nameservers. Login to your registrar and do it.
Once Cloudflare acknowledges the nameserver change, your website will be up.
The last crucial thing to do is set up your encryption correctly. Go to the SSL/TLS tab. Unless you know what you're doing, set SSL to "Full."
Always Use HTTPS: Off
Authenticated Origin Pulls: Off
Minimum TLS Version: TLS 1.0
Opportunistic Encryption: On
Onion Routing: On
TLS 1.3: Enabled
Automatic HTTPS Rewrites: On
Certificate Transparency Monitoring: Off
Rocket Loader: On (this speeds up your site a lot but might cause some troubles with poorly coded themes and plugins. Works excellent with GeneratePress.)
AMP Real URL: Off
Caching Level: Ignore query string
Browser Cache Expiration: 1 year
Always Online: On
Development Mode: Off
HTTP/3: Switch to this whenever possible.
IPv6 Compatibility: On
Pseudo IPv4: Off (unless your server doesn't support IPv6, but most do.)
IP Geolocation: On
Maximum Upload Size: 100MB