github托管静态页_通过Github Pages在您自己的域上托管静态网站

郑乐池
2023-12-01

github托管静态页

by Taurus Omejia

由Taurus Omejia

通过Github Pages在您自己的域上托管静态网站 (Host your Static Website on your own Domain through Github Pages)

Did you know that Github will allow anyone to host their static webpages for free? The best part is that you can even use your own custom domain. Let’s do this!

您是否知道Github将允许任何人免费托管其静态网页? 最好的部分是,您甚至可以使用自己的自定义域。 我们开工吧!

步骤1:建立您的网站 (Step 1: Create your website)

If you already have a website, than you can move on to step 2.

如果您已经有一个网站,则可以继续执行步骤2。

If not then today is good day to start.

如果不是这样,那么今天是开始的好日子。

I suggest starting a blog. A blog is a great way to establish a more meaningful presence online. You can leverage it to build your own personal online brand.

我建议创建一个博客。 博客是在网上建立更有意义的存在的好方法。 您可以利用它来建立自己的个人在线品牌

Don’t know where to start? I got you covered. John Sommez of Simpleprogrammer.com has an excellent email course called: How To Build A Blog That Will Boost Your Career. It’s a great course that walks you through the process.

不知道从哪里开始? 我让你覆盖。 Simpleprogrammer.com的John Sommez 开设了一个非常出色的电子邮件课程,名为: 如何建立博客,以促进您的职业发展 。 这是一门很棒的课程,可以引导您完成整个过程。

So you decided to start a blog. Now what? There are many ways you could go, such as Wordpress, Tumblr, or even Blogger.

因此,您决定创建一个博客。 怎么办? 您可以采用多种方式,例如Wordpress,Tumblr甚至Blogger。

But that would defeat the purpose of this article. We want to use Github Pages to host a static page for free. So I recommend using a static blog generator.

但这将违反本文的目的。 我们想使用Github Pages免费托管静态页面。 因此,我建议使用静态博客生成器。

I personally use Jekyll for my blog. Buts there are many others out there. Here’s a list of some of the more popular ones: Static Blog Generators. Choose one, read the instructions, and get your blog set up!

我个人将Jekyll用于我的博客。 但是,还有很多其他人。 以下是一些比较流行的列表: 静态博客生成器 。 选择一个,阅读说明,然后建立您的博客!

步骤2:将您的网站添加到Git版本控制 (Step 2: Add your site to Git Version Control)

Great you made it to step 2. Now that your blog is ready, let’s put it under version control using Git. This Article assumes you have Git installed, you have a github account and can push to it.

太好了,您进入了步骤2。现在您的博客已经准备就绪,让我们使用Git将其置于版本控制之下。 本文假设您已经安装了Git ,并且拥有github帐户并且可以推送到它

  • This step is very important: create a simple .txt file and name it “CNAME”. Open the file and type your custom domain name in it. Save it.

    此步骤非常重要:创建一个简单的.txt文件并将其命名为“ CNAME”。 打开文件,然后在其中键入您的自定义域名。 保存。

OK! Crank up your terminal and navigate to the directory your site lives in. Its time to initialize version control by entering the command.

好! 启动您的终端并导航到站点所在的目录。输入命令初始化版本控制的时间到了。

$ git init

Now to add the entire project under git tracking. Enter:

现在,在git跟踪下添加整个项目。 输入:

$ git add .

Let’s commit it:

让我们提交:

$ git commit -m “first commit”

Your site is now under version control. Now the fun begins.

您的网站现在处于版本控制之下。 现在,乐趣开始了。

步骤3:将您的网站推送到Github (Step 3: Push your site to Github)

We are finally ready to push to GitHub and see our site automatically running live online for free!

