写了个程序员真香的简历制作工具
看效果
不废话直入主题,这里是编辑页面,你可以来尝试一下
用法
左边写Markdown
内容,右边显示渲染效果,纯前台数据,不涉及数据库
扩展语法
Markdown
本身并没有实现多列布局,以及针对简历布局的需要,所以我自己写了个插件来支持这些语法并实现Markdown
的一些常用语法(只实现了常用的),比如多列布局、图标、个人信息、主体内容布局语法等
多列布局
实现一个三列布局,原理就是flex
::: start
第1列
:::
第2列
:::
第3列
::: end
多列布局显示效果
图标语法
下面的语法将被解析为<i></i>
,可以通过下面即将介绍的自定义CSS
来对其进行样式设置,感兴趣可以自行尝试一下.
icon:github
图标显示效果
其他语法
更多可以查看这里的语法助手
工具栏
为了更自由的定制化需求,暴露了一些工具提供使用,这里以编写CSS
为例,写的CSS
可以直接作用在简历模板上
编写CSS
这里所有的样式都需要写在.jufe
容器下面,以防影响到其他节点的样式
设置后的效果
其他小功能比如自定义主题配色、自定义字体颜色、调节模板边距等可以自行尝试一下,就不过多赘述了,都是比较实用的功能
两种编辑模式
提供了两种编辑模式,markdown
模式和内容模式,提供内容模式主要就是给一些不熟悉 Markdown
的同学使用,那这里就介绍一下内容模式吧
点击切换编辑模式(左侧右侧工具栏都有提供切换按钮,这里使用左侧的)
这样就切换到了内容模式,这两种模式之间的数据是同步的,可以自由切换
内容模式本质就是一个富文本编辑器模式,就类似写
word
一样就可以了,比如想修改图标,直接点击想修改的图标就会弹出图标选择框,点击想替换的图标后直接就完成了替换,这个感兴趣的自行尝试吧
模板
模板目前有十几个,都随便用,没事的时候就会更新一下
其他
其实这个工具还有很多功能都没介绍,因为全部写下来的话篇幅会太大,感兴趣可以自己去尝试,都是些比较实用的功能
仓库
感兴趣可以点个Star
,感谢支持,如果你有不错的Idea
,欢迎给仓库贡献代码.
链接:https://juejin.cn/post/7245836790040657978
来源:稀土掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。