:-: 如何在github上展示作品——为你的项目生成一个快速访问的网址
原文链接地址:http://www.cnblogs.com/DaisyWang/p/5468761.html
(这里值针对Windos系统的,因为本人用的是Window系统,暂时没有条件在其他平台上测试)
1.创建命名为 <userName>.github.io的仓库。
这里的userName为用户名,一般是你注册时的用户名。比如个人主页的网址是https://github.com/DaisyWang88。那这里的userName就是DaisyWang88。
![](https://box.kancloud.cn/f5ab5abf4331a993bf7c4fdb18a4f1c2_708x545.png)
2.将DaisyWang88.github.io这个仓库生成静态网页。
![](https://box.kancloud.cn/92ebba180e5dafba6ca6955892fbee4c_1094x584.png)
进入DaisyWang88.github.io,点击设置按钮“Settings”。
往下拉,如图会看到"Launch automatic page generator"这个按钮。这是给你的DaisyWang88.github.io生成一个静态网页。
![](https://box.kancloud.cn/43231d7a34e9bc90c1ebcd727f1e9819_752x570.png)
填写“Page name”和“Tagline”根据自己的喜好填写。
![](https://box.kancloud.cn/e4794674eec7657be09bee1b702b65c1_1091x605.png)
往下拉, 点击“Continue to layouts”
![](https://box.kancloud.cn/e43fc05d7c37b0846fc74e4cda5455b2_1050x274.png)
跳转到新的页面之后,点击“Publish page”,主题什么的的无所谓。现在就可以通过username.github.io(这里是DaisyWang88.github.io)访问了,但只能看到主题的效果。如下图给的主题效果。
![](https://box.kancloud.cn/45a63c44542b3b13b9b7392103163446_1092x575.png)
而且DaisyWang88.github.io这个仓库里会多出,主题的html、css、json等 代码。而且从index.html文件开始运行。如果要用来展示自己写的网页或者作品,就需要替换或者改写这些代码了。
3.clone 远程代码库到本地,写自己的网页。
怎么clone简单说一下步骤:进入你想存放本地版本库的文件夹(我这里是e://gitHub文件夹)下面——单击右键进入Git Bash(前提是要安装Git Bash并完成相关配置)——输入clone命令
>[info] git clone git@github.com:DaisyWang88/DaisyWang88.github.io
Ok!搞定
(这里可以参考https://segmentfault.com/a/1190000000738398,Git Bash的安装及配置,还有github具体的一些操作及git命令可以参考http://my.oschina.net/bxxfighting/blog/378196?fromerr=fdYQv17q写得比较详细。
我这里给DaisyWang88.github.io的本地仓库添加一个自己写的index.html(注意这里必须是index.html,默认是从这个开始执行的)文件,add——commit——push之后,就可以访问自己写的网页了。在地址栏输入:DaisyWang88.github.io或者daisywang88.github.io或者http://daisywang88.github.io,就可以访问自己写的网页了。可以放上自己的作品在这里。
我这里的index.html是一个自己写的效果,如图:
![](https://box.kancloud.cn/54b43dfc6e3e29fef9decd8d9a1743e0_1920x1048.png)
加载完毕的效果如图:
![](https://box.kancloud.cn/990c94f0c059523f70f4c2cb28088013_1575x619.png)
- 1. KanCloud快捷键
- algate.github.io的网站建设
- algate.github.io基础完善
- 如何在github上展示作品——为你的项目生成一个快速访问的网址
- Github README.md 添加图片
- git上传github常用命令
- WEB开发文档
- 工具相关文档说明
- GulpJs开发文档
- 安装Gulp详细教程
- 如何上传到github
- 服务端相关文档
- tomcat配置多域名多端口访问
- Vue遇到的那些大坑
- vue-bulid新建问题解决方案
- vue-prev功能实现方案优劣(element)
- 常用组件使用和功能实现
- 1-文件上传功能
- 2-select插件实现利弊
- 3-实现分步骤流程效果
- ES6-export与export default遇到的坑
- require.context()-route去中心化管理
- webpack.ensure(webpack代码分割)
- angular爬-跪着也要爬完
- 新建遇到的问题
- 常用angular核心知识
- React初生牛犊不怕虎
- react初次见面之泥坑深谭
- react+webpack+es6精简版HelloWorld
- create-react-app创建失败
- create-react-app不归路
- react用到的组件module
- react-hot-loader
- JavaScript成长之路
- Js进阶
- Js模块化编程:require.js的用法
- 浅谈前端架构
- Js常见问题汇总
- 浏览器渲染原理及解剖浏览器内部工作原理
- 雅虎前端优化的35条军规
- 常见问题描述-面试常问
- 前端性能优化-algate
- http状态码详解
- 作用域,闭包,面向对象
- Js基础知识
- Js基本功必须扎实
- 各个浏览器加载icon
- html特殊标签和属性的说明
- 个人资源总结
- 个人简历-绝对真实有效
- Jekyll博客创建
- Jekyll开始创建
- Jekyll文档说明
- jekyll-paginate分页问题
- HEXO博客创建
- es6新用法解析以及使用
- 神奇的三个点:...
- 几大类
- coding创建hexo
- sublime相关配置
- Atom使用