我们终于准备好推送到GitHub,并看到我们的网站自动免费在线实时运行!

  1. Launch github.com and sign in.

    启动github.com并登录。

  2. On your home page click the big green button that says “+ New repository.”

    在您的主页上,单击绿色大按钮,上面显示“ +新存储库”。
  3. For your page to automatically be hosted, you must follow a specific naming convention. Name your repository “[your-username].github.io”, leave everything else as is, and press “Create Repository”.

    为了自动托管页面,您必须遵循特定的命名约定。 将您的存储库命名为“ [您的用户名] .github.io”,将其他所有内容保持不变,然后按“创建存储库”。

Now follow GitHub’s instruction to push your blog to your new repository.

现在按照GitHub的指示将您的博客推送到新的存储库。

That’s it! Your new page should be up at http://your-username.github.io.

而已! 您的新页面应该位于http://your-username.github.io。

If you don’t see it right away, give it a few minutes, ten at the most.

如果您看不到它,请花几分钟,最多十分钟。

That’s it! For most people this is all you need to do. However for those of you that would like to use your own custom domain continue to the final step.

而已! 对于大多数人来说,这就是您需要做的。 但是,对于那些想要使用自己的自定义域的人,请继续执行最后一步。

步骤4:将自定义域分配给新的GitHub页面网站 (Step 4: Assign your custom domain to your new GitHub pages website)

This will vary depending where you registered your domain. I have GoDaddy, so these instructions are specific to that. But the steps should be similar with other domain providers. Here is how I did it:

这取决于您注册域的位置。 我有GoDaddy,因此这些说明专门针对此。 但是步骤应与其他域提供程序相似。 这是我的做法:

  1. I signed into my GoDaddy account and selected “manage domains”. I selected the domain I wanted to use and clicked “Manage Connection”.

    我登录了GoDaddy帐户并选择了“管理域”。 我选择了要使用的域,然后单击“管理连接”。
  2. On the “Domain Details” page I clicked the “DNS ZONE FILE” tab.

    在“域详细信息”页面上,我单击了“ DNS区域文件”选项卡。
  3. Edit “A-Host” and point it to 192.30.252.153

    编辑“ A-Host”并将其指向192.30.252.153
  4. Now edit the www potion of “CName (Alias)” and point it to [your-username].github.io.

    现在,编辑“ CName(Alias)”的www部分,并将其指向[your-username] .github.io。
  5. Make sure to save everything. Once you save this, it could take up to an hour to update completely.

    确保保存所有内容。 保存后,最多可能需要一个小时才能完全更新。
  6. Now “[your-custom-domain].com” should point to [your-username].github.io. But what if your user types “www.[your-custom-domain].com” instead? Let’s fix it so that the www subdomain will point to [your-username].github.io as well.

    现在,“ [您的自定义域] .com”应指向[您的用户名] .github.io。 但是,如果您的用户键入“ www。[您的自定义域名] .com”,该怎么办? 让我们对其进行修复,以使www子域也指向[您的用户名] .github.io。
  7. Select your domain and press “Manage Connections”, then select the “Settings” tab.

    选择您的域,然后按“管理连接”,然后选择“设置”选项卡。
  8. Under Forwarding -> Domain, click “manage”.

    在转发->域下,单击“管理”。
  9. Click on “Update Forwarding”.

    点击“更新转发”。
  10. In “Forward to:” type www.[your-custom-domain].com

    在“转发至:”中,输入www。[your-custom-domain] .com
  11. Make sure 301 (Permanent) is selected, then save your work.

    确保选择了301(永久),然后保存您的工作。
  12. That’s it. Allow it about 1 hour for everything to update.

    而已。 等待约1个小时,以更新所有内容。

Let me be the first to congratulate you. You have a website up and running, under version control, with your own domain name — all hosted free of charge!

让我成为第一个祝贺您的人。 您拥有一个拥有自己域名的,受版本控制的网站,并且可以免费运行所有网站!

Originally published at www.tauruso.com. To view this article in all its glory and more from Taurus Omejia, go HERE!

最初发布在www.tauruso.com。 要浏览Taurus Omejia的所有文章以及更多内容 ,请点击这里!

翻译自: https://www.freecodecamp.org/news/hosting-custom-domain-on-github-pages-8c598248d2bc/

github托管静态页

 类似资料: