No server? No备案? Step-by-step guide to deploying a personal website for free

Tavern
,
1

The server has expired, the recordal is too麻烦, and the domain name still needs to wait 20 days?
Don’t panic, this article teaches you how to deploy a website with GitHub + Cloudflare Pages without spending a penny, it’s easy with a little effort.

Part 1: First, understand the principle of serverless deployment?

In simple terms:

  • GitHub helps you store code (like a network disk)
  • Cloudflare Pages helps turn your code into a website (like a server)

Both are free, and Cloudflare comes with global CDN, which is faster than your old server.

The downside: You can only deploy static websites (HTML/CSS/JS), you can’t run PHP, Python backends.
But blogs, personal websites, document sites, and showcase pages are more than enough.

Part 2: Preparation

You need:

  1. A GitHub account (free registration)
  2. A Cloudflare account (free registration)
  3. A domain name (optional, use Cloudflare’s secondary domain if you don’t have one)
  4. A device that can access the internet (your phone is okay too)
  5. A brain (the most important, if you don’t have one, it’s better not to read further)

Yes, you can do it on your phone, you don’t need a computer.

Part 3: Step 1: Upload the code to GitHub

3.1 Create a repository

Open GitHub (github.com), log in, and click on the upper right corner + button → New repository.

Choose any name for the repository, such as my-blog, my-website, and make it public.

GitHub Create Repository

Why public? Because Cloudflare Pages free version can only read public repositories.
Don’t want to make it public? Pay for Pro or check the next article ‘Server-based deployment tutorial’.

3.2 Upload code

After creating the repository, you have several ways to upload code:

Method A: Upload directly on the web (the simplest, you can do it on your phone too)

  1. Go to the repository page, click “Add file” → “Upload files”
  2. Drag your website files (HTML, CSS, JS, images) into it
  3. Click “Commit changes”

Note: GitHub web version does not support uploading folders, you can only upload individual files.
If there are many files, it is recommended to package them into a ZIP file and upload, or… just check Method B.

Method B: Git command line (suitable for computer operation)

# Clone the repository to the local
git clone https://github.com/your_username/repository_name.git

# Copy your website files into it
cp -r your_website_files/* repository_name/

# Commit and push
cd repository_name
git add .
git commit -m "init: upload website"
git push origin main

Method C: Mobile Termux (advanced)

If you have Termux on your phone, you can directly execute Git commands on your phone, just like on a computer.

Don’t know how to use Termux? Just use Method A, click and drag on the web.

Part 4: Step 2: Connect Cloudflare Pages

4.1 Log in to Cloudflare

Open dash.cloudflare.com, log in to your account.

4.2 Create a Pages project

Find “Pages” in the left menu, click “Create project”.

Cloudflare Pages

Cloudflare Pages Deployment Interface

Select “Connect to Git”, then authorize Cloudflare to access your GitHub account.

4.3 Select repository

Find the repository you created just now in the list, click “Start setting”.

4.4 Configure build settings

There are two cases here:

Case A: Pure static website (only HTML/CSS/JS)

  • Framework preset: None
  • Build command: Leave blank
  • Output directory: Leave blank (or fill in .)

Case B: Website generated by a framework (such as Hexo, VitePress, Astro)

  • Framework preset: Select the corresponding framework
  • Build command: Fill in the framework’s build command (such as npm run build)
  • Output directory: Fill in the build output directory (such as dist, public)

If you use the Firefly template from my blog, select Astro for the framework preset, fill in npm run build for the build command, and fill in dist for the output directory.

4.5 Deployment

Click “Save and Deploy”, wait for 1-2 minutes, Cloudflare will automatically build and deploy your website.

After deployment, you will see a link similar to https://xxx.pages.dev, this is your website address.

Part 5: Step 3: Bind your own domain (optional)

Cloudflare’s pages.dev domain can be used, but if you want to use your own domain, such as www.yourname.top, you can follow the steps below.

5.1 Add domain in Cloudflare

  1. Go to your Pages project, click “Custom domain”
  2. Enter your domain, such as www.yourname.top
  3. Click “Continue”

5.2 Modify domain DNS

Cloudflare will prompt you to add a CNAME record.

Go to your domain name provider (such as Alibaba Cloud, Tencent Cloud, Namecheap), find the DNS resolution settings, and add a record:

Type Host Record Record Value
CNAME www Your pages.dev address

Wait for DNS to take effect (usually a few minutes to a few hours), and visit www.yourname.top to see your website.

Note: If the domain is not recorded, do not resolve to domestic servers, otherwise it will be blocked.
But resolving to Cloudflare Pages is no problem because the server is abroad.

Part 6: Step 4: Automatic update (one-time effort)

The best part is: in the future, you just need to push the code to GitHub and Cloudflare Pages will automatically rebuild and deploy your website.

git add .
git commit -m "update: changed the homepage"
git push origin main

After pushing, wait for 1-2 minutes, the website will automatically update, without manual upload, without FTP, without logging into the server.

Part 7: Common Questions

Q: What if I can’t access GitHub?

Use a VPN, or try using mobile data. GitHub is sometimes accessible and sometimes not in China, get used to it.

Q: Are there any limitations on the Cloudflare Pages free version?

There are, but they are enough: 500 builds per month, 100,000 requests per day. It’s more than enough for a personal blog.

Q: Can I deploy dynamic websites?

No, static websites only. If you need to run backends (PHP, Python, database), see the next article ‘Server-based deployment tutorial’.

Q: What if the website files are too large?

GitHub has a limit of 100MB per file, and the total size of the repository is recommended not to exceed 1GB. If there are many images, it is recommended to use an image bed (such as SM.MS, Imgur) to link and reference.

Conclusion

The core of this solution is one sentence: GitHub stores code, Cloudflare acts as a server, buy your own domain, the whole process costs nothing.

Target audience:

  • Students (no money to buy a server)
  • Personal blogs (no need for backend)
  • Project showcase pages (to show customers the effect)
  • Temporary sites (event pages, portfolio)

If you still don’t know how to do it after reading this, recommend copying and pasting my repository and modifying it for use, or… come back to ask me.

Next article preview: ‘How to deploy a website with a server? Baota/1Panel one-click website tutorial’

1 Like