如何用github来展示你的前端页面？

从开始学习前端的时候就在想如何可以把自己做的前端效果直接通过分享链接的方式展现给别人看就好了，之前一直以为必须要买域名，空间，还要会后台数据库什么什么的，还没开始就被吓到了，这段时间终于静下心来好好学习了，这才发现github还有这操作，真是相见恨晚呀，好啦废话就到这里，下面我们一起来看看如何用github来展示你的前端页面吧~

准备

1.注册github账号

2.安装git

3.常用 Git 命令

开始

1.建立仓库

在你的github主页，我们可以点击右上角的加号按钮下的“New repository”来新建一个项目仓库，如图所示：

2.上传代码

（1）打开你的目录

（2）初始化版本库，用于生成.git文件

git init

（3）将所有文件添加到缓存区

git add .

（4）提交当前工作空间的修改内容

git commit -m "first commit"

（5）将仓库连接到远程服务器

git remote add origin https://github.com/chentong95/shopping_cart.git

（6）将改动推送到所添加的服务器上

git push -u origin master

3.创建gh-pages分支

之前的工作只是将我们的代码发布到了github上demo仓库的master分支上，当然你也可以不发布，而我们的展示页面代码必须发布到名为“gh-pages”的分支上。方法很简单，我们只需要在github的demo项目页面手动创建gh-pages分支即可。如图：

输入gh-pages后创建即可，这样的方式会直接拷贝master分支的所有文件到gh-pages分支，而你也可以用命令行的形式创建并重新上传一份新的代码：

（1）新建并切换到gh-pages分支

git checkout --orphan gh-pages

（2）之后的操作和之前一样，只是push的时候是gh-pages

git add .

git commit -m "update"

git push -u origin gh-pages

如此，我们的demo项目就多了一个gh-pages分支，里面的代码文件就可以用来展示页面了。

4.访问页面

http://username.github.io/repo_name

此处我的url是

https://chentong95.github.io/demo/