coding中预览html,通过 Coding 实现 Axure 原型托管 ， WebIDE实现在线预览

注册 Coding 账号这步就省略了...接下来步入正题~

登录 Coding，新建一个项目...

码市新建项目

名称，项目描述，下面启用 README.md 可随意勾选，点击创建 PS ：我还是不勾选了，后面要初始化项目自己也会加的；

新建项目信息页面

页面会自动加载到创建的项目里面，如我创建的项目 111 ， 点击左侧导航代码

项目管理页面.png

呐，点击这里快速初始化仓库，前面没勾选 README.md 现在勾选就能创建啦~

代码初始页面.png

代码页面点击初始化仓库页面.png

创建在右侧，仔细看。

创建成功后，我们开启 Pages 服务

开启Pages服务.png

好的，开启成功，我们在分支里面新建一个一个分支， coding-pages

这个你们可以看看原作者的文章：通过 Coding 托管 Axure HTML 文件：LooMo

新建项目分支.png

新建页面.png

设置为默认分支

设置默认分支.png

使用 SourceTree配置，选择从 URL 克隆

Paste_Image.png

SourceTree 的用法就不细述了，总之，将你本地的原型通过 SourceTree同步后能上传原型到你的项目中如下。。。额，刚发现，不会 SourceTree 的同学，你可以直接进入你创建的分支，将文件夹拖入上传即可。。。

![Uploading Paste_Image_302338.png . . .]

![Upload Paste_Image.png failed. Please try again.]

![Uploading Paste_Image_302338.png . . .]

注册 Coding 账号这步就省略了...接下来步入正题~

登录 Coding，新建一个项目...

码市新建项目

名称，项目描述，下面启用 README.md 可随意勾选，点击创建 PS ：我还是不勾选了，后面要初始化项目自己也会加的；

新建项目信息页面

页面会自动加载到创建的项目里面，如我创建的项目 111 ， 点击左侧导航代码

项目管理页面.png

呐，点击这里快速初始化仓库，前面没勾选 README.md 现在勾选就能创建啦~

代码初始页面.png

代码页面点击初始化仓库页面.png

创建在右侧，仔细看。

创建成功后，我们开启 Pages 服务

开启Pages服务.png

好的，开启成功，我们在分支里面新建一个一个分支， coding-pages

这个你们可以来自原作者：[LooMo ]

新建项目分支.png

新建页面.png

设置为默认分支

设置默认分支.png

使用 SourceTree配置，选择从 URL 克隆

配置 SourceTree.png

SourceTree 的用法就不细述了，总之，将你本地的原型通过 SourceTree同步后能上传原型到你的项目中如下。。。额，刚发现，不会 SourceTree 的同学，你可以直接进入你创建的分支，将文件夹拖入上传即可。。。

进入分支.png

上传文件.png

将你的原型拖进来即可

拖入你的原型.png

写一个说明再提交...

说明 和 提交

这样原型就上传成功了 (PS：用 SourceTree 就不要每次这么麻烦的传了)

上传成功后.png

但是到目前为止，这都是代码，怎么看图形界面呢，这就需要 WEBIDE 来协助了...

点击进入 IDE.png

直接新建一个工作空间，登录就能用的...

新建工作空间.png

点击同步仓库， WEBIDE 会自动同步你在码市创建的项目，就我们刚刚创建项目的辣个网站

同步仓库

呐，过来了

同步后

点击这个项目，根据需求创建一个运行的服务器(PS:个人用就最低级别就好，第一次创建收 0.01 码币，我现在每次建最少话 0.02 码币，就忘了让你们看清楚点。。心疼ing ... ，获取码币方式在里面会有介绍，我简要说：手机绑定送 0.1 ，身份信息完善送 0.1 ，过生日送 0.1 ，app 首次登陆送 0.1 等方式)

创建服务器.png

点击查看项目

工作空间列表.png

找到文件夹的 index.html 文件

查看1.png

查看2.png

呐，是代码，点击小眼睛

查看3.png

点击新窗口打开页面

点击打开新页面.png

复制网址给你们程序锅锅就行了(PS：要保持服务器运行才能看哦，一直运行的话会消耗你们的码币，，么么哒)

完结.png

那就这样吧~