从零开始的博客搭建#01
Nov 28, 2020
»
开发
穷则思变，一个很棒的真理。从小时候玩盗版游戏使用各种破解软件开始，到Libgen下载pdf版本图书，工作中访问各种开源网站和博客搜索大佬们开源的解决方案与资料整理，互联网的时代只要花费时间和脑力，就可以获得高质量的资料和知识。当然这也需要相当多的辨识能力和经验，我想将来搜索和资料整理也会成为一门值得学习的学科。
因为穷，所以选择了免费的 github 来搭建个人网站。这里会贴上采用的一些方案和参考资料。如果可以服务到后人那就太好了。
Github 只能展示静态的页面，这基本满足我现在的需求：一个记录的地方，同时也可以当作个人简历使用。
模板采用的是 CatBook 开源模板，只需要把文章丢posts文件夹，表上日期就好了。需要给每篇文章增加一个 title，包含数个标签：
---
title: 从零开始的博客搭建#01
categories: [开发]
comments: true
---
title 标签的属性会被当作文章标题，以#1header的方式放在标题处，categories后方的标签则是在categories文件夹中定义的，直接照着模板抄即可，格式如下：
---
layout: page
type: 开发
---
#<!-- each category page -->
<div class="archive">
<p class="archive_year">2022</p>
<ul>
<li>
<time class='archive_date' datetime='2022-05-17T00:00:00-08:00'>
May 17
</time>
<div class='archive_title'>
<a href='/2022-05/hooks'>
React Hooks使用笔记
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2022-05-03T00:00:00-08:00'>
May 03
</time>
<div class='archive_title'>
<a href='/2022-05/ue5-01'>
UE5 学习笔记 - 尝试让角色做出一个可以触发其他实体事件的动作
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2022-01-04T00:00:00-08:00'>
Jan 04
</time>
<div class='archive_title'>
<a href='/2022-01/html-tabindex'>
彻底搞清楚 onKeyDown 与 tabIndex
</a>
</div>
</li>
</ul>
<p class="archive_year">2021</p>
<ul>
<li>
<time class='archive_date' datetime='2021-12-16T00:00:00-08:00'>
Dec 16
</time>
<div class='archive_title'>
<a href='/2021-12/sql'>
Gorm复杂SQL - 连表，Group，查找最后一个数据
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2021-08-01T00:00:00-08:00'>
Aug 01
</time>
<div class='archive_title'>
<a href='/2021-08/questionofCS'>
计算机科学的基本问题（2）红烧肉的制作过程
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2021-07-28T00:00:00-08:00'>
Jul 28
</time>
<div class='archive_title'>
<a href='/2021-07/questionofCS'>
计算机科学的基本问题（1）
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2021-04-03T00:00:00-08:00'>
Apr 03
</time>
<div class='archive_title'>
<a href='/2021-04/tech_diary'>
Unreal Paper2D 帧动画角色实现
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2021-04-03T00:00:00-08:00'>
Apr 03
</time>
<div class='archive_title'>
<a href='/2021-04/tech-tips'>
从UE接触到的小知识整理
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2021-04-03T00:00:00-08:00'>
Apr 03
</time>
<div class='archive_title'>
<a href='/2021-04/pixel-texture'>
Unreal Engine Paper2D 像素画素材的导入
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2021-03-22T00:00:00-08:00'>
Mar 22
</time>
<div class='archive_title'>
<a href='/2021-03/tech_diary'>
Unity按帧移动角色的实现方案思考
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2021-02-08T00:00:00-08:00'>
Feb 08
</time>
<div class='archive_title'>
<a href='/2021-02/diary'>
2021年2月8日
</a>
</div>
</li>
</ul>
<p class="archive_year">2020</p>
<ul>
<li>
<time class='archive_date' datetime='2020-12-12T00:00:00-08:00'>
Dec 12
</time>
<div class='archive_title'>
<a href='/2020-12/rougelike-pinball'>
无聊脑洞-弹球地牢-RogueLike Pinball
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2020-12-11T00:00:00-08:00'>
Dec 11
</time>
<div class='archive_title'>
<a href='/2020-12/dataFromStellaris'>
从群星（Stellaris）开始思考数值带来的游戏体验#2
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2020-12-10T00:00:00-08:00'>
Dec 10
</time>
<div class='archive_title'>
<a href='/2020-12/dataFromStellaris'>
从群星（Stellaris）开始思考数值带来的游戏体验#1
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2020-12-10T00:00:00-08:00'>
Dec 10
</time>
<div class='archive_title'>
<a href='/2020-12/dairy'>
2020年12月10日
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2020-11-29T00:00:00-08:00'>
Nov 29
</time>
<div class='archive_title'>
<a href='/2020-11/d20201129'>
2020年11月29日
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2020-11-28T00:00:00-08:00'>
Nov 28
</time>
<div class='archive_title'>
<a href='/2020-11/work_at_home'>
游戏草案-居家办公
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2020-11-28T00:00:00-08:00'>
Nov 28
</time>
<div class='archive_title'>
<a href='/2020-11/text_engine_module'>
基于Unity的文字冒险引擎
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2020-11-28T00:00:00-08:00'>
Nov 28
</time>
<div class='archive_title'>
<a href='/2020-11/d20201128'>
2020年11月28日
</a>
</div>
</li>
</ul>
<ul>
<li>
<time class='archive_date' datetime='2020-11-28T00:00:00-08:00'>
Nov 28
</time>
<div class='archive_title'>
<a href='/2020-11/build_1'>
从零开始的博客搭建#01
</a>
</div>
</li>
</ul>
</div>
其中大括号+百分号的语句写法在之前开发的过程中也见到过，但没有查到这种语法的来源。为了理解模板结构还是要想办法搞到这个语言的docs。
模板的布局采用的是scss和css的组合，想要理清楚它们的关系还需要不少的学习（捂脸）。我离一个真正的前端还有很长的路要走。