利用 github 搭建静态网站


一直用 github 写博客文章,着实少了点乐趣,其实我们也可以利用 github 部署网站,话不多说,整理笔记如下:

初学者 链接:https://pan.baidu.com/s/1cevTGa 密码:c332

1. 登录个人界面

注册 GitHub 账号,完善用户信息后,进入个人界面。

个人主界面

2. 点击 Repositories

点击Repositories

Repositories 在 GitHub 上表示的是仓库,在 GitHub 上每个项目都存放在仓库里,一个仓库保存一个项目.

3. 点击 New 按钮

点击New

4. 创建仓库

根据图中的提示填写信息,信息填写完成后单击 Create respository 按钮创建仓库。

Create respository

5. 点击 Settings

创建好仓库后,会自动跳转到下图所示的界面,在界面中单击Settings.

点击 Settings

6. 创建网站主题

进入设置界面后一直往下,找到 GitHub Page ,并且单击GitHub Page模块中的 Choose a theme 按钮创建一个网站的主题。

Choose a theme

7. 选择 Cayman 主题,然后点击 select theme 按钮

Cayman theme

8. 点击 Commit changes 按钮

选择主题后,自动跳转页面,页面往下拉,找到 Commit changes,点击按钮。

Commit changes

9. 点击 Settings 按钮

单击Commit changes按钮后会自动跳转到我们创建的仓库界面,里面包含了仓库的各种信息,其中master表示这个仓库位于master分之上,进入界面后单击Settings按钮。

Settings

10. 在Settings界面中往下滑,滑到GitHub Page模块,可以看到GitHub Page模块中多了一个网址

网址

11. 打开网址,查看效果

在浏览器中打开网址后,可以看到网页上呈现出的内容就是我们刚刚创建的主题为Cayman的网页。

效果展示

12. 回到仓库界面

回到GitHub上,并且打开我们刚刚创建的那个仓库,仓库里的文件就是刚刚在浏览器中显示的内容,接下来要做的事情就是修改仓库里的文件,单击Clone or download按钮。

Clone or download

13. 单击复制到剪切板按钮,复制仓库的url

Clone or download

14. 创建一个文件夹

在电脑中创建一个文件夹(比如E盘,自己决定),用于保存从Github中克隆下来的仓库,我建的文件夹叫做Blog-love-static-website(好长,哈哈哈),进入此文件夹下。shift + 鼠标右键 打开命令窗口。

1

15. 克隆项目

在命令行中执行git clone https://github.com/HudadaHexiaolili/love-static-website.git命令

其中git clone 表示要克隆一个项目,后面的https://github.com/HudadaHexiaolili/love-static-website.git
表示项目地址,该地址是由第13步操作获得的,当在最后一行出现了100%表示,远程仓库已经成功的克隆到了本地

2

16. 查看文件

打开创建的文件,发现多了个 love-static-website 文件,该文件是刚刚在 GitHub 中创建的仓库

3

17. 打开文件,并且将需要上传到GitHub上的网站添加到该文件中

4

注意 你的首页文件名必须为 index.html

18. 执行下面命令

  1. 打开命令行,并且进入love-static-website文件夹下
    5
  2. git add -A //将文件添加到缓存区
    6
  3. git commit -m "first commit." //将文件提交到git中
    7
  4. git push origin master //将文件push到GitHub上的master分支上
    8

当出现上图所示的提示信息时,表示网站已经成功的提交到了GitHub上

19. 回到Github上的boyaa仓库,可以看到文件已经全部提交上来了

9

查看效果

激动人心的一刻来了,再次打开位于Settings下,GitHub Page模块中的网址,可以看到网页变成了我们修改后的页面
网站的网站:https://hudadahexiaolili.github.io/love-static-website/
通过观察网址可知,网址的格式为 https:// + GitHub的用户名 + .github.io/ + 仓库的名称

give you a hua

小结

方法很简单,还可以利用这种方法在github上创建自己的简历,性价比很高。

怎么写简历中的自我评价?
如何做一份优秀的简历?

当然也可以通过在线简历制作制作自己的简历,不过不如自己写的开心好像。