MDX-PPT,写PPT可以这么得简单
大家好,这是本周的第二篇推送来,同样是之前忙碌的那段时间的成果,希望对大家有帮助,相信这个工具还是比较符合一些需求场景的。
另外上一篇推送有些问题,新的博客地址是 https://jokcy.me,而不再是 blog.jokcy.me了。
介绍
项目地址,先来一波 star 如何 😊
mdx-ppt 是一个帮助你快速创建类似 PPT 展示的网页的工具,你可以非常方便得通过写一个 Markdown 文件,创建一个 PPT 网页。
这类工具非常多,那么我为什么要重新开发一个呢?因为我用过的很多都是纯 Markdown 的,虽然同样方便,但是限制就变得非常多,因为 Markdown 的语法就那么一些,通常我们会通过增加语法来达到功能扩展的目的,但是这毕竟不是一般使用者能做的事情,而且语法多了之后页面会变得非常乱。
所以 mdx-ppt 选择的是 MDX,他让我们可以在 Markdown 语法的基础上,使用 React 组件,你可以像写一个 React 组件一样使用 React 的其他组件。
# This is markdown file
import Comp from 'your-component-path'
<Comp />
通过上面的代码,你就可以在最终生成的页面上,展示 <Comp />
组件渲染出来的内容。
完整的例子可以查看这里
通过这种方式,我们给了你无限的扩展能力,你可以用 Markdown 来排版你的简单功能。而在你需要展示一些复杂的功能的时候,你就可以通过一个 React 组件来实现。同时你还能享受 React 的所有生态功能。
同时 mdx-ppt 提供了你非常丰富的扩展能力,你可以通过写一个 js 模块来自定义你的页面展示,对于 Markdown 的所有语法,都会有对应的组件来进行渲染,也就是说每个组件你都是可以自定义的。
// your theme.js
import styled from 'styled-components'
export default {
components: {
p: styled.p`
color: red;
`,
},
}
然后你的页面上的所有 p
标签内的文字颜色都变成来红色。
详细配置可以看项目介绍
初衷
之前一段时间在慕课网上做课程,要求一定要提供 PPT,迫于无奈,每次都要做挺多的 PPT。
PPT 对于我这样平时基本不碰的开发者来说,排版无疑是非常蛋疼的一件事情。而且大部分 PPT 都长一样的情况下,每个 PPT 我还是得重新排版。而且 PPT 需要安装来才能访问,这无疑对于分享来说是非常不方便的。
所以在最近有空的时候搞了这个项目。做这个项目倒也不是说一定要做得多么牛逼,最首要的是符合自己的需求,当然既然当作开源项目拿出来推广了,如果有人提了 issue 或者 PR,那也是会根据情况考虑的。
我相信这个工具对于开发者来说是非常方便的,尤其是对于前端开发者来说。
以上,就是这次的项目介绍,最后希望来一波 star,你的关注能给予我很大的动力!