如何搭建个人博客: 新方案 blogdown + hugo + netlify + github

 关注
发布于: 2020 年 07 月 14 日
如何搭建个人博客:新方案 blogdown + hugo + netlify + github
程序员搭建博客有很多种手段:
在 Github 里使用 SUMMARRY.md 作为目录索引, 然后使用 Gitbook 变成电子书
直接在 Github issue 写文章
使用 Github Pages, 部署工具 Jekyll, Hexo, Hugo
购买域名, 服务器, 自己搭建个人博客
1,2 最简单, 3次之, 4最难,也最麻烦.
我尝试过 1,2,3. 也是够折腾的.
﻿
今天, 我发现第3种方案又有了新玩法, 主要也是参考这篇文章: 用R语言的blogdown + hugo + netlify + github建博客
﻿
建议大家把本文作为 用R语言的blogdown + hugo + netlify + github建博客 的补充性文章.
新方案在 3 hugo 基础上使用 blogdown 生成创建静态网站, 然后使用 netlify 对静态网站进行部署.
﻿
相比 Github Pages, netlify 对 Github 作为博客的仓库的命名没有限制, 可以随意取, 理论上可以创建N多个网站(N=可创建的仓库的数量). 你可以直接使用 netlify 的二级域名来访问博客.
一些名词RStudio : 是专门针对 R 开发的一款 IDE.
Rmarkdown : 是 RStudio 网站开发的一个项目，旨在通过 Markdown 结合 R 来完成文章写作
LaTeX : 是一种通过宏语言进行文档排版的排版系统, 它提供了丰富的功能, 但是符号多, 学习更为繁琐
pandoc : 是一把用于文档转换的瑞士军刀。通过它进行任意格式的文档转换，同时排版结果也不失美观
blogdown : 提供使用 R Markdown 创建静态网站的支持
bookdown : 使用 R Markdown 写电子书
netlify : 对静态网站进行部署, 提供域名支持
﻿
我们来一步一步搭建出个人博客,Imymirror的个人博客 是我搭建完成后的成果.
安装R语言中国站下载存档：https://mirrors.ustc.edu.cn/CRAN/
下载PKG, 比如现在最新的 R-4.0.2.pkg, 双击按照提示一步步安装.
安装完成后, 在终端输入 大写 R, 就会进入 R 语言 Shell.
更换 R语言安装源（镜像）国内的源:
清华CRAN镜像：https://mirrors.tuna.tsinghua.edu.cn/CRAN/
同济CRAN镜像：https://mirrors.tongji.edu.cn/CRAN
北交大CRAN镜像：http://mirror.bjtu.edu.cn/cran
﻿
创建一个 ~/.Rprofile 文件
## Default repo  
local({r <- getOption("repos")  
       r["CRAN"] <- "https://mirrors.tuna.tsinghua.edu.cn/CRAN/"  
       options(repos=r)  
})  
﻿
下载 RStudio﻿
官网下载地址 :RStudio | Open source professional software for data science teams
RStudio 一些基本配置Tools -> Global Options -> Sweave -> Weave Rnw files 选择 using:knitr
Tools -> Global Options -> Sweave -> Typeset LaTex into PDF 选择 using:XeLaTeX
这个是生成 PDF 文件用的，中文用户最好选择 XeLaTeX
Tools -> Global Options -> Git/SVN -> Git executable: : 安装好 git 后，打开这里应该就可以看到 git 的路径,如果没有进行配置
安装 blogdown 和 hugo
﻿
install.packages('blogdown')  
﻿
blogdown::install_hugo()  
Github 创建 repository填写好 repository name、Description，默认选择 Public
复选框 Initialize this repository with a README
add .gitignore选择R
repository name 没有要求，不像 github 的 pages 服务要求名字和 github 的账号名称一样，建议起名domainname.com
blogdown 建站rstudio，File -> New Project -> Version Control -> Git
填写 Repository URL: https://github.com/yourGithubName/domainname.com
设置 gitignore打开 rstudio 右下角的Files标签，点击.gitignore文件，改成下面这样（参考 Yihui）：
.Rproj.user  
.Rhistory  
.RData  
.Ruserdata  
public  
static/figures  
blogdown  
﻿
初始化 blogdown打开：File -> New Project -> New Directory -> Website using blogdown
因为我们已经安装了 hugo，所以去掉 hugo 选项，Yihui 是建议用 hugo-xmin 主题开始我们的 blogdown 之旅
我使用的是olOwOlo/hugo-theme-even主题
本地运行网站点击菜单 Tools 下面的Addins 点击Serve Site，可能会提示安装几个包例如 shiny、miniUI 等，点击 yes 安装
等价操作为 blogdown::serve_site()
写博客Tools 下面的 Addins，这次我们点击New Post, 相当于 blogdown::new_post()
Filename 处会自动帮你填写为 Title 处的内容，Filename 和 Slug 还是建议使用字母，尤其是Filename，如果博文里面不需要用到 R 语言的代码计算结果生成图表的话，Format处就选择Markdown格式
点击Done，就会在/content/post文件夹下面生成一个文件名为2000-01-01-my-first-blog.Rmd
设置 netlify具体步骤见
打开 https://app.netlify.com
使用 Github 登录
New site from Git 按照步骤将 Github 博客的仓库跟 Netlify 关联起来
创建好之后, Site Setting -> Domian Management -> Custom domains 可以对默认的二级域名进行修改.
至此, 布置就完成了. 只要我们往 Github 的仓库提交 Markdown 文件, Netlify 就会部署代码, 我们访问相关域名即可.
对 Event 主题的配置文件进行修改打开根目录下的 config.toml 文件, 以下是我的修改项:
defaultContentLanguage = "zh-cn"    
title = "Imymirror 的个人博客"  
﻿
[author]       # essential                     # 必需  
  name = "Imymirror"  
