美文网首页杂杂的玩应儿
设计师如何通过GitHub创建演示地址?

设计师如何通过GitHub创建演示地址?

作者: 刘板栗 | 来源:发表于2017-02-17 22:59 被阅读72次

最开始是怎么想到要用GitHub的呢,其实我是要做交互和动画的演示来的,但是演示的页面呢只能在公司的网络环境下使用,Hype啥的不是可以导出代码么,就想的能不能把代码存到哪儿然后通过某个连接打开,到时候就可以随时得瑟了呀~

再重复一遍要求,就要能打开页面演示就行,自动导出的代码也别想着维护啥的,都乱的(前端小伙儿说的)

  • 要先有html不然后面的步骤没法操作啊,我这儿用的就的Hype自动导出的html;
  • 导出的时候文件夹里面一定要有 index.html
  • 用Axure会自己导出index,Hype导出的文件名要写index才行,导出之后再将文件夹的名称改成项目名称。

注册

打开github.com,正常注册。

下载客户端

下载客户端

上传代码

1. 添加代码文件夹到客户端

Hype 或者其它可以导出 html 的动效软件导出的文件夹。


点击左上角的 ➕ ,用 Add 模式,** Choose** 选文件夹,确定。
第一次打开客户端里面有个First 项目,不用管或者删了没有影响。

添加完成的样子

2. 提交

Summary 里填点版本信息或关键字,再点击下面的 Commit to master 提交代码。
填完之后这一溜页面就合成了一个小卡。
Summary 其实是用来写版本说明之类的,我猜~

点击深灰色区域右上角的 Publish 发布 按钮。

![](https://img.haomeiwen.com/i4055792/692dba47a0642306.png?
![Uploading 5_019688.png . . .]
imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

GitHub的个人主页就有一个相同名称的项目了。

3. 创建演示页面

点粉色小圈里的 Add a new branch 创建分支按钮,名称输入 gh-pages
只能写 gh-pages,不能写其它的,固定格式就是这样。

点右上角的 Publish 一下。

然后在 GitHub.com 个人主页打开刚上传的项目,切换到 Settings 设置 标签。

往下翻会看到一条绿色提示,后面有个地址就是这个代码的演示地址啦。

如果没有出现这个地址,要检查一下分支的名称对不对,网站项目主页的 Code 标签下,Branch 里有没有 gt-pages 这支。

要是没有我目前的方法是删了重新按这个步骤走一下~

给你看我做的 演示GitHub代码页

有了这个地址可以随时查看演示页面了。


相关文章

网友评论

    本文标题:设计师如何通过GitHub创建演示地址?

    本文链接:https://www.haomeiwen.com/subject/tjjcwttx.html