用GitHub来展示前端页面

2017-06-30  本文已影响0人  落雨飞尘

写在前面的话

正文:

我要说的是用github发布你的静态页面,由于好久没有上传项目了(嘻嘻,不怪我,怪2016),发现github改版好大,我发现连发布项目的具体有点点变化,所以打算写出来。废话不多说,废话永远太多。

步骤

其实利用github来展示前端静态页面的例子很多,比如各种插件、框架的demo演示地址都会这样做,那么下面我们就来实际操作一下,体验一把展示自己前端项目成果的乐趣。

1.安装git

如果你是mac用户,那么恭喜你mac自带git命令功能,你无须安装git。如果你是windows用户,你可以前往windows地址下载并安装。
2.上传代码

第一步:建立git仓库
cd到你的本地项目根目录下,执行git命令
git init

第二步:将项目的所有文件添加到仓库中
git add . 如果想添加某个特定的文件,只需把.换成特定的文件名即可

第三步:将add的文件commit到仓库
git commit -m "注释语句"

第四步:去github上创建自己的Repository,创建页面如下图所示:

点击下面的Create repository,就会进入到类似下面的一个页面,拿到创建的仓库的https地址,红箭头标示的就是


第五步:重点来了,将本地的仓库关联到github上
git remote add origin https://github.com/lizhijian520/test.git
后面的https链接地址换成你自己的仓库url地址,也就是上面红框中标出来的地址

第六步,也就是最后一步,上传代码到github远程仓库
git push -u origin master
执行完后,如果没有异常,等待执行完就上传成功了,中间可能会让你输入Username和Password,你只要输入github的账号和密码就行了。
然后最后打开github网站你的项目是不是上传成功


3.发布静态网页

代码上传成功之后就可以发布静态网页了,细心的童鞋应该已经看到我上传的代码在根目录就有一个html文件(默认要识别html)。

第一步:点击setting,如图所示,默认就好



把这些改动都保存后,然后查看你的页面展示地址,就可以看到你发布的项目啦,赶紧动手试一试吧!

上一篇 下一篇

猜你喜欢

热点阅读