本文旨在分享使用Typora做笔记的一些心得
一、介绍
-
为什么要用Typora
- 作为一个程序员,在学习过程中打交道的不单单是文字,还有各种语言的代码块和公式,以及一些简单的流程图和思维导图(就目前而言),就其内容的复杂性而言,远远不是一个word文档就可以解决的.此外,更重要的是,我们往往还需要对笔记进行编辑以发布到个人的博客上(这样有助于在需要时查阅).可以看到,在许多博客都提供了md(Markdown语言)以方便我们进行编辑.然而,纵观大部分的网页版md编辑器,编辑与视图都是分离的——即需要在编辑完之后切换窗口以进行查看语法是否有误(这种情况在编辑公式时更是尤为明显).
- 而typora则稍不同,作为一款支持实时预览的Markdown文本编辑器,则近乎完全避免了因为频繁切屏或语法错误造成的时间效率的影响.同时它还支持图片的上传(这有一点我们将在之后着重提及)以及格式的转换(将在之后提及),可以将.md后缀的文件转换为pdf,docx等格式的文档.更重要的是,它是完全免费的!
-
上传博客
由于使用Typora本身写下的便是md格式的文本,在上传博客时我们只需要直接复制内容粘贴到博客上的即可(Typora会默认粘贴md格式的原文),或者进入源码模式再粘贴也可.这里需要注意的是图片的处理——由于md语法中记录的是图片的位置,这样一来在博客上的图片显然是无效的,以下是三种解决方法:
- 选择图片手动上传
- 将需要上传的图片截图,然后复制到对应的位置
- 图床:以上两种都需要对每张图片进行单独的操作,而图床只需要一次操作即可,在后面我们会讲解操作
注:合理地切换Typora的源码模式可能会给我们的排版带来一些出其不意的效果
二、MarkDown语法
这里主要介绍一些Typora中常规易用的md语法
-
表意语法
#:一级标题######:六级标题1.: 有序列表*:无序列表
注:
-
标记必须相对顶格(标记前没有字符),后面必须接一个空格
-
在列表的头部键入
Backspace即可删除前置的标记 -
在列表的结束键入
Enter即可添加下一个阶段的标记如:有了1开头的列表,回车即可获得2开头的列表(无序列表则生成与上一阶段相同的标记)
-
在使用以上语法时,熟悉
Enter和Backspace键可以给你带来极大的方便
-
字体语法
*斜体*:斜体**加粗**:加粗~~删除线~~:删除线[链接](www.baidu.com):链接
在这里使用快捷键可以在一定程度上提高效率:
ctrl + k:先复制一个链接,然后选中要放上链接的文字或者图片然后使用快捷键ctrl + b:选中文字,使用快捷键
-
引用及代码块添加
-
> 引用:引用 (需顶格)
-
`行内代码块`:
行内代码块(sadly,这边的演示无法再直接用"`"包裹) -
```java
代码块
```
代码块注: 代码块是可以选择相应的语言的
-
-
其它
之所以要分出其它一类在于我认为某些情况下使用md语法是费力不讨好的事,这样的事应该大多交给Typora的快捷来完成
-
表格:表格的排版是比较麻烦的,这里建议直接使用Typora的工具生成和调整
1 1 1 1 1 1 1 1 1 1 1 1 -
图片:使用截图后粘贴或者直接将图片导入
-
注:以上的内容稍微参考了一下简书里的一篇文章
四、LateX公式
查阅了一定的资料,发现LateX也是一种标记语言,但更多地应用于论文的编排.这里我们主要介绍在Typora中如何使用LateX的公式(或者说是md中整合的LateX公式的基本用法),介绍的重点在于上标,下标以及一些特殊表达式的使用
-
准备工作
打开Typoa和LateX公式相关的设置,进入
File -> Preference -> MarkDown,勾选以下内容:- Inline Math:行内数学公式
- Subscript:下标
- Superscript:上标
-
Typora中公式引入的两种方式
-
行内公式:
$公式$ -
块级公式:
$$ 公式 $$
-
-
下标
-
单下标
$a_1$:(a_1) -
多下标:使用{}包裹即可
$a_{b1}$:(a_{b1})
-
-
上标
-
单上标
$a^1$:(a^1) -
多上标:使用{}包裹即可
$a^{b1}$:(a^{b1})
-
-
特殊表达式
LateX对于公式的支持是比较完整的,既包括了加减乘除,分数开根等一些简单的运算公式,也包括了积分,向量,求极限等复杂的运算公式.这里主要介绍一些常用的函数以及符号标记,如果要查阅更完整的内容可以参考网上的相关博客
-
常用表达式
表达式 显示 frac{分子}{分母}(frac{分子}{分母}) sum_{下标}^{上标}{表达式}(sum_{下标}^{上标}{表达式}) prod_{下标}^{上标}{表达式}(prod_{下标}^{上标}{表达式}) -
特殊字母
表达式 显示 alpha(alpha) eta(eta) mu(mu) pi(pi) varphi(varphi) -
通过对以上内容的拼接,即可完成一些基本的表达式的书写,https://www.acwing.com/blog/content/1727/
-
五、Typora
聊完了md,lateX公式等前置的信息,我们可以正式开始聊聊Typora了
-
下载
价格:免费
支持平台:windows,linux,os
注:由于服务器在境外,下载比较慢,这里提供一个百度云的下载链接,提取码:3399,于2020.7下载,如果官网下载不了的朋友可以自行下载领取.
-
定制Typora
下载好Typora,熟悉了md语法以及Latex公式,您应该能够初步地使用这个程序了.但是为了更好地使用它,对它进行定制,我们还应该稍微了解一下它的实现原理
-
倘若你有一定的前端开发经验,那么当你打开视图的开发者工具(事实上,许多人看到这个词估计心里就有数了),可能会惊讶地发现Typora原来是个浏览器!而且根据这个调试工具的风格还能更近一步地猜想到是基于Chrome的浏览器内核开发的.
-
事实上,也的确是如此的.Typora正是使用了electron框架进行开发的.而electron是一个基于Chromium 和 Node.js,帮助我们使用 JavaScript，HTML 和 CSS 构建跨平台的桌面应用程序(也就是我们下载的桌面应用,如Typora)的框架.
-
既然Typora可以看做是浏览器,那么可以想见Typora实际所做的工作也就是将我们写下的内容翻译成html+css,然后用浏览器将其渲染出来.那么我们要如何定制自己的Typora呢?答案不言而喻,只需修改一下对应的css即可.打开
偏好设置->外观->打开主题文件夹,在主题文件夹下有多个css文件,查看Typora上方的主题栏便可知晓当前使用的主题(默认为github).(1).查看原文件:(这里以一个5级标题为例)
h5 { font-size: 1em; }(2).尝试修改文件:
h5 { font-size: 2em; }(3).重启,可以看到对应的标题字体的确变大了
有喜欢整一些花里胡哨东西的朋友可以开始搞起来了!
-
补充:这样的css调整不仅能在本地使用,还可以将对应的css放到博客上设置使用
-
六、图床
-
当我们在本地使用图片时,实际上对应的是该图片在本地的地址(如果是截图,在复制过后会自动在本地产生一个地址).这种情况在本地使用是无妨的,但是当我们想要将对应的md原码直接放到bolg上就出现问题了,因为赋值过去的图片链接是错误,为此我们需要对每张图片一一进行操作,显然这就带来极大的不便.
-
解决的方法之一便是图床.所谓图床就是储存图片的服务器.具体工作原理见下图,相信大家可以很容易地理解其工作原理,而在Typora内部也有与之相对应的设置.
图床使用方法贴知乎链接:https://zhuanlan.zhihu.com/p/137310314 (具体的操作在评论区的置顶)
注:如果大家使用的是阿里云的图床,最后即使有报错可能也不影响实际的使用,但需要在服务器的文件夹中确认相关的图片已经上传了
七、转换文本格式
虽然有许多网站支持.md文件,如简书,博客,github等,但大多局限于程序员的圈子,如果要对外发布通常还需要转换为PDF或者word等格式.为此,我们在选择文件 -> 导出 ->PDF时只需要依照提示安装一下Pandoc工具即可非常便捷地完成格式转换
注:PDF格式与css相关,.docx格式与css无关
八、使用ProcessOn进行绘图
也许你会感到很神奇:md语言是可以绘图的!但就个人而言我无法想象复杂的流程图的绘制要如何通过md语言完成.为此,在这里我推荐使用免费的ProcessOn网站进行流程图,思维导图的绘制(就如以上完成的两张图),之后截图,复制即可.
以上,如有问题,欢迎大家留言讨论