Home data center series uses github+cloudflare pages to build a new home for www navigation page
This article was last updated 210 days ago. The information in it may have developed or changed. If it is invalid, please leave a message in the comment section.

Preface

After the blog was attacked, I started to feel anxious. Although Cloudflare resisted most of the attacks, there were still more than 200,000 attacks that hit my home data center. If there is one, there will be another. This time it was my blog, but I can’t say which one it will be next time (boring people who can attack even my small website may do other more boring things). So I thought about it. In addition to the applications that must be deployed in the home data center, such as WordPress, the registration website of World of Warcraft (which must be connected to the intranet database) and other applications deployed directly in Docker mode, the remaining static page type sites should all be transferred to free web hosting services, and the first to bear the brunt iswww.tangwudi.comThe corresponding navigation page.

The next question is where to move to. I originally wanted to use github pages directly, but first of all, github pages requires the repository to be public. Although I don’t have anything confidential, there is no need to make it public. Secondly, even if I use github pages to build the website, I still have to usewww.tangwudi.comIf I want to connect cloudflare to an independent domain name, I might as well use cloudflare pages to associate with github's warehouse (and the warehouse can be set to private) to set it up. And the CI/CD when cloudlflare pages is associated with github warehouse as the source is also very smooth. After modifying the page locally, committing and pushing it to the corresponding warehouse on github, cloudflare can start deployment in a few seconds, and the changes can be completed in a few minutes. Isn't this great?

So it was finally decided to just use GitHub as the repository for version management of the website pages, and the website was deployed on cloudflare pages.

Upload the website files to the corresponding repository on GitHub

First, create a repository on GitHub to store the www website files:

image.png

Next, let's look at everyone's environment. If there is no graphical interface, you can use git related commands in the terminal. You also need to configure SSH, etc., which is more troublesome. Because I am on a macmini, I directly use the Mac version of github desktop.
First, clone the newly created www repository to a local folder:

image.png

Copy the website-related files directly into the directory above, and then click "Commit to main" and "Publish branch" in turn as shown in the figure below:
image.png

After Publish is successful, you can see the website files in the code of the corresponding repository on GitHub:
image.png

Deploy a website using cloudflare pages

Associate your GitHub account and select the repository corresponding to the website

In "Workers and Pages" - "Overview" - "Create Application":

image.png

image.png

image.png

image.png

image.png

Build and deploy

image.png

image.png

Not finished yet, continue:
image.png

At this point, you can actually access it through the automatically assigned third-level domain name "xxx.pages.dev", but I need to access it directly using www.tangwudi.com, so it's not over yet, continue:

image.png

image.png

image.png

image.png

image.png

It's done, and the access speed is obviously faster than before (of course, this is also because I have never optimized the access to the www site before).

Afterword

In fact, the static functions provided by github pages and cloudflare pages are relatively simple, and are more suitable for the relatively simple needs of individual users. For web developers who need more comprehensive and professional peripheral supporting functions, Netlify and Vercel are more suitable, but for my entry-level needs, github pages and cloudflare pages are more than enough.

Also: The biggest limitation of cloudflare pages is that it can only be built 500 times per month. Well, I doubt I can use less than 5 times.

The content of the blog is original. Please indicate the source when reprinting! For more blog articles, you can go toSitemapUnderstand. The RSS address of the blog is:https://blog.tangwudi.com/feed, welcome to subscribe; if necessary, you can joinTelegram GroupDiscuss the problem together.
No Comments

Send Comment Edit Comment


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠(ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ°Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
Emoticons
Emoji
Little Dinosaur
flower!
Previous
Next
       
error:
en_US
Spring Festival
hapiness