--- title: "Put it online for free with Cloudflare Pages" url: https://aiguideson.com/courses/build-a-website-with-ai/put-it-online-for-free/ course: "Build a website with AI and put it online" lesson: "5 of 5" minutes: 15 published: 2026-10-03 updated: 2026-10-03 author: "Jack Stovell" publisher: "Adapt Progress Evolve Limited" language: "en-GB" --- # Put it online for free with Cloudflare Pages Lesson 5 of 5 in [Build a website with AI and put it online](https://aiguideson.com/courses/build-a-website-with-ai/) · 15 minutes Your page works on your computer. Now you’ll put it on the internet with Cloudflare Pages, for free, by dragging your my-website folder into your browser. You’ll get a web address ending in .pages.dev that you can send to anyone. ## You need - Your my-website folder with your checked index.html in it (lesson 4) - An email address for a free Cloudflare account - Your phone, to check the page at the end A narrated walkthrough of this lesson is coming. The steps below cover everything in it. ## Steps ### Step 1: Check what’s in your folder Open your my-website folder. It should hold your index.html and nothing else you wouldn’t want strangers to see, because everything in the folder goes online. Keep the file name exactly as index.html. (Screenshot to come.) Checkpoint: Your my-website folder holds index.html and nothing private. ### Step 2: Make a free Cloudflare account Go to dash.cloudflare.com/sign-up. Enter your email address and a password, then select Create Account. Cloudflare then sends you an email to verify your address, so open it and do what it asks. ![Cloudflare’s "Create account" instructions: go to the sign-up page, enter your email and password, select Create Account. Below, a note that Cloudflare sends an email to verify your address.](https://aiguideson.com/courses/build-a-website-with-ai/l5-cf-create-account-docs.png) (screenshot captured 3 October 2026) 1. Go to the sign-up page 2. Enter an email and a password 3. Select Create Account Checkpoint: You’ve made a Cloudflare account and verified your email address. ### Step 3: Go to Workers & Pages Sign in to the Cloudflare dashboard at dash.cloudflare.com. Go to the Workers & Pages page. (Screenshot to come.) Checkpoint: You’re on the Workers & Pages page. ### Step 4: Choose drag and drop Select Create application, then Get started, then Drag and drop your files. These are the names Cloudflare’s instructions use. If your screen looks a bit different, look for the same words. ![Cloudflare’s Direct Upload instructions, open at "Deploy your project with drag and drop": four numbered steps, from going to Workers & Pages to selecting Deploy site.](https://aiguideson.com/courses/build-a-website-with-ai/l5-cf-drag-drop-docs.png) (screenshot captured 3 October 2026) 1. Go to Workers & Pages 2. Create application, Get started, Drag and drop your files 3. Name the project and drop your folder 4. Deploy site Checkpoint: You can see a box for a project name and an area to drop files into. ### Step 5: Name your project Type a name for your project, such as your business name with hyphens instead of spaces. The name becomes your web address: a project called brook-lane-bakes would be at brook-lane-bakes.pages.dev. Cloudflare’s instructions say that if a name is already taken, the address gets a few random characters added to it. (Screenshot to come.) Checkpoint: You’ve typed a project name you’re happy to see in your web address. ### Step 6: Drop your folder in and deploy Drag your my-website folder from your desktop into the upload area. A zip file of the folder works too. When the upload has finished, select Deploy site. In one place Cloudflare’s instructions call this button Save and Deploy, so look for either. Drag and drop takes up to 1,000 files of up to 25 MiB each, so one page is well within the limits. ![Cloudflare’s Direct Upload limits table: Wrangler takes 20,000 files and drag and drop takes 1,000 files, each up to 25 MiB.](https://aiguideson.com/courses/build-a-website-with-ai/l5-cf-limits-docs.png) (screenshot captured 3 October 2026) 1. Drag and drop: 1,000 files, 25 MiB each Checkpoint: Cloudflare says your site is deployed and shows an address ending in .pages.dev. ### Step 7: Open your page, then check it on your phone Open the address that ends in .pages.dev. Then type the same address into your phone’s browser. Check every section, try the menu links, and press the email button to make sure it opens an email to you. (Screenshot to come.) Checkpoint: Your page opens on your computer and your phone, and the email button works. ### Step 8: Share your link Copy the .pages.dev address and send it to someone you trust, and ask them to tell you anything that looks wrong. That’s it: your page is online. (Screenshot to come.) Checkpoint: Someone else has opened your page. ### Step 9: Change your page later To change your page, edit index.html on your computer and check it in your browser first. Then open your project in Workers & Pages, select Create a new deployment, choose production, and upload your folder again. There’s no need to start from scratch. ![Cloudflare’s instructions under "Create a new deployment": after creating the project, select Create a new deployment and choose production or preview.](https://aiguideson.com/courses/build-a-website-with-ai/l5-cf-new-deployment-docs.png) (screenshot captured 3 October 2026) 1. To change your page later: Create a new deployment Checkpoint: You know how to update the page without starting again. ### Step 10: Optional: use your own domain name This step is optional and costs money. If you own a domain name, open your project, select Custom domains, then Set up a domain, type your domain and select Continue. Cloudflare’s instructions say an address like www.yourname.co.uk needs a CNAME record at the company you bought the domain from, pointing to your .pages.dev address. A bare address like yourname.co.uk has to be added to your Cloudflare account and use Cloudflare’s nameservers. If you don’t have a domain yet, Cloudflare Registrar sells them at cost: a price tracker run by another company listed .co.uk at US$5.30 a year and .com at US$10.46 on 2026-10-03. Check the price at checkout. ![Cloudflare’s "Add a custom domain" instructions: select your Pages project, then Custom domains, then Set up a domain, then type the domain and select Continue.](https://aiguideson.com/courses/build-a-website-with-ai/l5-cf-custom-domain-docs.png) (screenshot captured 3 October 2026) 1. Your project, then Custom domains 2. Set up a domain 3. Type your domain, then Continue Checkpoint: Either you’re happy with your .pages.dev address, or your own domain is set up and shows your page. ## Common problems ### You can’t find Drag and drop your files Check you’re on the Workers & Pages page and have selected Create application. Cloudflare changes its dashboard from time to time; its Direct Upload guide always has the current steps. ### A file shows a red warning symbol after uploading Cloudflare shows this when a file is too large. You can’t swap the file in place: make it smaller and upload the whole folder again. ### Your address has random letters at the end Someone already has that project name, so Cloudflare added a few characters. It still works. If you’d rather have a different name, create a new project with another name. ### The email button opens the wrong address Fix it in index.html (lesson 4), check it in your browser, then upload again with Create a new deployment. Every Cloudflare dashboard screen sits behind a login, and the public sign-up page served our headless browser a bot check, so steps 3, 5 and 7 have no screenshot yet. Where a step has a screenshot, it is Cloudflare’s own instructions page, captured by tools/capture/build-a-website-with-ai.mjs. We have not put Brook Lane Bakes online: it is a made-up business. ## Sources - [Cloudflare Docs: Create account](https://developers.cloudflare.com/fundamentals/account/create-account/) (checked 2026-10-03) - [Cloudflare Docs: Direct Upload (drag and drop)](https://developers.cloudflare.com/pages/get-started/direct-upload/) (checked 2026-10-03) - [Cloudflare Docs: Pages limits](https://developers.cloudflare.com/pages/platform/limits/) (checked 2026-10-03) - [Cloudflare Docs: Pages custom domains](https://developers.cloudflare.com/pages/configuration/custom-domains/) (checked 2026-10-03) - [Cloudflare Registrar](https://www.cloudflare.com/products/registrar/) (checked 2026-10-03) - [cfdomainpricing.com (third-party tracker of Cloudflare Registrar prices, by NameBeta; not Cloudflare)](https://cfdomainpricing.com/) (checked 2026-10-03)