[前端]jekyll+markdown+github搭建个人博客

简介: 机器环境:Win7 64位安装rubyinstaller.到http://rubyinstaller.

机器环境:Win7 64位

  • 安装rubyinstaller.

    1. http://rubyinstaller.org/downloads/下载ruby安装文件,这里下载rubyinstaller-2.2.3-x64.exe,按照提示安装,勾选Add Ruby executables to your PATH.

    2. Win7 64位默认安装位置:C:\Ruby22-x64.

    3. 验证ruby是否安装成功:cmd中ruby -v显示ruby版本号说明ruby安装成功.
  • 安装rubygems.

    1. 官网下载安装包https://rubygems.org/pages/download
    2. 解压rubygems-2.4.8.zip到指定目录,为了方便管理解压后放到C:\Ruby22-x64\目录下.
    3. cmd进入rubygems-2.4.8目录下(快捷键:打开C:\Ruby22-x64\rubygems-2.4.8目录,shift+鼠标右键,点击”在此处打开命令行窗口”),运行ruby setup.rb .cmd 中 gem -v 显示版本号则说明正常.
  • 安装DevKit-mingw64

    1. 下载相应版本http://rubyinstaller.org/downloads/,在C:\Ruby22-x64\目录下新建DevKit文件夹,运行DevKit-mingw64-64-4.7.2-20130224-1432-sfx.exe后会提示解压目录,选择C:\Ruby22-x64\DevKit.
    2. 在C:\Ruby22-x64\DevKit中打开cmd,运行ruby dk.rb init,会提示配置config.yml.

    3. 打开C:\Ruby22-x64\DevKit目录下的config.yml,将ruby根目录加入到配置文件中,这里是C:/Ruby22-x64.如果有了就不需要再加.注意格式.

    4. 执行ruby dk.rb install.

  • 替换rubyGem库地址(相当重要,因为国内访问外网有线路问题,不仅更新速度慢,而且还会导致更新失败)

    1. gem sources –remove https://rubygems.org/
    2. gem sources -a https://ruby.taobao.org/ (注意:一定是https,淘宝已暂停http的ruby服务)
    3. gem sources -l验证一下.
  • 安装rails

    1. cmd运行gem install rails.
    2. cmd运行rails -v显示rails版本号说明安装成功.
  • 安装jekyll
    1. cmd运行gem install jekyll
    2. cmd运行jekyll -v验证,显示版本号说明安装成功.

环境配置完整之后,下面进入正题,如何新建博客:

  • 运行命令:jekyll new 文件夹名,比如jekyll new blog,会在当前目录生成blog文件夹.

  • 在生成的blog文件夹根目录下运行命令:jekyll serve –watch

  • 浏览器中打开localhost:4000,命令运行过程中没有错误提示,浏览器中显示默认页面说明安装成功.

  • 使用markdown发布博客

    1. markdown是什么? 参考淘宝UED关于markdown的介绍http://ued.taobao.org/blog/2012/07/getting-started-with-markdown/. 锤子手机发布会上罗永浩介绍了锤子科技出品的app**锤子便签**支持markdown功能,下载地址:http://bbs.smartisan.com/forum-92-1.html,非常好用,建议下载体验一番.

    2. 将markdown、html格式的文件以”YY-MM-DD-finename.filetype”命名放到_post文件夹下:如2015-09-10-firstpost.markdown.

  • 发布到github

    1. 首先注册一个github账号.
    2. 新建repository,以username.github.io的形式命名.
    3. git提交本地代码到github.
    4. git提交命令
  • 参考文章

    1. 每个人都应该有一个Jekyll博客
    2. git教程
  • jekyll 2.5.3 | Error: Permission denied - bind(2) for 127.0.0.1:4000 出现这个错误说明端口被占有,打开_config.yml,加入一行:port:5001(没有被占用的端口均可)即可解决.

目录
相关文章
|
12天前
|
存储 JavaScript 网络架构
【开源图床】使用Typora+PicGo+Github+CDN搭建个人博客图床
【开源图床】使用Typora+PicGo+Github+CDN搭建个人博客图床
25 3
|
1月前
|
前端开发
914.【前端】Taro集成towxml渲染markdown文档
914.【前端】Taro集成towxml渲染markdown文档
50 2
|
1月前
|
Shell 网络安全 开发工具
Github Pages + Jekyll 独立博客一小时快速搭建&上线指南
Github Pages + Jekyll 独立博客一小时快速搭建&上线指南
60 1
|
4月前
|
资源调度 前端开发 JavaScript
不花一分钱,用Hexo和GitHub Pages搭建个人博客🏢
不花一分钱,用Hexo和GitHub Pages搭建个人博客🏢
|
1月前
|
程序员 API Android开发
使用 VS Code + Github 搭建个人博客
搭建个人博客的方案
32 1
|
6月前
|
前端开发
【前端】从markdown格式文本中提取图片链接
【前端】从markdown格式文本中提取图片链接
56 0
|
9月前
|
XML SQL 缓存
Spring Boot + vue-element 开发个人博客项目实战教程(二十六、前端首页统计完善及完结)
Spring Boot + vue-element 开发个人博客项目实战教程(二十六、前端首页统计完善及完结)
101 0
|
9月前
|
缓存 前端开发 数据可视化
Spring Boot + vue-element 开发个人博客项目实战教程(二十五、项目完善及扩展(前端部分))
Spring Boot + vue-element 开发个人博客项目实战教程(二十五、项目完善及扩展(前端部分))
188 0
|
9月前
|
JavaScript
Hexo+GitHub搭建个人博客
Hexo+GitHub搭建个人博客
61 0
Hexo+GitHub搭建个人博客
|
10月前
|
缓存 JavaScript 网络安全
使用Hexo在Github上搭建个人博客
使用Hexo在Github上搭建个人博客
93 0