I often see great gods using github to show demo cases, and I have always been confused about how they did it. When I was reading the blog today, I found an article " Use github to display your front-end pages ", which introduces in detail how to use github to display your front-end pages. The author of this article has a lot of articles about front-end in the blog garden, which are very good and worthy of attention.
There are not a few people who know github, but most people probably only know that it can be used to manage our project code, but they don't know that it can also be used to display our front-end static pages
step
In fact, there are many examples of using github to display front-end static pages, such as the demo addresses of various plug-ins and frameworks.
2. Build a warehouse
On your github homepage, we can click "New repository" under the plus button in the upper right corner to create a new project repository, as shown in the figure:
After clicking, we give the warehouse a name and describe and configure it accordingly, and then click "Create repository" and it's ok.
3. Upload the code
After the repository is established, we need to use the git command we installed earlier to push the local code to github. If you only want to show your own front-end page, then you only need to master the following commands (for those who are not familiar with git commands, you can refer to git - Simple Guide ):
(1) Clone a remote repository to your local computer
git clone .... 
Copy this URL and fill in git clone https://...
(2) Open your directory
cd jq-demo(2) Initialize the repository for generating .git files
git init
(3) Add all files to the cache
git add *
(4) Submit the modified content of the current workspace
git commit -m "first commit"
(5) Connect the warehouse to the remote server
git remote add origin <server>
(6) Push the changes to the added server
git push -u origin master
4. Create gh-pages branch
之前的工作只是将我们的代码发布到了github上jq-demo仓库的master分支上，当然你也可以不发布，而我们的展示页面代码必须发布到名为“gh-pages”的分支上。方法很简单，我们只需要在github的jq-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分支，里面的代码文件就可以用来展示页面了。
5.访问页面
创建并上传文件至gh-pages之后，我们就可以访问如下url来查看自己的demo了：
http://(user_name|org_name).github.io/repo_name这里我们的demo地址为：https://songyj-225.github.io/jq-demo, 最终页面如图：
这样我们便实现了利用github来展示前端静态页面的目标。
.