用GitHub来展示前端页面

写在前面的话

  • 首先对大家说的是博主没有更新啊,对不起大家了!
    在前一年也就是2016年,博主还是小鲜肉一枚,所以遇到点困难就老是犯迷糊,也许是少年不识愁滋味吧。我写了前一篇文章就写过我的2016,我的2016是各种不顺利,各种鸡贼了,上一篇博文就是对我的2016告别吧,哎,真是我的记忆年,我想这辈子,这一年是永远也不会忘记吧。算了,牢骚就发到这里吧,说半天也不知云云,呵呵,这就是我的2016状态吧,毕竟人还要生活,所有忧愁所有烦恼到此结束了,不管有没有结束,我都要开启我的2017,我的2017加油,加油,再加油!

正文:

我要说的是用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,如图所示,默认就好



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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容