﻿
[[menu.main]]             # config your menu              # 配置目录 将 name 改为中文  
  name = "首页"  
  weight = 10  
  identifier = "home"  
  url = "/"  
[[menu.main]]  
  name = "归档"  
  weight = 20  
  identifier = "archives"  
  url = "/post/"  
[[menu.main]]  
  name = "标签"  
  weight = 30  
  identifier = "tags"  
  url = "/tags/"  
[[menu.main]]  
  name = "分类"  
  weight = 40  
  identifier = "categories"  
  url = "/categories/"  
﻿
﻿
  since = "2020"             # 站点建立时  
﻿
  toc = true                  # 是否开启目录  
  mathjax = true            # 是否使用mathjax（数学公式）  
﻿
[params.gitalk]           # Gitalk is a comment system based on GitHub issues. see https://github.com/gitalk/gitalk  
  owner = "zhigang"              # Your GitHub ID  
  repo = "imymirror.netlify.app.site"               # The repo to store comments  
  clientId = "13c6a20eecafcb6e47b"           # Your client ID  
  clientSecret = "0e0ba3f90e399da84da20f93c5a86aa4477e64"       # Your client secret  
﻿
  [params.social]                                         # 社交链接  
    a-email = "mailto:ifmtcm2020@gmail.com"  
    # b-stack-overflow = "http://localhost:1313"  
    # c-twitter = "http://localhost:1313"  
    # d-facebook = "http://localhost:1313"  
    # e-linkedin = "http://localhost:1313"  
    # f-google = "http://localhost:1313"  
    g-github = "http://github.com/zhigang26"  
    # h-weibo = "http://localhost:1313"  
    # i-zhihu = "http://localhost:1313"  
    j-douban = "https://www.douban.com/people/158149431/"  
    # k-pocket = "http://localhost:1313"  
    # l-tumblr = "http://localhost:1313"  
    # m-instagram = "http://localhost:1313"  
    # n-gitlab = "http://localhost:1313"  
    # o-bilibili = "http://localhost:1313  
﻿