GithubPages教程 在GithubPages上搭建个人主页
2016-06-18 00:30
330 查看
GithubPages教程 在GithubPages上搭建个人主页
版权声明:转载请注明本文转自严振杰的博客: http://blog.csdn.net/yanzhenjie1003对我的博客感情趣的同学可以加我博客左侧的群来一起交流学习,共同进步。本篇博客公有三个目的,同样也会举三个实际操作的例子来和大家一起玩
Github pages。
第一个目的,有的开发者平常会做自己的网站,大部分是还是买的空间吧,有人买的阿里云、新浪SEA或者linode、aws加nginx,今天看完这篇博客,你就可以用
Github Pages免费搭建自己的主页了。
第二个目的,如何在Github为自己的帐号(个人或者组织)搭建个人主页,比如我的Github地址是:https://github.com/yanzhenjie,我为自己的帐号搭建的主页就是https://yanzhenjie.github.io。
第三个目的,如何为自己在Github上的开源项目搭建项目主页,比如我的开源项目NoHttp的Github地址是:https://github.com/yanzhenjie/NoHttp,我为NoHttp搭建的项目主页就是https://yanzhenjie.github.io/NoHttp。
(由于篇幅太长,如何为自己在Github上的开源项目搭建项目主页传送门。)
我的个人主页就放在
Github Pages并且绑定了我的域名:yanzhenjie.com,非常好记:严振杰.com,是不是一下就记住了,如果没有请再记一次,记不住就不要往下看了,哈哈哈开个玩笑啦。
Github Pages是什么
Github Pages主页:https://pages.github.com,其实官网这里已经有教程了,怕好多同学看不懂,所以来一篇博客。
Github Pages是什么,来自官网的解释:https://help.github.com/articles/what-are-github-pages,不想打开官网的人看图片:
不要夸我,我就是这么贴心,提大家翻译好了中文版:
按我的理解,Github Pages是Github免费提供给开发者的一款托管个人网站的产品,这绝对是个好东西啊。目前来看只能托管静态内容,但是这已经足够我们用了,如果咱发挥的好,犹如鲤鱼跃龙门啊。
Github Pages怎么玩
我刚开始做这事之前也不知道怎么办,我有个习惯就是对于不明白的事情习惯去官网看帮助,于是乎我看了Github Helper:https://help.github.com/,我看到这里的时候心中大喜,其实这就是教程,不够是英文版的,喜欢的同学也可以直接去看:我是一步步看过来的,为了不浪费大家时间,我们只要看这条就行:User, Organization, and Project Pages。这里我把最重要的信息贴出来:
看到这里我就基本猜到了要怎么做了,后面的就不一一带各位看了,我直接说原理。Github的个人主页是可以绑定一个域名的,后面带各位看官一步步实现。在没有绑定自己的域名之前,这里的地址都是有规律的,比如我的帐号是
yanzhenjie,那么我的主页地址就是
yanzhenjie.github.io,比如我的帐号是
xxoo,那么我的主页地址就是
xxoo.github.io;比如我的项目叫
NoHttp,那么项目对应的地址就是
yanzhenjie.github.io/NoHttp。如果你是组织帐号也一样。
用Github Pages为自己的帐号搭建个人主页
做这件事首先你得有一个Github的帐号,没有的人去Github申请一个吧,作为一个程序员我擦。如果你已经有一个Github的帐号了那么恭喜你继续往下看。新建个人主页的仓库
打开Github首页,登录后新建一个仓库,这里再次提醒要注意仓库的名称,比如我的帐号是yanzhenjie,那么仓库名称应该是:yanzhenjie.github.io。
按照如步骤创建仓库:
添加个人主页仓库内容
仓库创建完成后,就要添加网站内容到仓库咯。提交文件到github仓库,这里简单的介绍下用Git怎么提交内容,首先你电脑必须安装了Git并配置好了环境(看了还是不会的人去Google下)。如果熟练使用Git命令、TortoiseGit或者SourceTree的人请不要见怪,因为毕竟有人不会。
一、clone仓库到本地
注意你clone的时候要把连接换成你的喔。git clone https://github.com/yanzhenjie/NoHttp.git[/code]二、添加内容到本地仓库
刚才clone下来的仓库就是一个本地仓库啦,若是你熟悉html的话随便弄个html就好,我们知道网站默认的首页都是index.html,所以我们在本地仓库建立一个index.html,目录一定要在.git所在的目录,也就是我们项目的root目录:<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"/> <title>严振杰</title> </head> <body> 我叫严振杰,软件工程师,英文名Yolanda,尤兰达,他们叫我达哥。 </body> </html>
文件都建好内容填好保存,一个简单的首页就完成了,假设我们的网站内容都建好了。三、commit push内容到我们刚才新建的仓库
在命令模式下进入到刚才的仓库文件夹下,用下面的命令提交,先别急着复制哦,看下下面的解释:git add . git commit -m "初始化个人主页仓库" git push Username for 'https://github.com': yanzhenjie Password for 'https://yanzhenjie@github.com':
命令要一行一行执行喔,第一行命令是添加所有文件到git,第二行是commit提交的内容到本地仓库,第三行是push本次仓库的内容到服务器,第四行是执行了第三行自动出来的,输入帐号确定,第四行是输入第三行后出来的,出入密码确定就完成了提交。恭喜你,个人网站搭好了
如果你的提交都完成了没有问题了,那么这个时候恭喜,你的个人主页已经搭建好了,不信你可以在浏览器访问下,比如我的:https://yanzhenjie.github.io,根据刚才说的规则输入你的地址看看喔。Github Pages个人主页绑定个人域名
我们刚才的域名可能不好记,比我的:yanzhenjie.github.io=严振杰.github.io,但是还是不如严振杰.com。so我们绑定一个好记的域名,所以我又去找Github Helper,又被我找到了哈哈哈:
打开看了看,果然找到了答案,我还是贴一个最重要的图:
这里再把上图中的流程叙述下,我们需要一个域名,没有的人去万网申请一个,然后需在刚才的仓库root中添加一个CNAME的文件,文件内容是我们的域名,在Github上看到推荐我们使用www的二级域名。申请域名
现在去阿里云·万网申请到域名,我的其中其中两个域名如下:解析域名到github pages的ip上
域名申请好之后就是解析域名到github pages的个人主页的ip,我们ping一下自己的主页的ip,在命令行:ping yanzhenjie.github.io,你的地址和我肯定不一样也许就是ping xxoo.github.io哈哈哈:
为我们的域名添加解析,记录类型都是A记录,记录值全部对应刚才ping出来的ip:
这里的www是一个二级域名,@或者不填是一级域名,两条记录的记录值都是刚才ping出来的ip。这样就能把我们的域名和github上的主页关联起来了。不要着急喔,现在在浏览器输入域名你会发现访问不到,继续往下看。添加CNAME文件到github仓库
在我们刚才创建index.html的地方创建一个名为CNAME的文件,里边的内容填你的域名,例如我的是’www.yanzhenjie.com’,这样就能做到访问yanzhenjie.com和www.yanzhenjie.com都redirect到www.yanzhenjie.com这个二级域名了,上文中说过这种方式是Github推荐的。
CANME文件的内容填好按照刚才提交index.html的方法把CNAME提交到Github,这个时候我们的域名绑定也就完成啦。可以在浏览器输入你的个性域名看看是不是OK啦。比如我的严振杰.com:www.yanzhenjie.com:
版权声明:转载请注明本文转自严振杰的博客: http://blog.csdn.net/yanzhenjie1003
相关文章推荐
- win10 安装Borland C++Builder 6后编译运行出
- matlab透视变换
- 在thinkphp中使用phpmailer发送邮件
- php重载
- (JAVA+TESTNG 二)Eclipse+TestNG搭建接口自动化测试框架
- java 常用习惯用法总结
- java并发编程实战笔记-死锁
- 成为php 高手的五个必经之路
- Set接口
- 姓名格式处理,"Last Name, First Name"
- 源码剖析.Python.深入源码剖析Flask程序请求上下文?
- 《機器學習實戰》學習筆記
- Mongoose Schemas定义中timestamps选项的妙用
- Python中使用装饰器来优化尾递归的示例
- 收集整理的非常有用的PHP函数
- spring的三种主要的装配机制
- Spring快速上手
- 线程执行器
- Java并发(一)线程管理
- 线程同步机制(一)--Synchronized,Lock