[Ting's笔记Day2]在Github用Jekyll创建自己的blog
昨天工程师在我们共同的群组分享他的blog，他提到是使用Jekyll（一个简单静态blog网站生成器）架在github上的。
于是好奇的我决定照着关键字来搜寻一下，如法炮制做一个出来。
也可以放一份到自己的Blog(zflwx)！
A.在你自己的Github帐号建立新文件夹github.io
名称必须是你的username.github.io
建好后下载这个文件夹。
补充：Github是个放程序的地方，最多只能呈现特定的静态页面（适合放blog/履历表之类的内容。）
无法放搭配服务器与数据库共同运作（例如会员登入、购物车等功能）的动态网站，！
如果想架动态网站，可以去Heroku
B.在github.io文件夹内新增首页
刚刚下载的文件夹，预设会储存至本机端电脑的这个路径（以我的Mac为例）：
/Users/tingtinghsu/Documents/GitHub/tingtinghsu.github.io
在本机里的yourusername.github.io新增空白页面index.html，使用html语法编辑。
来改一下简单的Hello World Style代码：
<！DOCTYPE html PUBLIC“-//W3C//DTD HTML 4.01//EN”“http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
</head>
<body>
<h1>Hello Ting Ting！</h1>
<p>This is my GitHub Pages.</p>
</body>
</html>
这时候猫猫工程师在我耳朵旁边OS打广告：VS code好用！
改好后，重点来了！先git commit to Master（储存修改到本机），再git push（上传将你要发布的网页到Github的文件夹上）
给Git新新手的连接：
常用Git指令，网络上资源非常丰富，我参考这里博客，
如果新手想先跳过git指令本机端的图形界面编辑器，可以下载Github桌面版。
好啰！来地址栏试试看自己的blog阳春首页会不会出现？
http://tingtinghsu.github.io/
成功！
C.在本机上装Jekyll
Jekyll
Jekyll是base on ruby开发的博客网站生成器，需要的版本要ruby2.0以上。
在termimal输入ruby -v确定一下版本：
Ruby版本没问题，就可以输入指令在本地安装Jekyll
gem install jekyll
建一个新文件夹写Blog的指令：
jekyll new myblog
cd myblog
开启Jekyll服务器：
jekyll serve
在地址栏输入http://localhost:4000/
应该会出现这样的画面：
接下我们就可以在本地端进行完修改网页，再用git上传。
到你的网志连接：http://tingtinghsu.github.io/
就可以看到改好的页面了～～
[后记：]
安装Git这部分我卡住了一段时间，因为以前没有相关的观念。
感谢工程师教学(leafor)：
每次上传前的好习惯是要输入git status：先用git看看哪些文件夹还没有merged
如果出现了Unmerged paths，代表本地曾经新建过的新档案，Github上还没备份：
（use“git add <file>…”to mark resolution）
added by them: _posts/2018-08-24-my_first_jekyll_page.markdown
both modified: _site/feed.xml
both modified: _site/jekyll/update/2018/08/24/my_first_jekyll_page.html
git add .：把所有更改过的所有网页加入暂存变更
如果只要加入某个特定网页，就在git add后加上网页路径
git status:确定一下刚刚是否已经存入暂存变更
绿色的字就是已经存入：
git log:commit过的动作会进log做纪录，-m“”加上自己的注释：commit过什么事情
git push：记得要先commit后再push。
git pull：如果和其他人协同作一个博客/项目，有可能GitHub上的变更会比较新，此时要先Pull下来，再push上去，才会确保是最新版本喔！
看到逐渐新增的blog文章页面，很有成就感呢！：）
[Ting's笔记Day2]在Github用Jekyll创建自己的blog的更多相关文章
- [Ting's笔记Day8]活用套件carrierwave gem:（3）Deploy图片上传功能到Heroku网站
前情提要: 身为Ruby新手村民,创造稳定且持续的学习步调很重要,我用的方法就是一周在IT邦写三篇笔记,希望藉由把笔记和遇到的bug记录下来的过程,能帮助到未来想用Ruby on Rails架站的新手 ...
- Github pages + jekyll 博客快速搭建
Github pages + jekyll 博客快速搭建 寻找喜欢的模版 https://github.com/jekyll/jekyll/wiki/sites http://jekyllthemes ...
- github page+jekyll搭博客初体验
div.oembedall-githubrepos { border: 1px solid #DDD; list-style-type: none; margin: 0 0 10px; padding ...
- 使用GitHub Pages+Jekyll搭建个人博客
GitHub Pages 免费无限容量的站点数据托管工具(国内访问速度较慢),内置Jekyll服务,能将特定名称的代码仓库动态编译为静态网页 Jekyll 基于Ruby的静态网页生成系统,采用模板将M ...
- 使用GitHub Pages + Jekyll 建立博客
https://pages.github.com/ http://jekyllbootstrap.com/usage/jekyll-quick-start.html Jekyll是一个静态网站生成器, ...
- 写作环境搭建(git+github+markdown+jekyll)
转载自: https://site.douban.com/196781/widget/notes/12161495/note/264946576/ 2013-03-04 19:33:10 --- ...
- Jekyll+GitHub Pages部署自己的静态Blog
混了这么久,一直想拥有自己的博客,通过jekyll和GitHub Pages捣腾出了自己的博客(https://www.ichochy.com) 一.安装jekyll 首先有安装Ruby的开发环境 运 ...
- GitHub 可以免费创建私人仓库啦
如果你不知道什么是 GitHub,也可以往下看,只不过可能感受不会那么深啦. 昨天,GitHub 博客发表了文章 其中比较重要的已经用蓝色线标注了. GitHub 支持开发者创建免费私人仓库,但是需要 ...
- .NET CORE学习笔记系列(2)——依赖注入[4]: 创建一个简易版的DI框架[上篇]
原文https://www.cnblogs.com/artech/p/net-core-di-04.html 本系列文章旨在剖析.NET Core的依赖注入框架的实现原理,到目前为止我们通过三篇文章从 ...
随机推荐
- File类相关操作
1.File类常见方法: 创建: boolean createNewFile():在指定位置创建文件 如果该文件已经存在,则不创建,返回false,和输出流不一样,输出流对象一建立就创立文件,而且文件 ...
- emmet简单记录
一.引式符号 html:5 or ! . class # id []标签内属性 pycharm不支持 {}标签的内容 pycharm不支持 ()分组标签 pycharm不支持 二.关系符号 1 ...
- controller向layout传值
Yii2,layout中使用Controller的值,Controller向layout传值的两种方式. yii2中在通过Controller向layout中传值,layout中访问Controlle ...
- ngnix 500错误原因分析
参考http://www.cnblogs.com/huqiang/p/5333975.html
- CodeForces - 660D：Number of Parallelograms （问N个点多少个平行四边形）
pro:给定N个点,问多少个点组成了平行四边形.保证没有三点共线. sol:由于没有三点贡献,所以我们枚举对角线,对角线的中点重合的就是平行四边形.如果没说保证三点不共线就不能这么做,因为有可能4个点 ...
- 位运算 - 最短Hamilton路径
给定一张 n 个点的带权无向图,点从 0~n-1 标号,求起点 0 到终点 n-1 的最短Hamilton路径. Hamilton路径的定义是从 0 到 n-1 不重不漏地经过每个点恰好一次. 输入格 ...
- day01计算机基础
今日内容 1.计算机初步认识 1.计算机认识 1. 计算机基础 1.1硬件:cpu/内存/硬盘/主板/网卡 1.2操作系统 linux:免费开源 windows mac 1.3解释器/编译器 补充:编 ...
- jquery绑定回车事件
//回车事件绑定 $(".left-content").keyup(function(event){ var theEvent = event || window.event; v ...
- 关于set_input_delay的用法分析
关于set_input_delay的用法分析 数据分为了系统同步和源同步: 对于下降沿采集数据的情况,当下降沿时钟延迟dv_afe到达无效数据最左端时,图中1位置,为最小延时,即采集不到有效数据的临界 ...
- minIni: A minimal INI file parser
https://www.compuphase.com/minini.htm https://github.com/compuphase/minIni