Cleaver快速制作网页PPT
原文首发链接:http://www.jeffjade.com/2015/10/15/2015-10-16-cleaver-make-ppt/
写在开始之前
互联网时代,以浏览器作为入口,已经有越来越多的桌面应用被web应用所取代。微软最赚钱的Office办公软件,也正在被免费的web应用所吞噬。如今即便薄学如我就已然知晓reveal.js impress.js等各种轮子来制作体验优良的网页PPT。今天就来尝试下这Node.js的轮子Cleaver来制作网页PPT。
Cleaver基于HTML5,用最短的时间做出超炫幻灯片。你还会坚持PowerPoint吗?
Cleaver介绍
如果你已经有了一个Markdown的文档,30秒就可以制作成幻灯片。Cleaver是为Hacker准备的工具。
Cleaver的官方发布页:http://jdan.github.io/cleaver/;
参考文章:30秒制作幻灯片 Cleaver。
Cleaver安装
系统环境(据悉:cleaver不支持win系统)
Linux: Ubuntu 12.04 LTS 64bit
node: v0.6.12
npm: 1.1.4
通过nodejs安装Cleaver
//局部安装Cleaver
~ mkdir nodejs-cleaver && cd nodejs-cleaver
~ sudo npm install cleaver
//全局安装Cleaver
~ sudo npm install cleaver -g
Cleaver基本使用
执行cleaver命令,解析一个markdown文件,会自动生成HTMl文档,欧耶,算是Pandoc的部分功能深入了;
用cleaver自带的例子:
//如是局部安装,运行下面一句就好
cleaver node_modules/cleaver/examples/basic.md
//如是全局安装,请跑起Like this:
cleaver /usr/local/lib/node_modules/cleaver/examples/basic.md
Cleaver配置选项option
title: Basic Example #HTML的标题名
author: #作者信息,在最后一页显示
name: Jordan Scales
twitter: jdan
url: http://jeffjade.com
output: basic.html
除此之外还有其他额外设置,譬如:
- theme: 皮肤(theme: jdan/cleaver-retro)
- style: css样式表(style: css/main.css)
- output: 生成的HTML文件名(output: basic.html)
- controls: 控制按钮(controls: true)
- progress: 顶部显示进程条(progress: true)
- agenda: 生成一个目录页(progress: false)
- encoding: 文档的字符编码(encoding: utf-8)
- template: 设置每张slide的模板(template: template/slide.mustache)
- layout: 设置HTML模板(template: template/layout.mustache)
Cleaver的正文内容:
Cleaver仅支持Markdown语法的,通过Markdown构建网页内容,Markdown官方网站:http://daringfireball.net/projects/markdown/
需要注意的是,Cleaver以” — “(两个中横线)做为分页的标志,其他语法都遵循Markdown规则。
MS Office PowerPoint 正在被渐行渐远。。。
写在最后
相比于之下,impress.js, reveal.js以及Cleaver三者各有特色吧;在唯快不破的理论下,Cleaver自然占据了无与伦比的优势,只是像动画,样式等比于impress是一个短板。并且,在写此文的时候欲以Cleaver来呈现的,不过总是报出下面这样的问题(Mac OS X Yosemite):
!! Cannot read property 'compiled' of undefined
Please report this to https://github.com/chjj/marked.
花了些许时间来探究这个问题,只是现在网络上目测关于这个信息不是很多。逐一对比之下,文章的格式没什么问题。在即将放弃的时候,发现原来是标记代码的时候用了````shell`,所造成的问题,去掉shell或者换成别的标记就没有问题了。额...。
这里是此文的PPT版本(Cleaver);当然,这个是需要在PC偏高些的浏览器上才能正常查看。
原文链接:http://www.jeffjade.com/2015/10/15/2015-10-16-cleaver-make-ppt/
Cleaver快速制作网页PPT的更多相关文章
- HTML第二部分表单及使用Photoshop快速制作网页
一.表单 <form id="" name="" method="post/get" action="负责处理的服务端&qu ...
- 怎么使用dreamweaver制作网页教程 dw建站设计网页
对于网页制作相关专业人士一定对dreamweaver有所认识,下面小编就问大家总结一下相关网页制作的一些步骤,喜欢的朋友可以一起来学习一下 Dreamweaver这一款专业的网页制作软件,相信相关 ...
- 如何使用Python快速制作可视化报表----pyecharts
如何使用Python快速制作可视化报表 数据可视化能力已经越来越成为各岗位的基础技能.领英的数据报告显示,数据可视化技能在2017年中国最热门技能中排名第一. 就数据分析而言,可视化探索几乎是你正 ...
- h5快速制作工具-企业级. 非个人无水印
Epub360 Epub是团队引入的专业级H5应用开发工具,能够快速制作出高质量的H5运营交互页面,具有动画控制.交互设定.社交应用和数据应用的特点,其制作过程就类似于制作一个PPT,比较容易上手. ...
- Photoshop将普通照片快速制作二次元漫画风格效果
今天为大家分享Photoshop将普通照片快速制作二次元漫画风格效果,教程很不错,对于喜欢漫画的朋友可以参考本文,希望能对大家有所帮助! 一提到日本动画电影,大家第一印象肯定是宫崎骏,但是日本除了宫崎 ...
- 前端开发css实战:使用css制作网页中的多级菜单
前端开发css实战:使用css制作网页中的多级菜单 在日常工作中,大家都会遇到一些显示隐藏类菜单,比如页头导航.二维码显示隐藏.文本提示等等......而这些效果都是可以使用纯css实现的(而且非常简 ...
- 推荐几款制作网页滚动动画的 JavaScript 库
这里集合了几款很棒的制作网页滚动动画的 JavaScript 库和插件.它们中,有的可以帮助你在页面滚动的时候添加动感的元素动画,有的则是实现目前非常流行的全屏页面切换动画.相信借助这些插件,你也可以 ...
- 【公开课】《奥威Power-BI基于微软示例库(MSSQL)快速制作管理驾驶舱》文字记录与反馈
本期分享的内容: <奥威Power-BI基于微软示例库(MSSQL)快速制作管理驾驶舱> 时间:2016年11月02日 课程主讲人:叶锡文 从事商业智能行业,有丰富的实施经验,擅长 ...
- 10月26日 奥威Power-BI基于微软示例库(MSOLAP)快速制作管理驾驶舱 腾讯课堂开课啦
本次课是基于olap数据源的案例实操课,以微软olap示例库Adventure Works为数据基础. AdventureWorks示例数据库为一家虚拟公司的数据,公司背景为大型跨国生产 ...
随机推荐
- Hadoop 中利用 mapreduce 读写 mysql 数据
Hadoop 中利用 mapreduce 读写 mysql 数据 有时候我们在项目中会遇到输入结果集很大,但是输出结果很小,比如一些 pv.uv 数据,然后为了实时查询的需求,或者一些 OLAP ...
- 【调侃】IOC前世今生
前些天,参与了公司内部小组的一次技术交流,主要是针对<IOC与AOP>,本着学而时习之的态度及积极分享的精神,我就结合一个小故事来初浅地剖析一下我眼中的“IOC前世今生”,以方便初学者能更 ...
- 我为Net狂 ~ 社交平台系列小集合!
微信平台: 我为Net狂(dotNetCrazy) 资源贴吧: http://tieba.baidu.com/f?kw=毒逆天 个人博客: http://dunitian.cnblogs.com/ h ...
- 《你不知道的JavaScript》整理(四)——原型
一.[[Prototype]] JavaScript中的对象有一个特殊的[[Prototype]]内置属性,其实就是对于其他对象的引用. var myObject = { a: 2 }; myObje ...
- 自己来实现一个简易的OCR
来做个简易的字符识别 ,既然是简易的 那么我们就不能用任何的第三方库 .啥谷歌的 tesseract-ocr, opencv 之类的 那些玩意是叼 至少图像处理 机器视觉这类课题对我这种高中没毕业的人 ...
- python enumerate 用法
A new built-in function, enumerate() , will make certain loops a bit clearer. enumerate(thing) , whe ...
- android计算每个目录剩余空间丶总空间以及SD卡剩余空间
ublic class MemorySpaceCheck { /** * 计算剩余空间 * @param path * @return */ public static String getAvail ...
- Atitit godaddy 文件权限 root权限设置
Atitit godaddy 文件权限 root权限设置 1. ubuntu需要先登录,再su切换到root1 2. sudo 授权许可使用的su,也是受限制的su1 3. ubuntu默认吗roo ...
- 在VMware上安装CentOS -7
1.下载好VMware 2.准备好CentOS的镜像文件 3.打开VMware创建新的虚拟机 选择自定义高级后按下一步 继续下一步 选择稍后安装操作系统 客户机操作系统选择Linux,版本选择Cent ...
- linux启动SSH及开机自动启动
本文地址 分享提纲: 1.查看是否启动 2. 设置自动启动 1.[查看是否启动] 启动SSH服务 “/etc/init.d/sshd start”.然后用netstat -antulp | grep ...