利用Github Pages托管网页

【准备工作】

1.注册github账号;

2.下载安装github for windows(提示:下载完后会在桌面有两个快捷方式,一个是GitHub,一个是Git Shell。另外,除了github for windows,还能用其他的如Power Shell等);

3.查找参考资料进行总结:《Github上传代码菜鸟超详细教程》,《Github预览demo(by CarryGuan)》,《如何在Github Pages搭建自己写的页面?(by TristaLee)》;                 

4.生成并设置好SSH Keys(参考第3步第一篇资料); 

 

【准备完毕,进入正题】

1.登录后在github浏览器端新建一个仓库,用来待会存储要上传的代码。

  上图:

 

 注:Initialize this repository with a README 一栏 要勾选按照上图,该栏下方有官方解释,大概意思是,勾选了它,github就会自动为你在这个仓库生成一个README.md文件,作用是能让你把这个仓库的东西克隆到电脑里。

 

2.设置分支得到属于你仓库的github pages的网址

找到settings,点开:

 

找到GitHub Pages一栏,设置Source为master branch,Save。这是在部署github pages的分支。注意:这与旧版的点击“Launch automatic page generator”有所不同(在【准备工作】中第3步的第2篇资料中的就是旧版的,当时找了好久没找到,后来才知道原来是改版了。。。)

刷新页面后,发现在GitHub Pages一栏里多了一个网址,这就是你的github pages的网址,开心~:

3.打开Git Shell,clone刚才新建的仓库,也就是myRep到本地仓库

命令行为:

git clone https://github.com/jettyhuang/myRep.git

其中git clone后面的网址在点击clone or download按钮后弹出的下拉列表里找,其实就是刚才新建的仓库的网址后面加后缀.git:

 

 

执行情况如下:

clone 成功后,打开本地仓库默认路径,可以看到clone过来的仓库myRep(文件夹):

 

打开myRep,可以看到有一个README.md文件,就是刚才在github浏览器端新建myRep仓库是勾选的Initialize this repository with a README选项后建的文件:

 

 

4.在本地,把想上传的代码复制到刚才clone下来的本地仓库中:

5.回到Git Shell,执行以下命令行:

1 cd myRep  #切换到clone的仓库中
2 git init       #初始化本地仓库
3 git add .    #将本地所有文件加到仓库里
4 git commit -m "upload my code"  #设置提交信息
5 git remote add origin https://github.com/jettyhuang/myRep.git  #本地仓库链接远程仓库
6 git push -u origin master #push文件到仓库中

若执行“git remote add origin https://github.com/jettyhuang/myRep.git ”出现提示:“fatal:remote origin already exists.”,则执行以下命令行:

git remote rm origin

再重新执行“git remote add origin https://github.com/jettyhuang/myRep.git ”一遍就没问题了。往后执行下一条命令行。

若在执行“git push -u origin master”时,报错:"error:failed to push som refs to......."

则执行以下语句:

git pull origin master 

接着重新执行一次“git push -u origin master”。

先把远程服务器github上面的文件拉下来,再push 上去。

以上操作的执行情况:

 

然后可以去github浏览器端看看上传的代码了:

上传成功,开心!!

6.在浏览器上预览demo

   方法:打开浏览器输入刚才github分配给你的GitHub Pages的网址,加上你上传的 html 文件名,我的是login.html,按下回车后,就有效果了:

 

 噢耶,终于成功!!!

 

posted on 2017-02-11 16:57  jettyhuang  阅读(509)  评论(0编辑  收藏  举报

导航